Разработка интерфейсов — одно из важнейших направлений в Яндексе, сервисами которого пользуются миллионы людей. А ни один российский вуз, к сожалению, не готовит разработчиков интерфейсов. Все знания, которые необходимы современному верстальщику или фронтенд-программисту, приходится черпать из статей в интернете, книг, докладов на конференциях. Но зачастую этого бывает недостаточно. Почти каждого нового разработчика интерфейсов, которого мы принимали на работу, приходилось многому обучать.

За долгое время работы в Яндексе нам удалось систематизировать все наши знания и огромный опыт в создании фронтенда веб-сервисов. Результатом этого осмысления и длительной работы стала первая Школа разработки интерфейсов, занятие которой шли в московском офисе Яндекса. Вся практическая часть обучения проходила в реальных проектах Яндекса. Теоретическая же состояла из лекций, которые читали ведущие разработчики интерфейсов Яндекса: Сергей veged Бережной, Михаил mishanga Трошев, Алексей doochik Андросов, Михаил azproduction Давыдов и другие.



Сегодня мы выкладываем видеозаписи каждой из них. Весь курс систематизирован и поделен на пять блоков: инструменты разработки, технологии в разработке интерфейсов, языки программирования, фреймворки, дизайн.

Картинки — один из самых высоконагруженных сервисов Яндекса. Его ежедневная аудитория приближается к 6 миллионам человек, а количество просмотров изображений составляет почти 120 миллионов. Чтобы сделать его более быстрым и удобным, одновременно с полным редизайном в сентябре мы значительно обновили технологическую составляющую. Обновление интерфейса мы продолжаем и сейчас, для чего постоянно проводим новые эксперименты и тестируем родившиеся идеи.

Про то, как появляются и какой путь проходят идеи перед тем, как попасть в интерфейс массового сервиса, я и хочу рассказать сегодня.



В сентябре мы запустили новый интерфейс Яндекс.Картинок, в котором отказались от просмотра изображения на отдельной странице. Врезку предпросмотра, которая стала «раздвигать» картиночную выдачу, мы внутри команды назвали «распашонкой».

Сегодня Яндекс присоединился к ЦЕРНу. Наше партнёрство с Европейским центром ядерных исследований переходит на новую стадию развития: у ученых из ЦЕРНа появится доступ к технологии машинного обучения Матрикснет от Яндекса, а также новым вычислительным мощностям. А Яндекс становится ассоциированным членом европейского Центра ядерных исследований в рамках проекта CERN openlab. Кроме него членами openlab являются Intel, HP, Oracle, Siemens и Huawei.

Сотрудничество Яндекса с Центром началось в 2011 году, когда мы впервые предоставили ЦЕРНу свои серверные мощности. А в апреле прошлого года наши разработчики создали поиск по событиям эксперимента LHCb. LHCb — один из четырёх основных экспериментов ЦЕРНа и один из примеров того, насколько важными в современной науке стали не только данные опытов, но и их обработка. В ходе опытов LHCb исследуются соударения b-кварка (b от английского beauty, по-русски его называют прелестным). Объём информации об этих событиях только за год достигает тысяч терабайт. Благодаря созданнному нами поисковому индексу у учёных ЦЕРНа появилась возможность мгновенно получать нужную информацию.

В современной фундаментальной науке важную роль стали играть не только технические ресурсы для проведения опытов, но и вычислительные возможности для обработки и понимания их результатов. В наши дни, особенно в ЦЕРНе, данных становится так много, что без применения сложных алгоритмов даже учёному будет сложно делать точные выводы о результатах опытов. Технологии, которые можно применять для таких целей, имеет совсем небольшое количество компаний.



Мы расспросили Андрея Устюжанина, руководителя проекта партнёрства с ЦЕРНом в Яндексе, о подробностях того, для чего именно ЦЕРНу нужна помощь Яндекса и как устроена работа с данными экспериментов. Смотрите видео и читайте более подробную текстовую версию после ката.

