Уже длительное время оптимизаторам известно, что сайт, адаптированный для мобильных устройств получает приоритет в ранжировании в мобильной и в десктопной поисковой выдаче. Все еще не привели в порядок сайт и он не удовлетворяет современным требованиям поисковых систем? Читайте в нашей статье основные рекомендации для оптимизации под mobile.
Мобильная оптимизация – что следует учитывать
Результатом корректного внедрения мер на пути к адаптиности станет повышение позиций и трафика с мобильных и десктопов. Как следствие, также улучшаются поведенческие факторы, и повышается конверсия.
Адаптивная версия
На основе текущего сайта технические специалисты могут разработать его адаптивную версию, используя CSS и JS – таким образом, в итоге сайт корректно отображается практически на любых устройствах.
Не забудьте открыть CSS и JS для индексации поисковиками – с помощью этого создается рендер страниц. Если все-таки имеется необходимость скрыть часть таких файлов, то рекомендуется вывести их в отдельные блоки и закрыть именно их, а все что касается непосредственно адаптивности должно быть открыто для индекса.
Протокол HTTP/2
Смысл использования данного протокола заключается в снижении объема передаваемых данных, что в свою очередь увеличивает скорость загрузки сайта – очень важный параметр для мобильных устройств, который оказывает некоторое влияние на рейтинг сайта в поисковой выдаче.
Особенности HTTP/2:
- мультиплексирование – параллельная загрузка статических элементов. Результатом данного процесса является увеличение скорости сайта;
- уменьшение объема передаваемых данных за счет сжатия заголовков;
- приоритетная загрузка главного содержимого в самом начале;
- улучшенные показатели скорости работы на устройствах и сервере.
Отсутствие неподдерживаемых мобильными браузерами элементов
Убедитесь, что в мобильной версии вашего сайта отсутствуют всплывающие окна и элементы с технологией Silverlight или подобной ей.
Всплывающие окна закрывают основное содержание страниц, а также распознаются алгоритмами поисковых систем, что, в свою очередь, ведет к понижению позиций в поисковой выдаче.
CSS вместо AJAX
Загрузка дополнительного (скрытого) контента в адаптивной версии допускается поисковыми системами, но чтобы он индексировался корректно, и не влиял отрицательно на сайт, должна быть настроена его первоначальная загрузка, после которой с помощью CSS идет скрытие.
Перелинковка при использовании мобильного сайта
Бывают ситуации, когда отсутствует возможность внедрить адаптивность в текущую версию. В данном случае создается отдельная мобильная версия на выделенном хосте. Когда адрес версии для мобильных отличается от основного сайта, требуется настройка перелинковки. В код мобильной версии стоит добавить элемент <link rel=»alternate» href=»desktop»>, а десктопной версии указывается <link rel=»alternate» href=»mobile»>.
Если у вас адаптивная версия дизайна сайта, то настройка указанных параметров вам не нужна.
Читабельность текста
Для мобильных устройств стоит адаптировать также и текстовый контент. Базовые рекомендации примерно следующие:
- более заметный контраст текста и фона;
- используйте графические элементы;
- более мелкое дробление большого текста на параграфы;
- интервал между параграфами должен быть в районе 50-60 символов;
- размер шрифта 14-16 пикселей.
Мета-тег Viewport
Адаптивный дизайн сайта предполагает использование Viewport Content. Данный тег «подгоняет» отображение сайта под размер экрана устройства пользователя.
Скорость загрузки
Данную тему мы рассматривали в отдельной статье, но коротко обозначим ключевые моменты:
- скорость загрузки сайта очень сказывается на ранжировании в Google (в последнее время и система Яндекс стала более «чувствительна» к данному параметру);
- используйте бесплатный инструмент Google PageSpeed Insights – стремитесь оказаться в «зеленой» зоне, что для ПК версии, что для мобильной;
- постарайтесь реализовать рекомендации из PageSpeed Insights по максимуму.
Первый экран
Первый экран должен явно говорить пользователю о том, что он пришел по назначению – информация должная быть представлена максимально коротко и ясно – рекомендуем почитать про фактор ранжирования Dwell Time.
AMP и Турбостраницы
Если с адаптивностью в вашем случае все сложно, то обязательно используйте AMP и турбоверсии страниц – это страницы сайта, предназначенные для загрузке на мобильных устройствах при выявлении интернет-соединения низкого качества. AMP – это технология Google, а турбостраницы (смысл их работы несколько иной, но цель примерно та же) – технология Яндекс.
Качество сниппетов
Проработайте Title и Description страниц, в том числе не забудьте про оптимизацию их длины в символах. Мы рекомендуем выдерживать заголовки страниц в рамках 60-70 символов, а описания в районе 150.
Дополнительные рекомендации по SEO для мобильных устройств
- В приоритете должно быть внедрение адаптивного дизайна для сайта. Если нет возможности, то используйте мобильную версию, но с обязательной перелинковкой.
- Проверяйте свой сайт на адаптивность, как минимум, с помощью бесплатных инструментов: Google PageSpeed Insights, Mobile-Friendly Test в Google Search Console, инструмент проверки мобильных страниц в Вебмастере Яндекс.
- Адаптивность – фактор ранжирования. Нельзя пренебрегать этим фактом, так как аудитория мобильных устройств неуклонно возрастает. Дополнительно напомним, что наличие/отсутствие адаптивной версии сайта влияет не только на позиции в мобильной поисковой выдаче, но и в десктопной.
- Отслеживайте позиции отдельно для мобильной поисковой выдачи. Отслеживание исключительно версии поиска для ПК не дает полной картины видимости сайта.
- Исключите горизонтальную прокрутку вашего сайта на мобильных устройствах – если она есть, то адаптивность сайта отсутствует, либо ее реализация некорректна.
- Контент на обеих версиях сайта должен быть идентичным.