Дизайн и разработка фронтенда

•

0 likes•495 views

Дизайн и разработка фронтенда. Не секрет, что разработка интерфейсов продукта происходит на стыке двух миров: дизайна и технологий. Мы проанализируем основные тенденции в мире UI и веб-дизайна, рассмотрим новые инструменты и проследим влияние современных веб-технологий на повседневную работу дизайнеров. Вадим Пацев, Яндекс Руководитель отдела разработки интерфейсов. В Яндексе с 2008 года, побывал в роли и дизайнера, и разработчика интерфейсов. Интересуется быстрым прототипированием и визуальными возможностями современных веб-технологий.

Technology

Дизайн и разработка
фронтенда
Вадим Пацев, Руководитель отдела разработки интерфейсов

Обо мне
3
〉@basvasilich
〉basvasilich@yandex-team.ru
〉Участник сообщества «Веб-стандарты»
〉Руководитель отдела разработки
интерфейсов персонального
направления Яндекса

Mobile first
"Be responsive or go home"
5

К чему мы пришли
!
〉Несколько платформ и контекстов
〉Простой визаульный язык
〉Большое количество нового контента
21

Мы научились показывать
разный контент в вебе

Что дальше?
〉Работа с пространством
〉Интерактивные истории
〉Персонализированный опыт
35

Технических ограничений
в вебе становиться все
меньше. Стоит затачивать
инструменты.

Дизайн с каждым годом
становится все более
технической дисциплиной

Инструменты:
〉Adobe reflow CC — инструмент для дизайна приложений в
разных контекстах
〉Ionic — фреймворк для создания HTML5 приложений
〉Canvas, SVG:
D3.js, Processing.js, Snap.svg, Paper.js, Raphaël.js
42

Инструменты:
〉WebGL:
Three.js, Babylon.js
〉framerjs — Invent, design and experiment with interaction
〉marvelapp — Free Prototyping for Everyone. No coding required.
〉POP — Prototype on Paper app
〉jetstrap.com — Not just a mock-up tool, Jetstrap is the premier
interface-building tool for Bootstrap 3.
43

45
Контакты
Вадим Пацев
Руководитель отдела разработки интерфейсов
@basvasilich
basvasilich
+7 (909) 921 57 14
basvasilich@yandex.ru

Курс по HTML5 и CSS3 это 24 часа лекций и 96 часов практики. В ходе курса вы научитесь верстать страницы средней сложности и сможете после его окончания получить работу стажера или junior frontend-developer. Школа интернет-технологий ProfPoint перезапускает обучение в формате онлайн с уклоном на практику и результат.

Вебинары : новый инструмент коммуникацийWebinar.ru

#1 "JSib – Знакомство и амбициозные планы" Денис РечкуновJSib

Цикл разработки WordPress

Konstantin Kovshenin

Будущее шаблонизаторов

Alexey Ivanov

Что такое webinar.ruWebinar.ru

SECON'2016. Лексунин Евгений, Как не запутаться в веб-разработке

SECON

Презентация для "Недели Байнета" (Минск) про то, как проектирование уменьшает риски и приносит деньги как заказчику, так и разработчику. В конечном итоге все сводится к баблу и качеству создаваемого продукта (которое, опять же, так или иначе конвертируется в бабло) - такая вот меркантильность, без которой в любом бизнесе никуда.

Mobile Web Apps development essentials

Pavlo Iuriichuk

Стажировка-2015. Дизайн. Занятие 3. Проектирование интерфейсов

7bits

слайд хостинг (1)

46576576

АНИМАЦИЯ В FLASH И HTML5

Pavel Tsukanov

Михаил Трошев "Школа разработки интерфейсов"

Yandex

Мы любим получать новые знания и всегда с радостью обмениваемся ими. В этом году мы решили открыть Школу разработки интерейсов, чтобы поделиться своими знаниями и опытом в области фронтенд-разработки со всеми желающими.

Решаем UX-задачи в ситуации незнания и самообмана

Собака Павлова

Верстка в команде

Andrew Vdovichenko

У семи нянек дитя без глаза? Пара лет проблем и решений в UX зарубежного веб-...

ПрофсоUX

Доклад рассчитан на создателей и руководителей продуктовых команд, проектировщиков, дизайнеров. Разработчикам тоже может быть интересно. Последние два года я работаю в довольно интересном веб-сервисе. Хочу поделиться кейсами из опыта. Как быть, когда в вашем портфеле несколько продуктов, каждый продукт развивает отдельный юзабилити-специалист, и у подразделения нет начальника? Что делать, если каждым из этих продуктов пользуются «немного разные» люди, а навигация общая? (и вообще, продукты живут в едином веб-сервисе и должны между собой как-то дружить) Как договориться, если все эти продукты — часть единого большого веб-сервиса с кучей общих мест? Как решать общие проблемы? Как синхронизироваться и быстрее внедрять лучшие решения из опыта коллег? Как вообще работать без «арт-директора», «менеджера проекта» или другого начальника?

Фронтенд в Яндексе

Yandex

Доклад об особенностях фронтенд-разработки. Речь пойдет о специфике разработки интерфейсов в больших и маленьких компаниях и о том, что должен знать хороший фронтенд-разработчик. Вы узнаете также, как устроен процесс разработки в Яндексе и какие интерфейсные задачи мы решаем.

