Доклад Александра Кожевникова для конференции RIW 2015 об особенностях разработки и продвижения мультиязычных сайтов.
Разобраны основные проблемы, частые подходы к разработке.
Описаны самые необходимые требования поисковых систем к SEO.
Анонс расширения Yii Framework 2 для разработки мультиязычных приложений.
Введение во фронтенд-разработкуDenis LatushkinОписание структуры веб-приложений, навыков и знаний, нужных фронтенд-разработчику и процесс обучения на курсе.
Методология: БЭМ, Модули, ОтношенияBadoo DevelopmentДоклад о развитии CSS-методологии, Константин Дзюин (Badoo)
Теоретические и практические аспекты разработки HTML/CSS
Дмитрий Кушников — БЭМ глазами бэкенд-разработчикаYandexМы используем БЭМ для организации фронтенда с самого начала разработки проекта Repka.com. В докладе я расскажу об архитектуре нашего сайта и применяемых на нем технологиях Яндекса, о том, как мы пришли к i-bem, что используем в качестве шаблонизатора, как устроен наш client-side и каковы планы развития на ближайшее будущее. А также разберу плюсы БЭМ с точки зрения бэкенд-разработчика.
BEM for corporate sites — failover frontendAlex YaroshevichSpeech about BEM and our fails at FailOver conference, 2015
by Kirill Lapenin, Alexej Yaroshevich
Materials and links: https://www.channelkit.com/yaroshevich/bem-for-corporate/
´ǰʰ-обновленияAnna LadoshkinaWordPres-обновления: Что нового в версии 4.0, что ждем от версии 4.1 и нужны ли нам обновления ядра.
Слайды к докладу на WordPress Meetup в Санкт-Петербурге, октябрь 2014
JSLab.Сергей Пузанков. "Разработка небольшого проекта c BEM и node.js" GeeksLab Odessa28.03.15. Одесса. Impact Hub Odessa. Конференция JSLab.
Сергей Пузанков. "Разработка небольшого проекта c BEM и node.js"
В своём докладе я расскажу, как использовал BEM для организации кода небольшого проекта вне Яндекса. Поговорим о том, что такое bem-node, каковы его возможности и как быстро создать с его помощью небольшой, но легко масштабируемый проект на node.js.
Подробнее:
http://geekslab.co/
https://www.facebook.com/GeeksLab.co
https://www.youtube.com/user/GeeksLabVideo
Программирование в Joomla - применение глобальных переменных для отображения ...Joomla SecretsОбзор глобальных переменных стандартного шаблона Protostar и их связь с компонентом com_content.
Задание глобальных переменных в созданном шаблоне.
PHP-программирование шаблона для регулирования ширины сайта при авторизации и редактировании статьи с фронтэнда сайта.
PHP-программирование шаблона для регулирования отображаемых колонок на сайте.
Адаптивный контент в WordPress.Anna LadoshkinaСлайды к докладу на WordCamp Russia 2013. Создание адаптивных сайтов требует новых подходов не только к дизайну или верстке, но и управлению контентом. Может ли привычная и устоявшаяся система, такая как WordPress, справится с такой задачей? Посмотрим, какие инструменты она предоставляет для этого и чего нам все еще не хватает.
Progressive Enhancement: беспрепятственное использование новейших технологийVladimir Agafonkinݺߣs from my talk about Progressive Enhancement on UXNext HTML5 Picnic in Kiev (held 11 October 2011). Inspired by "Progressive Enhancement 2.0" talk by Nicholas Zakas.
Персонализация сайта февраль 2013Многопрофильный образовательный центр ЭДУКОРДоклад представителя учебного центра Эдукор Остюченко Игоря о персонализации сайта на Дне Интернет-рекламы
Современные технологии создания сайтов: адаптивный дизайн, сайты-одностраничн...borovoystudioСовременные технологии создания сайтов: адаптивный дизайн, сайты-одностраничники, landing pages
Семинар "Аудит сайта презентация" компания ИМТ FriendsTimeОлександр МілютінПрезентация к семинару "Аудит сайт" практические примеры технических проблем сайта
Cайт, который нравится пользователям и поисковым системамFresh ITИз-за каких проблем на сайте можно потерять деньги?
Структура сайта, понятная пользователям и поисковым системам.
Инструменты, которые увеличивают конверсию.
BEM for corporate sites — failover frontendAlex YaroshevichSpeech about BEM and our fails at FailOver conference, 2015
by Kirill Lapenin, Alexej Yaroshevich
Materials and links: https://www.channelkit.com/yaroshevich/bem-for-corporate/
´ǰʰ-обновленияAnna LadoshkinaWordPres-обновления: Что нового в версии 4.0, что ждем от версии 4.1 и нужны ли нам обновления ядра.
Слайды к докладу на WordPress Meetup в Санкт-Петербурге, октябрь 2014
JSLab.Сергей Пузанков. "Разработка небольшого проекта c BEM и node.js" GeeksLab Odessa28.03.15. Одесса. Impact Hub Odessa. Конференция JSLab.
Сергей Пузанков. "Разработка небольшого проекта c BEM и node.js"
В своём докладе я расскажу, как использовал BEM для организации кода небольшого проекта вне Яндекса. Поговорим о том, что такое bem-node, каковы его возможности и как быстро создать с его помощью небольшой, но легко масштабируемый проект на node.js.
Подробнее:
http://geekslab.co/
https://www.facebook.com/GeeksLab.co
https://www.youtube.com/user/GeeksLabVideo
Программирование в Joomla - применение глобальных переменных для отображения ...Joomla SecretsОбзор глобальных переменных стандартного шаблона Protostar и их связь с компонентом com_content.
Задание глобальных переменных в созданном шаблоне.
PHP-программирование шаблона для регулирования ширины сайта при авторизации и редактировании статьи с фронтэнда сайта.
PHP-программирование шаблона для регулирования отображаемых колонок на сайте.
Адаптивный контент в WordPress.Anna LadoshkinaСлайды к докладу на WordCamp Russia 2013. Создание адаптивных сайтов требует новых подходов не только к дизайну или верстке, но и управлению контентом. Может ли привычная и устоявшаяся система, такая как WordPress, справится с такой задачей? Посмотрим, какие инструменты она предоставляет для этого и чего нам все еще не хватает.
Progressive Enhancement: беспрепятственное использование новейших технологийVladimir Agafonkinݺߣs from my talk about Progressive Enhancement on UXNext HTML5 Picnic in Kiev (held 11 October 2011). Inspired by "Progressive Enhancement 2.0" talk by Nicholas Zakas.
Персонализация сайта февраль 2013Многопрофильный образовательный центр ЭДУКОРДоклад представителя учебного центра Эдукор Остюченко Игоря о персонализации сайта на Дне Интернет-рекламы
Современные технологии создания сайтов: адаптивный дизайн, сайты-одностраничн...borovoystudioСовременные технологии создания сайтов: адаптивный дизайн, сайты-одностраничники, landing pages
Семинар "Аудит сайта презентация" компания ИМТ FriendsTimeОлександр МілютінПрезентация к семинару "Аудит сайт" практические примеры технических проблем сайта
Cайт, который нравится пользователям и поисковым системамFresh ITИз-за каких проблем на сайте можно потерять деньги?
Структура сайта, понятная пользователям и поисковым системам.
Инструменты, которые увеличивают конверсию.
Особенности поисковой оптимизации Медиапроектов Mail.Ru GroupMediaprojects Mail.Ru GroupКак устроена работа: процессы
Мониторинг SEO-аспектов происходящих изменений и инструментарий для этого (SEOSan)
Переезд крупных проектов на протокол HTTPS
Как происходит переезд на новую версию сайта (редизайн)
Google Featured Snippets
Accelerated Mobile Pages
Владимир Харев, Особенности поисковой оптимизации медиапроектов, Optimization...Optimization conferenceМониторинг SEO-аспектов происходящих изменений и инструментарий. Инструменты для менеджеров и редакторов (ключевые слова, чек-листы). Оптимизация больших сайтов под Google Новости. Переезд крупных проектов на протокол HTTPS. Как происходит переезд на новую версию сайта без потерь в трафике. Редакционная аналитика: анализ поведения читателей.
Доклад на конференции Optimization 2016.
«Что такое проектирование сайтов и зачем оно нужно» Роман Симачевский, 1Step ...web2win«Что такое проектирование сайтов и зачем оно нужно» Роман Симачевский, 1Step Projects
Seo проектирование сайтаИрина ШаминаВебинар, на котором вы узнаете, как создать сайт, готовый к продвижению в органической выдаче, что надо учесть при его разработке, какие нюансы влияют на результат, как встроить SEO в сайт при создании, чтобы получить максимальный при продвижении.
«Правильный процесс дает правильный результат». Как грамотно выстроить работу...borovoystudio
«Правильный процесс дает правильный результат». Как грамотно выстроить работу по разработке и продвижению интернет-проекта
Игорь Повшок, руководитель отдела продаж Студии Борового
3. Может по-английски понятнее?
Hot Sale Anonymous Mask Sexy
Man Sticker Car Window Truck
Bumper Auto SUV Door Laptop
Kayak Art Wall Etc Vinyl Decal 8
Colors
4. ⋆ С чего всё начинается
• Русская версия сайта уже есть, хотим вторую
• Сейчас мы в России, но начинаем завоёвывать
несколько стран одновременно
• Пока стартуем в России, но потом добавляем другие
страны
• Стартуем сразу несколько стран одновременно
5. # Определяемся с ситуацией
• Поддерживает ли текущая CMS создание
многоязычных сайтов
• Есть ли у нас весь контент на всех нужных нам
языках
• Насколько срочно нужна каждая языковая версия
• Действительно ли языковая версия нужна прямо
сейчас?
7. Подход №1: языковой клон сайта
Что делаем:
- полностью копируем сайт на другой домен
- переводим контент на нужный язык
- не забываем поменять URL внутри сайта
Плюсы:
- быстро
- дёшево
- всё уже работает
Минусы:
- затратно сопровождать 2 версии одновременно
- перевод контента нужен сразу
- тяжело уследить за изменениями
8. Подход №2: костыли к текущему сайту
Что делаем:
- расширяем функционал CMS до поддержки других
языков
Плюсы:
- можно сделать всё по-хорошему
- кажется, что это быстро и правильно
Минусы:
- не быстро
- высока вероятность ошибок
- высока цена ошибки
- разработчики в гневе
9. Подход №3: Начать с нуля
Что делаем:
- разрабатываем с нуля заранее мультиязычный сайт с одним
ядром
- закладываем все будущие планы по развитию в других странах
Плюсы:
- гарантированное качество, при правильном управлении
- гибкость и неограниченность в возможностях
- разработчики будут счастливы
Минусы:
- не быстро
- не дёшево
10. $ Связка языковых версий
• Общие продукты, характеристики
• Схожая структура
• Схожие связи между сущностями(например: продукт -> сопутствующие
услуги)
• Единая система авторизации, личный кабинет, история заказов
• Одни изображения
• Цены
• и так далее…
11. ! Что переводить?
• Новости и контентные страницы
• Категории, продукты
• Свойства продуктов и их значения
• Виджеты, сообщения, навигационные элементы
• Комментарии и отзывы*
* с возможностью посмотреть оригинальный текст
• URL, META-теги
• Валюта
• E-Mail рассылки
• Админка
12. % Ускоряем процесс
Проблема:
Контента много, а выкатываться хотим по мере
готовности перевода.
Решение:
- Заранее предусматриваем статус публикации(вкл./выкл.)
языковой версии контента.
- Пока не опубликован - на сайте не появляется.
- Для случайных переходов 302 редирект с пометкой
о неготовности перевода.
13. & Эффективный интерфейс
1. Один контент-менеджер видит только свой язык
2. Контент-менеджер видит несколько языков:
Редактируем одну сущность на одной странице с переключением
между языками.
14. ' Продвижение - SEO
1. Правильная структура URL-адресов и/или доменов
2. Возможность индексации всех языковых версий без
применения JavaScript и использования Cookie
3. Использование hreflang для указания версии текущей
страницы на другом языке
4. Не забыть про roots.txt и sitemap.xml
5. Придерживаться в обозначениях языков ISO 639-1 или ISO
3166-1 Alpha 2
15. ( SEO - региональный домен
Каждому языку - свой домен.
Например: example.ru, example.de, example.in
Плюсы:
- легко определить «на глаз» принадлежность к языку по домену
- быстрая автоматическая привязка домена к языку в
поисковике
Минусы:
- домены могут быть недоступны для регистрации
- cookie распространяется только на конкретный домен
16. … SEO - поддомены
Каждому языку - свой поддомен.
Пример: de.example.com, ru.example.com
Плюсы:
- можно привязать к языку через панели вебмастеров поисковика
каждый отдельный поддомен
- cookie можно привязать к домену верхнего уровня - пользователи будут
авторизованы на всех языковых версиях одновременно
Минусы:
- если главный домен - региональный(например: example.in) - могут
возникнуть проблемы в привязке*
* К примеру, домены в зоне .in практически невозможно привязать к России в Google без помощи поддержки.
17. * SEO - папка для языка
Каждому языку - своя папка внутри главного домена.
Пример: example.com/ru/, example.com/en/
Плюсы:
- нет проблем с cookie
Минусы:
- нельзя привязать к языку через панель в Яндексе
- главный домен должен быть интернациональным
18. | Продвижение - не только SEO
В разных странах - разное всё:
- сегментация аудитории
- востребованность конкретных продуктов
- поисковый спрос
- предпочтения аудитории
- контексты и сценарии использования сайта
- доставка и оплата
- представления о доверии к организации
и многое другое…
19. , Что нужно учесть заранее
• Возможность подстраивать посадочные страницы,
процесс заказа под ЦА и региональную специфику
• Отдельные связи для предложений, продвигаемых
внутри сайта
• Кастомизация навигации по сайту
• Региональные единицы измерения(размер одежды,
температура воздуха, расстояние и т.д.)
22. - Аналитика и юзабилити
• Анализировать региональные версии нужно как по
отдельности, так и вместе
• Одни и те же приёмы Usability могут работать в одной
стране, но абсолютно не работать в другой
• Эксперименты с Usability и конверсией нужно проводить на
правильной аудитории(язык, сегмент, объем и потребность)
• Социологические опросы могут помочь выявить неявную
специфику языка и аудитории
23. . Бонус разработчикам на Yii2
Open-Source расширение для Yii Framework 2 для разработки многоязычных сайтов:
- поддержка региональных доменов, поддоменов и папок
- управление и редактирование регионального контента
- виджет переключения языка
- hreflang
- демо-блог
- и многое другое
/ github.com/DevGroup-ru/yii2-multilingual
Лицензия: MIT