Мобильное SEO помогает сделать сайт удобным на смартфонах и заметным в мобильной поисковой выдаче. Оно объединяет работу с контентом, отображением страниц, скоростью и доступностью элементов управления.
По данным, приведённым в источнике в апреле 2024 года, на мобильные устройства приходилось 58% мирового веб-трафика, хотя доля сильно различалась по отраслям. К тому времени Google завершил переход на индексирование с приоритетом мобильной версии, а 12 марта 2024 года показатель Interaction to Next Paint (INP) заменил First Input Delay (FID).
Почему мобильное SEO важно
Поисковая оптимизация для мобильных устройств решает те же задачи, что и традиционное SEO: помогает пользователям находить подходящий контент. Но дополнительно приходится учитывать размер экрана, способ отображения страницы, скорость загрузки и удобство взаимодействия.
При индексировании с приоритетом мобильной версии Google ориентируется на мобильный опыт сайта. Поэтому проблемы с отображением и доступностью контента на смартфоне могут затруднить индексирование ещё до того, как сработают алгоритмы ранжирования.
Доля мобильной аудитории зависит от отрасли и намерения пользователя. Например, на B2B-сайтах может преобладать десктопная аудитория, а для крупных покупок пользователи могут предпочитать компьютер. Прежде чем расставлять приоритеты, стоит изучить собственные данные.
Как определить долю мобильного трафика
В Google Analytics 4 можно посмотреть распределение пользователей по категориям устройств. В интерфейсе, описанном источником по состоянию на март 2024 года, для этого предлагалось открыть Reports, нажать значок Insights и в разделе Suggested Questions выбрать Technology, затем Top Device model by Users и связанный результат Top Device category by Users. Отчёт использовал диапазон дат, выбранный в GA4.
Другой вариант — отчёт в Looker Studio: добавить сайт как источник данных, выбрать Device category в качестве измерения и 30-day active users в качестве показателя, а затем подобрать подходящий тип диаграммы. Дополнительные измерения помогут сравнить страницы, страны и поисковые системы по доле мобильных пользователей. Названия разделов и порядок действий относятся к интерфейсам, описанным в 2024 году.
Как проверить удобство сайта на мобильных устройствах
Google удалил инструмент проверки удобства для мобильных устройств из Search Console в декабре 2023 года. На момент публикации источника для проверки оставались доступны другие инструменты.
Тест Bing проверял, в частности, настройку viewport, соответствие содержимого ширине экрана, читаемость текста и размер интерактивных элементов. Расширение Lighthouse для Chrome оценивало производительность, доступность и SEO; отчёт также можно было запустить на вкладке Lighthouse в инструментах разработчика Chrome, выбрав режим Mobile.
PageSpeed Insights анализирует страницу по указанному URL и включает в отчёт показатели Core Web Vitals. WebPageTest.org помогает визуально изучить процессы загрузки и найти операции, которые её задерживают. В инструментах разработчика Chrome можно переключаться между представлениями для компьютера и мобильного устройства.
Автоматические отчёты полезно дополнить проверкой на собственном смартфоне: быстро ли открывается сайт, можно ли найти важную информацию, прочитать текст и добавить товар в корзину. При анализе отчётов обратите внимание на разделы производительности и доступности: они помогут сформулировать задачи для разработчиков.
Выбор способа отображения страниц
Два распространённых подхода — адаптивный дизайн и динамическая выдача. При адаптивном дизайне CSS и гибкая вёрстка подстраивают расположение и размеры элементов под экран, его ориентацию и разрешение. Для доставки контента также могут использоваться CDN и современные форматы изображений. Именно этот подход источник называет рекомендованным Google.
При динамической выдаче сайт показывает разные фиксированные макеты в зависимости от устройства, например отдельные версии для компьютера, смартфона и планшета. Такой подход даёт больше контроля над содержимым каждой версии, но менее эффективен. Среди других вариантов источник упоминает прогрессивные веб-приложения и отдельный мобильный сайт с собственным URL; последний подход в статье не рекомендуется.
INP: отзывчивость страницы при взаимодействии
FID измерял задержку между первым действием пользователя и началом обработки соответствующих событий браузером. INP рассматривает отзывчивость на протяжении всего времени работы со страницей, а не только при первом взаимодействии.
По порогам, приведённым в источнике, INP менее 200 мс указывает на хорошую отзывчивость, от 200 до 500 мс — на необходимость улучшений, а более 500 мс — на низкую отзывчивость.
Наведение курсора и сама прокрутка не входят в расчёт INP. При этом нажатия клавиш, которые запускают обработчики событий, могут учитываться. Прокрутка способна повлиять на показатель косвенно: например, подгрузка дополнительных материалов может занять основной поток и замедлить реакцию на последующие действия пользователя.
Причинами низкой отзывчивости могут быть длительные задачи JavaScript, большой DOM и сложные обработчики событий. Источник обращает внимание на DOM начиная примерно с 1500 элементов: чем он больше, тем больше работы может требоваться для отображения страницы и реакции на действия. Тяжёлые вычисления или синхронные сетевые запросы в обработчиках также способны задерживать визуальный отклик.
Для работы с проблемой источник предлагает, в частности, разбивать длинные задачи JavaScript на более короткие с помощью Scheduler API и проверять показатели INP по географическим регионам с помощью treo.sh. Это может помочь определить, где отзывчивость вызывает наибольшие затруднения.
Изображения и всплывающие элементы
Изображения должны подходить для экранов разного размера, разрешения и ориентации. В числе рекомендаций источника — адаптивные изображения, отложенная загрузка, сжатие с использованием WebP и добавление изображений в карту сайта. При этом важно учитывать и качество изображения, и влияние на скорость страницы.
Навязчивые межстраничные элементы и всплывающие окна могут закрывать основной контент. Джон Мюллер из Google отмечал особый интерес к первому взаимодействию пользователя после перехода из поиска. Не всякое всплывающее окно считается проблемным, но источник относит к навязчивым окна, которые закрывают большую часть страницы, не подстраиваются под мобильный экран или не позволяют пользователю их закрыть. Также упоминаются окна, появляющиеся без действия пользователя, такого как прокрутка или нажатие.
Структурированные данные и мобильная выдача
Мобильная поисковая выдача включает не только обычные ссылки, но и локальные блоки, товарные объявления, видео и другие форматы. Структурированные данные помогают поисковым системам понимать информацию на странице и могут использоваться для расширенных результатов.
С помощью JSON-LD можно размечать данные об организациях, товарах и услугах по словарю Schema. Для сайтов на WordPress существуют плагины, которые автоматически добавляют разметку. Само наличие разметки не означает, что расширенный результат обязательно появится в выдаче.
Текст и элементы управления
На небольшом экране длинные абзацы читать сложнее, поэтому источник рекомендует лаконичные формулировки, короткие заголовки и размер шрифта, удобный для чтения. По возможности можно предложить тёмный или приглушённый режим, чтобы снизить нагрузку на глаза.
Ссылки, пункты меню, поля форм и кнопки должны быть достаточно крупными и располагаться так, чтобы по ним было удобно нажимать. Согласно источнику, отчёт Lighthouse обращает внимание на цели нажатия меньше 48 × 48 пикселей, а также на элементы, которые перекрываются или закрыты другими частями страницы. Особенно важно проверить навигацию и кнопки покупки в интернет-магазине.
Что улучшать в первую очередь
Если мобильная версия требует масштабирования и горизонтальной прокрутки для чтения, начните с отображения страниц: остальные улучшения не устранят эту базовую проблему. Затем пересмотрите длинные абзацы и удобство чтения, оптимизируйте изображения и убедитесь, что ссылки и кнопки пригодны для нажатия.
Структурированные данные источник ставит после этих задач: расширенные результаты могут помочь привлечь переходы из поиска, но сначала пользователю нужно обеспечить доступный и удобный сайт. При выборе конкретных работ ориентируйтесь на данные об аудитории и проблемы, обнаруженные в проверках.
Комментариев пока нет. Начните обсуждение.