Kremen Development Academy #1 - Web 2.0

Jaroslav Khorishenko

Аналитика мобильного проекта — проверяй и доверяй / Александр Лукин (Yandex A...

Ontico

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

Предсказание оттока игроков из World of Tanks

Yandex

Одна из наиболее часто возникающих задач в бизнес-аналитике для компаний — это предсказание оттока клиентов. Ведь если заранее знать, что клиент собирается уйти к конкуренту, его можно попытаться остановить. Задача будет рассмотрена на примере прогнозирования оттока игроков из World of Tanks.

Сергей Бережной, Виталий Харисов "БЭМ! или как разрабатывать веб-проекты"

Yandex

2 июля 2011, Я.Субботник в Екатеринбурге Сергей Бережной, Виталий Харисов "БЭМ! или как разрабатывать веб-проекты" О докладе: Делимся опытом про способ разработки веб-проектов, который мы считаем самым лучшим. Когда мы думаем о «разработке проектов», мы представляем себе долго живущие и долго развивающиеся проекты, которые создаются быстро, легко поддерживаются и развиваются, в работе над которыми эффективно объединено большое количество и людей, и кода. В докладе мы расскажем про методологию Блок-Элемент-Модификатор, разделение кода на логические части, совместную работу разных специалистов и многоязычный код, пример использования и вспомогательные инструменты.

Жидков Игорь - Elliptics Yandex

Design weekend 2014

Vyacheslav Prawdzinski

Знакомьтесь: DITA, Дмитрий Перепелин

Yandex

Доклад посвящён внедрению архитектуры DITA 1.2 в повседневную деятельность организации, занимающейся производством промышленной продукции, разработкой ПО и системной интеграцией. Целевая аудитория доклада — технические писатели, контент-менеджеры, руководители проектов, незнакомые с архитектурой DITA 1.2, но желающие о ней узнать.

Екатерина Зудина - Неестественные тексты в интернетеYandex

Модель памяти C++ - Андрей Янковский, Яндекс

Yandex

Дизайн в числах. Повышаем число активаций мобильного приложения. (Андрей Гев...

PCampRussia

Поиск списков в неструктурированных данных

Yandex

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

What's hot

Дизайн? Не слышал | Design? Don't know

Segrey Nikishov - @n_grey

Дизайн и проектирование: жесткая методика работы с рисками

Alexey Borodkin

Mobile Web Apps development essentials

Pavlo Iuriichuk

Стажировка-2015. Дизайн. Занятие 3. Проектирование интерфейсов

7bits

слайд хостинг (1)

46576576

АНИМАЦИЯ В FLASH И HTML5

Pavel Tsukanov

Михаил Трошев "Школа разработки интерфейсов"

Yandex

Решаем UX-задачи в ситуации незнания и самообмана

Собака Павлова

Верстка в команде

Andrew Vdovichenko

У семи нянек дитя без глаза? Пара лет проблем и решений в UX зарубежного веб-...

ПрофсоUX

Фронтенд в Яндексе

Yandex

Kremen Development Academy #1 - Web 2.0

Jaroslav Khorishenko

What's hot (12)

Дизайн? Не слышал | Design? Don't know

Дизайн и проектирование: жесткая методика работы с рисками

Mobile Web Apps development essentials

Стажировка-2015. Дизайн. Занятие 3. Проектирование интерфейсов

слайд хостинг (1)

АНИМАЦИЯ В FLASH И HTML5

Михаил Трошев "Школа разработки интерфейсов"

Решаем UX-задачи в ситуации незнания и самообмана

Верстка в команде

У семи нянек дитя без глаза? Пара лет проблем и решений в UX зарубежного веб-...

Фронтенд в Яндексе

Kremen Development Academy #1 - Web 2.0

Viewers also liked

Аналитика мобильного проекта — проверяй и доверяй / Александр Лукин (Yandex A...

Ontico

Предсказание оттока игроков из World of Tanks

Yandex

Сергей Бережной, Виталий Харисов "БЭМ! или как разрабатывать веб-проекты"

Yandex

Жидков Игорь - Elliptics Yandex

Design weekend 2014

Vyacheslav Prawdzinski

Знакомьтесь: DITA, Дмитрий Перепелин

Yandex

Екатерина Зудина - Неестественные тексты в интернетеYandex

Модель памяти C++ - Андрей Янковский, Яндекс

Yandex

Дизайн в числах. Повышаем число активаций мобильного приложения. (Андрей Гев...

PCampRussia

Поиск списков в неструктурированных данных

Yandex

Как сделать стриминг для сервиса, который хранит миллионы видеофайлов — Лев Т...

Yandex

Erdős Magic

Yandex

The twentieth century saw the elevation of Discrete Mathematics from ”the slums of topology” (one of the more polite expressions!) to its current highly regarded position in the mathematical pantheon. Paul Erd˝os played a key role in this transformation. We call discuss some key results, possibly including: i) Ramsey Theory. In 1946 Erdős showed that you could two-color the complete graph on n vertices so as to avoid a monochromatic clique of size k, where n was exponential in k. To do it, he introduced The Probabilistic Method. ii) Two-Coloring. In 1963 Erdős showed that given any m = 2 n − 1 sets, each of size n, one could two-color the underlying points so that none of the sets were monochromatic. His proof in two words: Color Randomly! There has been much work on larger m. We give a simple algorithm (together with a subtle analysis) of Cherkashin and Kozik that finds a coloring for the best known (so far!) m. iii) Number Theory. In 1940 Erdős , with Marc Kac, showed that the number of prime factors of n satisfies (when appropriately defined) a Gaussian distribution. Amazing! iv) Liar Games. Paul tries to find an integer from 1 to 100 by asking ten Yes/No questions from Carole. BUT, Carole can lie – though at most one time. Can Paul find the number? Or can Carole stop Paul with an Adversary Strategy? Anecdotes and personal recollections of Paul Erdős will be sprinkled liberally thoughout the presentation.

