Марат-блог
Услуги по продвижению и разработке сайта
Отправить заявку
Заказать обратный звонок

Спасибо, Ваша заявка принята.

В ближайшее время менеджер свяжется с Вами.

Главная SEO 29 шагов к отличной мобильной версии сайта
29 шагов к отличной мобильной версии сайта
SEO
29
12 октября 2017

29 шагов к отличной мобильной версии сайта

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

Общая проверка

  • Мобильная версия сайта корректно сканируется в Search Console. Нужно проверить при помощи инструмента Fetch as Google.
  • Для проигрывания видео-контента применяется HTML5.
  • Видео воспроизводится правильно – без ошибок и запинок.
  • Нет окна онлайн-консультанта (оно скрыто для удобства).
  • Отсутствует навязчивая реклама на весь экран.
  • Отступы между ссылками – не меньше, чем 28 пикселей по вертикали и горизонтали.
  • Мобильная или адаптивная версия сайта протестированы минимум на пяти различных разрешениях экрана, в двух мобильных браузерах и на трех устройствах с разными разрешениями экрана.
  • Мобильная версия сайта содержит возможность заказа товара в один клик.
  • Номера телефонов кликабельны и соответствуют тому региону, по которому происходит реклама.

Проверка адаптивного дизайна

  • Для правильного отображения содержимого в блоке <head> есть метатег viewport с такими показателями: <meta name=«viewport» content=«width=device-width, initial-scale=1.0»>
  • Размеры картинок сайта без проблем адаптируются по размер экрана любого устройства.
  • Поисковый робот имеет доступ JavaScript, файлам CSS и картинкам, как и обычный пользователь сайта.
  • Меню сайта размещено на экране № 1.
  • Ссылка на корзину размещена в первом экране.
  • Чтобы адаптировать видео под любые разрешения экранов, на сайте размещен тег HTML5 <video>.

Детальный анализ мобильной версии сайта

  • Пользователи мобильных телефонов в автоматическом режиме на мобильную версию сайта посредством 302 редиректа.
  • Пользователи десктопов перенаправляются на стандартную версию сайта посредством 302 редиректа.
  • Мобильная версия сайта содержит кнопку для перехода на стандартную версию сайта, кнопку видно четко.
  • Если пользователь присутствовал на мобильной версии сайта и попал на обычную, то при переходе на иные страницы он не попадает на мобильную версию сайта.
  • Перекрестные ссылки работают правильно.
  • Для десктопа и мобильной версии указываются канонические URL-адреса посредством тегов <link> с элементами rel=«canonical» на десктопную версию.
  • Для десктопа и мобильной версии указываются альтернативные ссылки rel=«alternate» обоих версий.
  • В robots.txt и Google Search Console создали и добавили отдельную XML-карту для «мобильного» сайта.
  • Проведен технический SEO-аудит с аналогией по аудиту стандартной версии сайта.
  • Посредством сервиса PageSpeed Insights проверили загрузку сайта для мобильных сайтов с получением низких баллов (менее 80) и разработкой технического задания по оптимизации на базе подсказок сервиса.
  • Общий стиль мобильной версии отвечает стилю десктопной.

Проверка динамического показа

  • В ответе сервера настроен HTTP-заголовок Vary: User-Agent. Это нужно для того, чтобы отправлять сообщение Google и браузеру о том, что HTML код сменяется по признаку User-Agent.

Придерживаясь этих простых советов ваш сайт будет иметь привлекательный вид и удобный функционал.