Не так давно мы подробно рассказывали про новые аттачи в Яндекс.Почте. В декабре в у нас появился новый просмоторщик картинок. Работать с изображениями в Почте благодаря этим нововведениям стало действительно проще и удобнее.

Тем не менее, оставалась ещё одна сложность: в связи с браузерными ограничениями изображения нельзя было вставлять прямо в тело письма. Картинку нужно было сохранить на своём компьютере и уже оттуда прикрепить к письму, как любой другой файл.

Мы долго думали над этой проблемой. Можно было использовать java-апплет или flash, но у этих решений были существенные ограничения. Например, при использовании java-апплета нужно будет обязательно разрешать выполнение апплета в браузере. В итоге мы решили использовать новые возможности современных браузеров, такие как Clipboard API, File API и Drag n Drop.

Читайте в нашем посте о том, как вставлять в письмо картинки из буфера обмена или по публичному URL и как добавлять их в тело письма простым перетягиванием с рабочего стола.

Недавно мы писали о нашем валидаторе семантической разметки. А сегодня хотим рассказать, зачем и почему он был сделан, какие сложности возникли при разработке и как мы с ними справились. Одна из причин, по которой мы его сделали, конечно, в том, что мы хотели избавить роботов от встреч с ошибками вебмастеров. Но руководствовались мы не только этим.



Медленно, но верно семантическая разметка набирает популярность. Чуть больше десяти лет назад (в мае 2001 года) впервые был введен термин «семантическая паутина». В 2004 году появилось первое упоминание формата RDFa, примерно тогда же начали развиваться микроформаты. В июне 2011 года был запущен стандарт schema.org. Сейчас семантическую микроразметку поддерживают и Яндекс, и другие ведущие мировые поисковые системы.

Однако вебмастера часто сталкиваются с тем, что валидаторы HTML выдают массу ошибок.

Одним из самых ярких событий уходящего года для нас стала Yet another Conference 2012. В числе её участников был и Александр Песляк, более известный как Solar Designer.

Как многие знают, он — основатель проекта Openwall, автор свободного программного обеспечения (в том числе популярной программы для аудита безопасности паролей John the Ripper). Solar Designer был техническим рецензентом книги о компьютерной безопасности Silence on the Wire Михала Залевского и написал для нее предисловие.

С докладами о компьютерной безопасности Александр участвовал во многих международных конференциях — HAL2001, NordU, FOSDEM, CanSecWest, PHDays. На YaC 2012 он рассказывал «Как защитить миллионы паролей». Перед выступлением мы взяли у него небольшое интервью. Solar Designer рассказал, как стал специалистом по компьютерной безопасности и поделился своим взглядом на её современное состояние.

Сегодня Сбербанк России и Яндекс объявили о стратегическом партнёрстве. Объект сделки — компания Яндекс.Деньги, которая теперь становится их совместным предприятием. Сбербанк приобретает 3/4 доли в установном капитале Яндекс.Денег за 60 млн. долларов США, у Яндекса сохраняется блокирующий пакет (25% плюс один рубль).

Для конечных пользователей сервиса Яндекс.Деньги всё и технически, и юридически остаётся по-прежнему. Им не нужно подписывать новое пользовательское соглашение. Условия обслуживания, открытия и закрытия счетов не меняются, и идентификация не становится обязательной (но Яндекс.Деньги по-прежнему её рекомендуют, чтобы снять некоторые лимиты, продиктованные новой офертой).

После оформления документов все пользователи money.yandex.ru останутся клиентами Небанковской Кредитной Организации «Яндекс.Деньги», действующей на основании лицензии Банка России.

Cуть сделки — не в слиянии, поглощении, покупке или передаче прав. То, что произошло, называется «Сделка по продаже доли в Яндекс.Деньгах». У Яндекса — блокирующий пакет, потому что компании интересно развивать совместный сервис вместе со Сбербанком. Есть разница между финансовым партнёром и стратегическим — так вот, Яндекс.Деньги искали и нашли партнёра именно второго типа.

