Сайты для мобильных устройств

Здравствуйте, читатели блога Сайт с нуля.

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

  • Сайт с адаптивным дизайном — подстраивается под разрешение и размер экрана; доступен по одному URL для всех типов устройств.
  • Динамическая верстка страниц — для просмотра с разных мобильных устройств сервер отправляет в ответ на запрос одного URL различные варианты кода HTML и CSS.
  • Мобильная версия сайта (отдельный домен или поддомен) — для просмотра с мобильных устройств используется отдельный URL (специальный поддомен:m.example.com, mob.example.com и пр.).

Общие рекомендации

Ниже представлены рекомендации для вебмастеров вне зависимости от выбранного способа адаптации сайта.

  • Ресурсы должны быть доступны для индексирующего робота Яндекса: Mozilla/5.0 (iPhone; CPU iPhone OS 8_1 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) Version/8.0 Mobile/12B411 Safari/600.1.4 (compatible; YandexBot/3.0; +http://yandex.com/bots). Разрешите в файле robots.txt сканирование CSS, JavaScript, от которых зависит отображение сайта на мобильных устройствах. Иначе страницы сайта могут некорректно отображаться в результатах поиска.
  • Страницы сайта должны отправлять серверу ответ с HTTP-кодом 200 OK. Вы можете проверить ответ сервера в Яндекс.Вебмастере.
  • Не используйте технологии Flash, Silverlight или Applet на страницах, ориентированных на мобильных пользователей — эти технологии могут не поддерживаться на мобильных устройствах.
    Совет. Например, пользователи не смогут просмотреть интерактивную часть сайта или видеоролик, встроенные на Flash. Поэтому рекомендуем встраивать контент с помощью HTML5 или отказаться от тяжелых и сложных интерактивных элементов.
  • Размещайте контент вашего сайта таким образом, чтобы он был максимально виден на экране мобильного устройства.
  • Содержимое страниц не должно выходить за рамки экрана по горизонтали.
  • Размер текста в пикселях должен быть таким, чтобы весь текст удобно читался на экране мобильного устройства.

Проверить на сколько хорошо сайт адаптирован под мобильные устройства можно в разделе ИнструментыПроверка мобильных страниц Яндекс.Вебмастера.

Вопросы и ответы про мобильные сайты

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

Как избежать дублирования контента?
Основная версия сайта и мобильная воспринимаются роботом Яндекса как отдельные сайты и индексируются отдельно друг от друга.

Чтобы помочь роботу правильно определить мобильную версию сайта, укажите на страницах основного сайта соответствующие URL мобильной версии. Например, с помощью элемента link:

<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/page.html"/>
Надо ли устанавливать перенаправление на мобильную версию сайта?
Вы можете перенаправлять пользователя с основного сайта на мобильную версию, учитывая user-agent устройства, с которого пользователь просматривает сайт.

Надо ли добавлять мобильную версию сайта (домен или поддомен) в Яндекс.Вебмастер?
Вы можете добавить мобильную версию сайта в Яндекс.Вебмастер, чтобы отслеживать статистику индексирования страниц.

Можно ли создать мобильную версию сайта в подкаталоге (папке)?
Если мобильная версия сайта находится в директории основного сайта, индексирующий робот Яндекса не сможет корректно проиндексировать данные. Рекомендуем создавать мобильную версию на отдельном домене или поддомене основного сайта.

Как сообщить роботу Яндекса о наличии адаптивной версии сайта?
Для сайтов с адаптивным дизайном используйте мета-тег <meta name=»viewport» content=»width=device-width, initial-scale=1″>, чтобы указать область просмотра контента. Подробно см. в разделе Использование HTML тегов.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

  bigmir)net TOP 100  - .  E-mail: sitesnulyaru@gmail.com