Классификация изображений с помощью нейронных сетей. Сжатие и ускорение обуче...

Yandex

Свёрточные нейронные сети позволяют получать потрясающие результаты во многих задачах компьютерного зрения. В этом докладе я расскажу о нашем опыте обучения и применения свёрточных нейронных сетей. Отдельно будет затронут актуальный вопрос сжатия и ускорения нейросетевых моделей.

Наставничество как саморазвитие, Алексей Замулла

Yandex

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

Презентация: Яндекс.Деньги

Банковское обозрение

"Адаптивный дизайн интерфейса JS API Яндекс.Карт и особенности его реализации...

Yandex

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

Как принять/организовать работу по поисковой оптимизации сайта, Сергей Царик,...

Yandex

Лекция Сергея Царика в Школе вебмастеров: «Как принять/организовать работу по поисковой оптимизации сайта». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Основные этапы и методы поисковой оптимизации Рассмотрим проработку стратегии продвижения, планирование ресурсов на проект, поймем как нужно прорабатывать семантическое ядро для продвижения, разберемся с очередностью всех работ. Разложим по полочкам основные приемы оптимизации в связке с внутренними и внешними факторами ранжирования поисковых систем, а также в связке с поведенческими факторами и характеристиками. Разберемся с тем, что же должен делать оптимизатор для достижения топа. Что должно включать в себя ТЗ на поисковую оптимизацию Разберемся с основными блоками технического задания от оптимизатора, с тем, каким оно должно быть с точки зрения подачи информации и ее глубины. Сравнение in-house подхода и агентства Рассмотрим все «за» и «против» оптимизатора в штате компании и вне её. На основе каких метрик нужно оценивать эффективность оптимизаторской работы Выделим ключевые показатели эффективности работы оптимизатора, рассмотрим процесс их измерения, динамику, разберемся с возможными «миксами» и их связкой с мотивацией подрядчика.

Поиск похожих видео-роликов на основе анализа содержимого видео-файлов — Ан...

Yandex

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

Сильный текст для нелингвистов, Максим Ильяхов

Yandex

Что такое «Информационный стиль» и как он помогает писать. Почему необязательно быть лингвистом. Общие принципы сильного текста для публицистики, рекламы и технической документации. Стоп-слова — инструмент «грубой очистки» текста.

Как мы адаптировали более 150 сайтов по технологии Dynamically-served JavaScr...

Ontico

Viewers also liked (20)