Сейчас всё больше мобильных приложений становятся геозависимыми. Одни просто не имеют смысла без знаний о местоположении пользователя, другие становятся с ним удобнее. Это так называемые Location Based Services (LBS): навигаторы, форскверы, инстаграмы с геотегами фотографий и даже приложения-напоминалки, которые срабатывают около конкретного места, например, рядом с офисом или магазином.

Для сервисов и приложений Яндекса мы создали собственную реализацию метода определения местоположения без GPS — Яндекс.Локатор. Он экономит время пользователя и делает наши приложения чуточку умнее. В Навигаторе и Картах она избавляет от ввода начальной точки маршрута, даже если вы на крытой парковке. А при выборе фильма в Киноафише или товара в мобильном Маркете помогает сразу показать, где их найти именно в вашем районе города. Ну и, разумеется, при поиске кафе и банкоматов — позволяет показывать вам сразу ближайшие, даже когда вы в метро.


Технологию мы давно открыли в виде бесплатного API. Сегодня хотим рассказать, как она устроена.

Сегодня мы объявляем о важных изменениях в поиске Яндекса. Теперь результаты поиска и поисковые подсказки будут персонализированными и могут отличаться для каждого пользователя, который задаёт запрос и получает на него ответ от Яндекса.

Специально для Хабрахабра мы взяли интервью у людей, которые занимались этим проектом, и спросили у них о том, для чего он нужен, как устроен, какие факторы мы учитываем, а также о том, как измеряем пользу от него.



Когда-то давно для того чтобы показать человеку результаты поиска, поисковым системам было достаточно пользовательского запроса и собственного индекса. Две эти сущности легко себе представить. Но со временем стало понятно, что есть ещё одна очень важная штука — контекст запроса. Кто, откуда и когда его задаёт.

Три года назад при формировании результатов поиска мы начали учитывать регион пользователя.

Поисковые подсказки существуют в Яндексе уже больше четырёх лет. На профессиональном сленге мы называем их саджестом. Первоначально он формировался только на основе частоты тех или иных запросов. Со временем мы научили подсказки учитывать, из какого региона задаётся вопрос, связан ли он с каким-то недавним событием, можно ли показать пользователю сразу адрес сайта и какого. Ко всему прочему мы первыми из существующих поисковых систем внедрили технологию, которая позволяет саджесту учитывать предыдущий запрос пользователя и показывать ему контекстную подсказку. Теперь поисковые подсказки вступают с вами в диалог и меняются в зависимости от того, что вы только что искали.



Задача Яндекса — отвечать на вопросы, как заданные так и нет. Поиск — про заданные вопросы, но пользователю можно помочь их сформулировать.

Редко в московском офисе Яндекса в 10 утра бывает столько разработчиков, сколько их было утром субботы 24 ноября. И это был не очередной Я.Субботник, как вы могли подумать, а встреча Web Standards Days. В этот раз её совместными усилиями организовали Яндекс и объединение разработчиков «Веб-стандарты» при поддержке W3C.

Мы поговорили с организаторами WSD и некоторыми докладчиками, в том числе представляющими W3C. Они рассказали о том, как появилось мероприятие, какие задачи оно призвано решать и над чем они сами сейчас работают.



Сегодня мы делимся с вами слайдами презентаций, но скоро здесь будут доступны видео самих докладов.

29 ноября в офисе Яндекса в Питере я буду проводить научный семинар «DTrace — проверочная работа для вашего кода». Те, кто на YaC 2012 слушал мой доклад «Инфраструктура облачных вычислений на основе ядра Illumos» — да и многие другие — знают, что в Semonix я занимаюсь облачными технологиями, тесно связанными со SmartOS. На семинаре я расскажу, как с помощью технологии DTrace проводить глубокий анализ производительности и детально изучать работу приложения. Поиск по Хабру находит только одну статью про SmartOS, и чтобы на семинар пришло больше тех, кто уже знаком с ней, я решил заранее написать про установку SmartOS и использование Node.js на ней.

Для начала расскажу, для чего нужна SmartOS. Если коротко, её предназначение – быть хост-системой для виртуальных машин. Она часто используется как основа для публичных и частных облаков, например, облачных служб Joyent и MITAC. Службой Joyent пользуется LinkedIn: вся его мобильная серверная часть сделана на Node.js, который запущен в облаке Joyent. Мы подробно писали об этом в блоге компании Semonix в статьях о SmartOS и об облаках, основанных на illumos, а я рассказывал в докладе на YaC 2012, который уже упоминал.

Типичные случаи применения SmartOS – системы для ЦОДов, системы для разработки и эксплуатации нагруженного веб-приложения, платформа для создания приватного или публичного облака. При работе над этой статьей я активно использовал статью Сту Радниджа, который проделывал примерно такой же путь установки SmartOS, как и я, но с использованием VMware вместо VirtualBox.

Если вы занимаетесь тестированием веб-интерфесов, то наверняка задумывались о том, как сделать взаимодействие с веб-страницами в тестах максимально удобным. Среди тестировщиков очень широко известен шаблон проектирования Page Object. Но, несмотря на множество плюсов, у этого подхода есть и некоторые недостатки, которые сильно затрудняют его применение.

Наиболее существенные из них:

• невозможность повторного использования кода page-объектов для страниц с одинаковыми элементами;
• плохая читаемость и отсутствие наглядности кода для страниц с большим количеством элементов;
• отсутствие типизации элементов.

Из этого поста вы узнаете, как мы в Яндексе решаем эти проблемы с помощью фреймворка с открытым исходным кодом HTML Elements. Он расширяет концепцию шаблона Page Object и позволяет сделать взаимодействие с элементами на веб-страницах простым, гибким и удобным.

Мы не будем останавливаться на описании самого паттерна и его принципов, поскольку большинству из вас он наверняка хорошо знаком. Если же кто-то с ним не встречался, то узнать о нём можно из этого поста или мастер-класса. Также, говоря о применении паттерна Page Object, мы будем подразумевать его Java-реализацию в фреймворке Selenium WebDriver.

Повторное использование кода

Представьте, что вам понадобилось написать тесты не на какую-то отдельную страницу, а на весь веб-сервис. На его страницах наверняка будут встречаться общие блоки элементов: хедеры, футеры, возможно, какие-то одинаковые формы и т.д. Например, на главной странице Яндекса есть форма поиска, которая сохраняется и при переходе на страницу с поисковой выдачей.

Каждый месяц на Яндексе поиском по картинкам пользуется больше 20 миллионов человек. И если кто-то из них ищет фотографии [Мэрилин Монро], это не значит, что им нужно найти лишь самые знаменитые снимки актрисы. В такой ситуации результаты, в которых большая часть найденных изображений будет копиями одних и тех же картинок, вряд ли устроят пользователей. Им придётся пролистать большое количество страниц, чтобы увидеть разные фотографии Монро. Для того чтобы облегчать людям подобные задачи, нам нужно сортировать картинки в результатах поиска так, чтобы они не повторялись. И мы научились «раскладывать их по полочкам».



Когда в 2002 году в Яндексе появился поиск по картинкам, технологий, позволяющих компьютерам непосредственно «видеть», какие объекты есть на изображении, не было вообще.

Сегодня мы выпускаем значительное обновление Яндекс.Браузера. На самом деле, с момента его релиза в начале октября было уже четыре апдейта. Они включали в себя критические багфиксы, в том числе и устранение существовавших уязвимостей. Главное, что появляется в Браузере 1.1 — технология Opera Turbo, о которой, в частности, на YaC 2012 рассказывал и CTO Opera Software Хакон Виум Ли.

Режим Турбо позволяет в разы быстрее загружать страницы при низкой скорости интернет-соединения. Наш браузер стал первым после выпущенного самой Opera Software, в котором используется эта технология. 