Аналитика мобильного проекта — проверяй и доверяй / Александр Лукин (Yandex A...

Предсказание оттока игроков из World of Tanks

Сергей Бережной, Виталий Харисов "БЭМ! или как разрабатывать веб-проекты"

Жидков Игорь - Elliptics

Design weekend 2014

Знакомьтесь: DITA, Дмитрий Перепелин

Екатерина Зудина - Неестественные тексты в интернете

Модель памяти C++ - Андрей Янковский, Яндекс

Дизайн в числах. Повышаем число активаций мобильного приложения. (Андрей Гев...

Поиск списков в неструктурированных данных

Как сделать стриминг для сервиса, который хранит миллионы видеофайлов — Лев Т...

Erdős Magic

Классификация изображений с помощью нейронных сетей. Сжатие и ускорение обуче...

Наставничество как саморазвитие, Алексей Замулла

Презентация: Яндекс.Деньги

"Адаптивный дизайн интерфейса JS API Яндекс.Карт и особенности его реализации...

Как принять/организовать работу по поисковой оптимизации сайта, Сергей Царик,...

Поиск похожих видео-роликов на основе анализа содержимого видео-файлов — Ан...

Сильный текст для нелингвистов, Максим Ильяхов

Как мы адаптировали более 150 сайтов по технологии Dynamically-served JavaScr...

Similar to Дизайн и разработка фронтенда

Professiya web d

ir_556

Internet Trends

Транслируем.бел

Internet TrendsТранслируем.бел

HappyDev-lite-2016 (осень), день 1, 02 Татьяна Шульгина. Процесс разработки в...

HappyDev-lite

Практика организации ИТ-конфереций и других мероприятий для разработчиков

SQALab

Константин Кичинский, Microsoft

Diana Dymolazova

организация мероприятий без упячки. герасимович. Itotvet 19 20 октября

it-people

Создание веб-ресурса: задачи, процесс, коммуникации, результат

Дмитрий Подлужный

10 мифов о WordPress

Alexey Vidanov

Почему WordPress является выбором номер один для веб-студий и их клиентов? Презентация посвящена развенчанию самых частых мифов о WordPress, которые живут в головах заказчиков, разработчиков и руководителей студий. http://2014.russia.wordcamp.org

CHЁZA PROJECT 2015

Nickolay Turubar

Red Keds presentation

Red Keds

Memo for-webdesigner3liblib

Встраивание Python в мобильные приложения – нюансы interoperation, новые подх...Anthony Marchenko

CodeCamp 2011

Anton Osipov

WebdesigngarretТатьяна Гаврилина

Project Cilvek

Vitaly Shibalkov

it_portfolio

club-inno

LinkedIn для ИТ-индустрии: разработчиков, менеджеров, дизайнеров, маркетологов, PR-щиков и других работниках этой сферы. Проект позволяет создать аналог полнофункциональной домашней страницы настолько же просто, как и профиль в социальной сети. Основная особенность – это ориентированность на проекты, в которых пользователь участвовал на работе или для себя.

«Правильный процесс дает правильный результат». Как грамотно выстроить работу...

borovoystudio

Red keds about

Red Keds

Mobile credentialsMax Semenchuk

Similar to Дизайн и разработка фронтенда (20)

Professiya web d

Internet Trends

HappyDev-lite-2016 (осень), день 1, 02 Татьяна Шульгина. Процесс разработки в...

Практика организации ИТ-конфереций и других мероприятий для разработчиков

Константин Кичинский, Microsoft

организация мероприятий без упячки. герасимович. Itotvet 19 20 октября

Создание веб-ресурса: задачи, процесс, коммуникации, результат

10 мифов о WordPress

CHЁZA PROJECT 2015

Red Keds presentation

Memo for-webdesigner

Встраивание Python в мобильные приложения – нюансы interoperation, новые подх...

CodeCamp 2011

Webdesigngarret

Project Cilvek

it_portfolio

«Правильный процесс дает правильный результат». Как грамотно выстроить работу...

Red keds about

Mobile credentials

More from Yandex

Структурированные данные, Юлия Тихоход, лекция в Школе вебмастеров Яндекса

Yandex

Лекция Юлия Тихоход в Школе вебмастеров: «Структурированные данные на поиске» https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Что такое микроразметка и в чём её польза Что такое микроразметка (семантическая разметка, семантическая микроразметка) и кому она нужна. Очень кратко — всё, что я знаю о применении семантической разметки поисковыми системами и другими веб-сервисами. Передача данных в машиночитаемом виде Какие ещё есть способы передать данные о сайте поисковым системам кроме микроразметки, особенности разных способов. Что бывает с плохими вебмастерами, которые пытаются обмануть поисковые системы и передать неверные данные. Типы разметки Из чего состоит микроразметка, какие бывают словари и синтаксисы. Популярные сочетания словарей и синтаксисов, как правильно выбирать нужную комбинацию для своего сайта. Передача данных об интернет-магазине Разбор семантической разметки: что в принципе доступно для разметки в интернет-магазине, что это даёт, а что можно не размечать вовсе. Проверка правильности микроразаметки Ошибки в микроразметке, способы их обнаружения и исправления. Популярные валидаторы микроразметки. Какие ошибки непременно нужно исправлять, а что можно игнорировать.

Представление сайта в поиске, Сергей Лысенко, лекция в Школе вебмастеров Яндекса

Yandex

Лекция Сергея Лысенко в Школе вебмастеров: «Представление сайта в поиске» https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Основные элементы сниппетов: как влиять на их формирование Как по внешнему виду и содержанию визитки судят, стоит ли «связываться», так и по представлению сайта на странице выдачи пользователи решают, стоит ли переходить на сайт. Как изменить представление сайта в выдаче поисковых систем? Что может повлиять на CTR и что для этого нужно сделать? Рассмотрим фавиконки, навигационные цепочки, быстрые ссылки и многое, многое другое. Зачем нам заголовок: как им управлять Что должно быть в заголовке, а чего уж точно не стоит делать. Как избавиться от мусора и расставить акценты. И как это скажется на представлении сайта в поиске. Основной контент аннотации и мета-описания: что нам они дают Сниппет — зачем он нужен? Как обрабатываются данные для аннотаций? Что в сниппете помогает, а что мешает пользователю сориентироваться? Как подсказать поисковой системе, что выводить в сниппете? От Open Graf до schema.org. Инструменты, возможности, рекомендации.

Плохие методы продвижения сайта, Екатерины Гладких, лекция в Школе вебмастеро...

Yandex

Лекция Екатерины Гладких в Школе вебмастеров: «Плохие методы продвижения сайта» https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Как завязывают с портянками Как использовать wordstat, чтобы превратить текст в SEO-портянку. Как Яндекс определяет текстовый спам и какие ограничения могут быть применены к сайтам, злоупотребляющим ключевыми словами. Эффектное размещение SEO-ссылок Какие бывают SEO-ссылки и как они классифицируются в базе Яндекса. В чём отличие SEO-ссылок от рекламы. Как размещать SEO-ссылки наиболее эффектно. Методы борьбы против ссылочного спама – АГС и Минусинск. Снятие ссылок. Поведенческие факторы, медитативные практики Популярные сервисы накрутки: как это работает и как это не работает. Методы накрутки и методы борьбы с мошенничеством. Примеры пользовательских сессий и кто на самом деле посещает ваш сайт. Как выйти из-под санкций за накрутку поведенческих факторов.

Основные принципы ранжирования, Сергей Царик и Антон Роменский, лекция в Школ...

Yandex

Лекция Сергея Царика и Антона Роменского в Школе вебмастеров: «Основные принципы ранжирования» https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Как работает поиск При запросе пользователя к поисковой системе происходит множество процессов, которые позволяют дать наиболее релевантный ответ. Рассмотрим основные механизмы формирования выдачи: формулы, Матрикснет, персонализацию и обновления. Что учитывается при ранжировании сайтов Так как сайты разные и по-разному решают пользовательские задачи, при ранжировании поисковой системе нужно учитывать множество факторов. Поговорим о том, что обязательно должно быть на сайте для правильной индексации. Ещё о факторах ранжирования Какой контент действительно важен и как его правильно представить. Для правильного ранжирования сайта важно разобраться с его региональной привязкой. Разберёмся, какой регион присваивать сайту и как сделать это правильно. Реальный кейс долгосрочной работы над позициями Посмотрим на реальном примере, как изменялись основные жизненные характеристики (трафик, конверсии) сайта на пути в топ выдачи поисковых систем.

Основные принципы индексирования сайта, Александр Смирнов, лекция в Школе веб...

Yandex

Лекция Александра Смирнова в Школе вебмастеров: «Основные принципы индексирования сайта». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Как поиск находит страницу, её путь до появления в поиске Поисковые системы постоянно собирают информацию о страницах в интернете. Как же это происходит и как добавить страницы своего сайта в поиск? Проверка индексирования сайта. Как управлять роботом (зеркала, sitemap, robots.txt) Множество сайтов в интернете доступны сразу по нескольким адресам. Как указать поисковому роботу на основной и как скорректировать индексирование? Особенности индексирования Современные сайты используют различные технологии в своей работе. Рассмотрим, как настроить их правильно и сделать контент доступным для робота. Как улучшить индексирование (дубли, HTTP-ответ, удаление из поиска) В поиск попадают различные страницы, которые известны роботу. Какие нужны, а какие нет? Как повлиять на их индексирование?

Мобильное приложение: как и зачем, Александр Лукин, лекция в Школе вебмастеро...

Yandex

Лекция Александра Лукина в Школе вебмастеров: «Мобильное приложение: как и зачем» https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Проектирование. Быть или не быть Обсудим обоснование для разработки мобильного приложения — какую ценность оно может принести для проекта и бизнеса. Определим основные типы приложений и сценарии использования. Рассмотрим основные технологии и выбор оптимальных для конкретных задач. ТЗ — как оценить и какие особенности необходимо учесть. Разработка. Важные детали На что обратить внимание на этапе разработки и тестирования, заметки по специфике мобильных экосистем. Выбираем арсенал SDK для всестороннего анализа проекта в полёте. Публикация и продвижение Кратко рассмотрим специфику Google Play и AppStore. Проведём экскурс в мир мобильного маркетинга, подчеркнём сходства с вебом и отличия от него. Рассмотрим ключевые метрики для анализа продукта и процесса продвижения, а также способы их повышения.

Сайты на мобильных устройствах, Олег Ножичкин, лекция в Школе вебмастеров Янд...

Yandex

Лекция Олега Ножичкина в Школе вебмастеров: «Сайты на мобильных устройствах» https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Статистика и тренды по мобильному интернету Основные показатели мобильного интернет-рынка. Тенденции роста мобильной аудитории. Новые алгоритмы ранжирования поисковых систем Адаптация сайта к мобильным пользователям и её влияние на позиции в поисковой выдаче. Возможности для бизнеса в мобильном вебе Мобильный сайт позволяет воспользоваться дополнительными возможностями взаимодействия с пользователем. Рассмотрим конкретные примеры. Мобильный сайт и приложение — в чём разница Чем отличается мобильное приложение от мобильно сайта. Какие преимущества и недостатки у каждого варианта. Представление сайтов на мобильных устройствах Адаптивные сайты. Мобильные сайты. Сайты для десктопа. Чем они отличаются, какие преимущества у каждого типа и нужно ли переключаться между мобильной и десктоп-версиями? Удобный мобильный сайт для пользователя Поведение пользователей на мобильном сайте. Отличия от десктопа, достижение целей и простые правила увеличения конверсии. Специфика разработки мобильного сайта Особенности проектирования, разработки и тестирования сайтов. Инструменты для разработки мобильных сайтов Готовые инструменты для проектирования и тестирования. Примеры фреймворков.

Качественная аналитика сайта, Юрий Батиевский, лекция в Школе вебмастеров Янд...

Yandex

Лекция Юрия Батиевского в Школе вебмастеров: «Качественная аналитика сайта» https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Что мы хотим от аналитики сайта На какие вопросы должна отвечать аналитика сайта. Как аналитика сайта связана с аналитикой бизнеса. На какие блоки можно поделить аналитику онлайн-процессов. Какой должна быть идеальная аналитическая система. Анализ общих показателей бизнеса Как построить систему аналитики бизнеса в интернете. Ключевые показатели эффективности (KPI). Построение воронки продаж. Business Intelligence — сквозная аналитика всех процессов. Обзор инструментов для анализа сайта и аудитории Яндекс.Метрика и Google Analytics как основа веб-аналитики. Инструменты для веб-мастеров. Инструменты для анализа действий пользователей (Kiss-metrics, Woopra, Mixpanel). Системы для подсчета целевых действий, CPA и ROMI. Анализ каналов привлечения клиентов Как анализировать источники трафика. Популярные инструменты для анализа. Пройти тест по теме Процесс развертывания системы аналитики сайта Подготовка к установке систем веб-аналитики. Тонкости установки и настройки трекеров. Подключение коллтрекинга и дополнительных инструментов фиксации целевых действий. Настройка пользовательских сценариев. Пример по анализу пользовательского сценария.

Что можно и что нужно измерять на сайте, Петр Аброськин, лекция в Школе вебма...

Yandex

Лекция Петра Аброськина в Школе вебмастеров: «Что можно и что нужно измерять на сайте». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Базовые принципы веб-аналитики Как работает веб-аналитика и какие подводные камни есть в учёте и анализе данных. Как правильно работать с данными. Основные метрики и термины Посетители, визиты, глубина просмотра, время на сайте — какие метрики важны и чем они отличаются. Как выбрать правильный KPI Самый важный этап в веб-аналитике и продвижении сайта. Какие цели выбрать интернет-магазину, сайту услуг, контентному проекту и т.д. Ключевые группы отчетов и применение знаний на практике Семь главных типов отчётов для бизнеса. Анализ контекстной рекламы, SEO и контента сайта — на конкретных примерах.

Как правильно поставить ТЗ на создание сайта, Алексей Бородкин, лекция в Школ...

Yandex

Лекция Алексея Бородкина в Школе вебмастеров: «Как правильно поставить ТЗ на создание сайта». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ ТЗ: две буквы с большим потенциалом Что такое техническое задание. Какое место оно занимает в веб-разработке. Какие цели преследует. И каким требованиям оно должно отвечать. Что нужно сделать, прежде чем садиться за ТЗ Зачем нужна подготовка к написанию ТЗ. Какую информацию нужно собрать и как выстроить этот процесс. На каком этапе веб-разработки нужно писать ТЗ — и что будет, если этот момент упустить. Какое отношение имеют к ТЗ прототипы, пользовательские истории и прочие инструменты проектирования. Хорошее ТЗ Как соединить в один документ описание интерфейсов, структуру данных и много чего ещё. Структура правильного, хорошего ТЗ с подробным разбором каждого пункта. С какой стороны приступать и как эффективнее всего выстроить работу. Кто должен писать ТЗ Кто может написать хорошее ТЗ. Где найти такого человека и как встроить его в общие процессы. Что делать, если ТЗ пишет сам заказчик. Плохое ТЗ Популярные ошибки. Чем они ужасны и как их избежать. Жизнь с ТЗ По какой схеме нужно согласовывать ТЗ. Как применять его в дальнейшей работе. Кому не нужно показывать ТЗ ни при каких обстоятельствах. Что делать, если ТЗ никому не нравится. ТЗ по ГОСТ: ад на Земле Краткая история развития ТЗ со времён Брежнева и до наших дней. Почему я старательно избегаю слова «ТЗ». Почему вы должны нервно вздрагивать при слове «ГОСТ». Что делать, если вы работаете с госзаказчиком.

Как защитить свой сайт, Пётр Волков, лекция в Школе вебмастеров

Yandex

Лекция Петра Волкова в Школе вебмастеров: «Как защитить свой сайт». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Актуальные типы угроз и динамика их развития Компрометация сервера и её последствия. Распределённые атаки типа «отказ в обслуживании». Подмена или добавление рекламы на стороне клиента. Атаки, направленные на пользователей. Проблемы, связанные со внешним содержимым. Управление рисками безопасности веб-сайтов Разные типы сайтов подвержены разным типам рисков информационной безопасности. Понимание целей и подходов злоумылшенников как ключ к эффективному снижению рисков. Методы монетизации атак на сайты. Доступный инструментарий и методики для обеспечения безопасности Открытые инструменты форензики для типовых и сложных проектов. Системы обнаружения вторжений, подходы к проектированию безопасности в архитектуре и процессах.

Как правильно составить структуру сайта, Дмитрий Сатин, лекция в Школе вебмас...

Yandex

Лекция Дмитрия Сатина в Школе вебмастеров: «Как правильно составить структуру сайта». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Структура сайта, ориентированная на человека; построение структуры, карточная сортировка Содержимое сайтов часто организовано так, как кажется удобным разработчику или контент-менеджеру компании. Чаще всего такие структуры неудобны для реальных посетителей, потому что не совпадают с их знаниями, не поясняют, как устроен материал, и не помогают найти желаемое. Структура, ориентированная на пользователя, повышает вероятность того, что посетители найдут нужную информацию или товар и сделают это быстро. Стройте структуру, исходя из пользовательских сценариев. Выделение на сайте разделов, соответствующих структуре компании или схеме процесса закупки, как правило, усложняет навигацию для пользователя. Правильная структура учитывает уровень знаний покупателя и использует понятные ему термины и способы группировки. Разные типы структур, средства навигации, дальнейший поиск информации на странице Структуры сайтов, на которых ищут что-то определённое, отличаются от тех, что используются на сайтах, посетители которых ещё не уверены, что именно они хотят или как называется нужная вещь. Строгие структуры — например, организация по наименованию товара, производителю, — предполагают один способ группировки. При нестрогой организации данные можно группировать по теме, по жизненной ситуации и так далее. Используйте средства навигации, которые помогают понять, как организован материал. Решая, какой будет визуальная реализация навигации на сайте, необходимо учитывать количество разделов и связи �

Технические особенности создания сайта, Дмитрий Васильева, лекция в Школе веб...

Yandex

Лекция Дмитрия Васильева в Школе вебмастеров: «Технические особенности создания сайта». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Сайт — расплывчатое понятие Раньше под словом «сайт» понимался набор HTML-страниц, расположенных в домене второго или третьего уровня. Появление социальных сетей размыло это понятие. Как выбрать домен Различные варианты, и какой из них подойдёт именно вашему сайту: доменные зоны, читаемые и нечитаемые домены, кириллица и латиница. Подходы к созданию сайтов Первые сайты делались на чистом HTML. Сейчас такой способ ещё встречается, но подавляющее большинство веб-страниц создаются при помощи CMS, фреймворков, конструкторов. Составные сущности: структура, макеты дизайна, интерактивные элементы, контент, система прав. Размещение сайта на хостинге. Российские и зарубежные, дорогие и дешевые, облачные и традиционные провайдеры. Кратко о тонкостях взаимодействия с ними. Что такое HTTPS Всё более популярный безопасный протокол доступа к сайту. Нужен ли он вам и в каких случаях. Как выбрать платформу для сайта, основные системы управления сайтом (CMS) и конструкторы. Сайт после запуска Сайты создаются с конкретной целью, обычно связанной с получением дохода. Как контент сайта и его технические характеристики напрямую могут влиять на бизнес-эффективность.

Конструкторы для отдельных элементов сайта, Елена Першина, лекция в Школе веб...

Yandex

Лекция Елены Першиной в Школе вебмастеров: «Конструкторы для отдельных элементов сайта». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ О пользе тех или иных технологий Взгляд в будущее, короткий обзор других полезных технологий и «опасностей», которые подстерегают на пути к правильному их выбору. Как выбрать поиск для сайта Поиск для сайта — важный инструмент навигации. Чтобы оценить качество поиска по своему сайту, посмотрите на количество уходов со страницы результатов. Полнота, скорость индексирования, обработка запросов (исправление ошибок, опечаток, неправильной раскладки) — без этого невозможно представить качественный поиск. Как выбрать карты для сайта Уход посетителя с сайта на «большие» Яндекс.Карты за точной информацией об организации может обернуться потерей клиента, который уже был готов к покупке. Чтобы этого не допустить, лучше сделать интерактивную карту прямо на сайте. Автоматизация оплаты на сайте Люди привыкают платить картой, сегодня даже уличные киоски принимают их. Поэтому многим посетителям кажется «подозрительным» интернет-магазин, в котором недоступны электронные платежи. Начать приём банковских карт в онлайне очень просто, главное выбрать для этого подходящую технологию. Перевод важных страниц На каких языках говорит ваша аудитория, много ли у вас посетителей из-за рубежа? Ответы на эти вопросы даст Яндекс.Метрика. Именно она поможет оценить, нужно ли тратиться на профессионального переводчика и готовить отдельные описания товаров или новости на других языках. Во многих случаях для совершения покупки достаточно и простого машинного перевода. Узнайте, как его настроить, чтобы ключевые разделы сайта автоматически переводились для иностранных посетителей. Социальная интеграция Как заставить пользователей говорить о себе в социальных сетях? В первую очередь нужно сделать хороший продукт или услугу, но и без удобного инструмента для «шаринга» в соцсетях — никуда. Рекомендации о том, как выбрать и установить такой инструмент к себе на сайт.

Контент для интернет-магазинов, Катерина Ерошина, лекция в Школе вебмастеров ...

Yandex

Лекция Катерины Ерошиной в Школе вебмастеров: «Контент для интернет-магазинов». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Виды контента для интернет-магазинов Основные страницы, карточки товаров, каталог в целом. Письма покупателям. Статьи для интернет-магазина. Основные сервисные страницы: что нужно знать покупателю О страницах доставки, оплаты, контактов, условий работы. Страница товара интернет-магазина: какой нужен текст, чтобы товар нашли Признаки товаров. Сниппеты товарных позиций. Когда текст не нужен вообще. Постоянная и техническая информация на карточке. Блог и внешние публикации интернет-магазина О чем писать, чтобы подогреть интерес к магазину. Сторителлинг. UGC: методы вовлечения (кратко). Персонализация интернет-магазина: стать ближе к покупателю Красивый пример личного бренда директора магазина. Копирайтинг для интернет-магазина: на чём можно и нельзя экономить Что делать, если у вас 100 000 товарных позиций и они постоянно меняются. Хорошее ТЗ копирайтеру для наполнения интернет-магазина Что должен знать копирайтер, чтобы не писать ерунду. Как оценить работу копирайтера Стандартные проверки. Контроль качества текста средствами аналитики.

Как написать хороший текст для сайта, Катерина Ерошина, лекция в Школе вебмас...

Yandex

Лекция Катерины Ерошиной в Школе вебмастеров: «Как написать хороший текст для сайта». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Назначение и типы текстов на сайте и вне его Цель текста — влиять на поведение пользователя. Самое простое — информировать, самое сложное — привести к покупке. Виды текстов для внешних публикаций. Белые книги и другие способы подтвердить экспертизу. Контент-план для наполнения, развития сайта и внешних публикаций Как проектировать контент для нового сайта. Как наращивать информационную массу сайта. Внешние контакты с потребителем. Разные уровни вовлечения: информируем, продаём, помогаем Пройти по пути покупателя, выдавать информацию, необходимую для совершения следующего шага. Ловушки на этом пути. Информационный стиль: применение с пониманием Чистить текст без фанатизма. Эмоциональное вовлечение. Рациональное обоснование. Структура и вёрстка Заголовки и подзаголовки, списки, абзацы, иерархия подачи информации. SEO-аспекты и LSI-копирайтинг Понимание ценности ключей. Зачем копирайтеру нужно семантическое ядро. Оценка качества текста (чеклист) Уникальность, фактическая достоверность, соответствие целям, информационная плотность, грамотность.

Usability и дизайн - как не помешать пользователю, Алексей Иванов, лекция в Ш...

Yandex

Лекция Алексея Иванова в Школе вебмастеров: «Usability и дизайн: как не помешать пользователю». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Что такое юзабилити и почему оно важно Поведение пользователей на сайте и достижение ими запланированных целей зависит не только от контента, но и от удобства сайта. Информационное и функциональное наполнение сайта Перед созданием сайта нужно правильно определить, какая информация и какой функционал должны быть на сайте. При этом нужно исходить не из того, что у вас есть, а из того, что будет нужно будущим посетителям вашего сайта. Проектирование входных страниц В зависимости от целей сайта и источников посетителей нужно сформулировать требования к входным страницам сайта и их содержанию. Сценарии поведения пользователя Для правильного распределения информации нужно описать сценарии взаимодействия с сайтом для разных групп посетителей. Рассмотрим методы совмещения разных сценариев на одном сайте. Пройти тест по теме Управление конверсией В большинстве случаев мы ждем от посетителя сайта какого-то целевого действия. Это может быть регистрация, отправка заявки, звонок или что-то ещё. Вы увидите способы мотивации посетителей к совершению целевого действия для различных типов сайтов. Пройти тест по теме Основные принципы распределения информации В рамках этого блока вы увидите, как нужно распределять информацию на странице, чтобы посетители увидели всё, что вы хотите им показать. Мобильная версия сайта и принципы юзабилити Всё больше посетителей приходят на сайт с мобильных устройств. Рассмотрим основные особенности взаимодействия с информацией с мобильного устройства и подходы к адаптации сайта под них.

Cайт. Зачем он и каким должен быть, Алексей Иванов, лекция в Школе вебмастеро...

Yandex

Лекция Алексея Иванова в Школе вебмастеров Яндекса: «Сайт. Зачем он и каким должен быть». https://academy.yandex.ru/events/webmasters_school/yawebm2015/ Типы сайтов и потребности аудитории В зависимости от решаемых задач, сайты можно разделить на несколько характерных типов с разными функциями и контентом. Перед созданием сайта важно понять, чего ждут посетители и какими хотят видеть веб-страницы. При этом на один и тот же сайт может попадать разная аудитория, которая ведёт себя по-разному и каждая имеет свои потребности. Для каждого сегмента нужно разработать отдельные сценарии взаимодействия с информацией на вашей площадке. Сайт с точки зрения бизнеса Чаще всего сайт создается для решения конкретных бизнес-задач. Рассмотрим различные типы монетизации сайтов и особенности каждого из них. Основные показатели и методы измерения Одно из главных преимуществ цифровых каналов — детальная аналитика взаимодействия посетителей с сайтом. В данном блоке рассмотрим основные инструменты измерения, ключевые показатели сайта, на которые нужно обращать внимание, и подходы к интерпретации полученных данных для принятия решений.

Эталонное описание фильма на основе десятков дубликатов

Yandex

Как сравнить миллионы описаний фильмов — из десятков источников и на разных языках? Как структурировать полученные данные и для каждого фильма агрегировать их в максимально полную информационную карточку? Речь пойдёт о разных подходах к решению этой задачи (детерминированном, вероятностном, или методом машинного обучения), о необходимых библиотеках и инструментах, а также о сходных задачах.

Производительность параметрического поиска на основе опенсорс-платформы

Yandex

В докладе рассматриваются особенности системы параметрического поиска, построенной на базе опенсорс-плаформы Apache Solr. Речь пойдёт о проблемах производительности такой системы и некоторых методах их решения — в том числе о применении различных способов построения запросов для уменьшения времени ответа системы.

More from Yandex (20)