Руководитель направления дистрибуции Яндекса Юрий Вечер и руководитель отдела десктопной дистрибуции Вадим Ковалёв в интервью на Роем.ру постарались максимально честно и полно ответить на все вопросы о том, как устроена дистрибуция Яндекса. Мы подробно рассказали про Яндекс.Бар, Элементы и другие наши продукты и объяснили, почему они такие, какие есть.

Мы понимаем, что и на Хабре у многих эта тема вызывает интерес, поэтому решили поделиться интервью и здесь:
roem.ru/2012/11/02/vecher56350

Если вы не найдёте в нём ответов на интересующие вас вопросы о дистрибуции Яндекса, вы можете задать их в комментариях. Я и Юра постараемся максимально полно на всё ответить.

Этот пост для тех, кому интересно, как в Яндексе создаются интерфейсы продуктов с многомиллионной аудиторией. Мы хотим максимально подробно рассказать, почему решили создать новую почту Trinity, чем руководствовались в работе над ее дизайном, поделиться с вами решением логических проблем.

На самые популярные и важные вопросы дизайнер нового интерфейса Анна Котляревская ответила в интервью:



Читайте и смотрите, почему мы осмелились убрать рекламу, почему нет групповых операций, куда делись ссылки на другие сервисы, почему нельзя отключить группировку писем по теме — и многое другое.

В конце августа Яндекс вступил в World Wide Web Consortium. Тогда, в том числе в посте на Хабре, нам задали много вопросов о том, зачем нам W3C, и что мы там собираемся делать.

Нашим представителем в W3C стал Чарльз МакКэтиНевил, и я воспользовался его приездом на YaC 2012, чтобы задать часть этих вопросы вживую.

Чарльз занимается стандартами Веба в W3C почти 14 лет. Раньше он был директором по веб-стандартам в Opera Software, а с июля 2012 года работает в Яндексе, учит русский язык и даже ведёт по-русски свой русскоязычный твиттер.

Кстати — если у вас есть вопросы к Чарльзу, которые мы ещё не задали, — смело задавайте их в комментариях. Обещаю получить у него ответы на стоящие и добавить их в интервью и/или ответить в комментариях же.

Каждый большой продукт включает в себя много сложных и интересных технологий, над созданием которых работали люди, зачастую посвятившие им целую жизнь. И в браузере Yandex реализованы многие разработки наших коллег, которые могут остаться не замеченными неспециалистами и казаться незначимыми деталями. Например, одной из облачных технологий Яндекса, которые интегрированы в Браузер, стал наш собственный переводчик.

Сам Яндекс.Перевод вышел из беты несколько месяцев назад. От других немногочисленных подобных сервисов его отличает автословарь, уникальная технология которого разработана командой лингвистов и программистов Яндекса. Во время его разработки удалось объединить современные статистические подходы машинного перевода и традиционные лингвистические инструменты.



Чтобы понять, насколько значимым шагом в развитии машинного перевода является появление автословаря, стоит вспомнить, что 20 лет назад были распространены синтаксические переводчики, для которых таблицы соответствия фраз на разных языках составляли вручную. Процесс их создания стал меняться только в конце 1990-х, когда появились первые статистические переводчики. Для обучения их моделям переводов стали использовать параллельные тексты. Документы, в которых одно и то же написано на разных языках, извлекали, например, из дипломатической документации. Большой базой параллельных текстов стали документы ООН. Но на подобной лексике создать общелексический переводчик не получилось, потому что даже неформальные тексты он переводил сухим дипломатическим языком.

Яндекс запускает Trinity — новый интерфейс почты, позволяющий экономить время в деловой переписке.



В новом интерфейсе все письма открываются на одной странице, они сразу сгруппированы по теме. Например, если в переписке с темой «Подготовка к презентации» уже много писем и участников, всю дискуссию легко прочитать в виде ленты на одной странице. Такой интерфейс позволяет сосредоточиться на главном — быстром чтении писем и работе с ними.