Мобильные устройства давно стали полноценной заменой ПК — на смартфоны и планшеты приходится уже больше 50% интернет-трафика, а в некоторых тематиках больше 80%. В будущем этот показатель будет расти, поэтому владельцам сайтов приходится учитывать в SEO-продвижении мобильную выдачу, рассчитанную на компактные гаджеты. Разбираемся, что такое мобильная SERP и чем она отличается от десктопной версии поиска.
Значение мобильной выдачи в современном мире
Мобильная выдача занимает уже больше половины всего трафика, а Google полностью перешла на mobile-first-индексирование — в ТОП выдачи попадают ресурсы с хорошей мобильной версией. Вот почему это происходит и что это значит для владельцев сайтов.
Рост мобильного интернет-трафика
В конце 2023 года был зафиксирован максимальный показатель мирового мобильного трафика — 67%. Для сравнения, еще в 2020 году этот показатель не превышал 50%. При этом подавляющее большинство пользуется именно смартфонами — планшетами пользуется чуть больше 1% посетителей сайтов.
Такая статистика связана с тем, что рынок электроники непрерывно развивается — производители выпускают все больше недорогих, но качественных моделей, которые по функционалу полностью заменяют ПК и ноутбуки. Операторы постоянно расширяют зону покрытия — высокоскоростной мобильный интернет доступен даже жителям отдаленных регионов. При этом телефоны компактнее и дешевле стационарных устройств, поэтому им отдает предпочтение все больше пользователей.
Адаптация сайтов под мобильные устройства
С ростом популярности телефонов и планшетов перед владельцами сайтов встала задача оптимизировать их так, чтобы пользователи мобильных устройств могли комфортно пользоваться ресурсом и просматривать текстовый и графический контент. Раньше адаптации не было вообще — чтобы прочитать информацию, приходилось увеличивать страницы, при этом картинки часто перекрывали весь текст. Пользователи, не получив доступа к нужному контенту, уходили к конкурентам, которые уже успели оптимизировать свой сайт под небольшие экраны.
Сейчас мобильная версия — это базовая необходимость: она есть у всех крупных сайтов. Но на рынке постоянно появляются новые устройства с разной диагональю экрана, соотношением сторон и разрешением — при адаптации нужно учитывать вариативность, чтобы пользователь любой модели мог комфортно просматривать страницы.
Особенности мобильной выдачи
Мобильная SERP (Search Engine Results Page) полностью отличается от десктопной версии — рассмотрим основные различия.
Расположение элементов на мобильном SERP
Из-за небольшого размера экрана у телефонов поисковики вынуждены менять расположение баннеров, чтобы страница поиска сохраняла юзабилити. Например, в Яндексе и в Google при просмотре с компьютера блок “Картинки” обычно отображается справа от выдачи, с телефона — сверху над ней, из-за чего сайты из ТОПа получают меньше внимания.
Баннеры Директа и Google Ads в десктопной версии также расположены слева и имеют расширенный формат с картинкой и быстрыми ссылками, в мобильной — представлены сверху основного ТОПа и имеют вид простого сниппета. Кроме того, рекламный блок с компьютера занимает только малую часть дисплея, а с телефона — почти весь экран: органический ТОП становится менее заметным. Это можно учитывать и при заказе рекламы в выдаче, настраивая ее на показ в основном на мобильные устройства.
Мобильные фичи в SERP: AMP, виджеты и другие
Несмотря на то, что мобильная версия обычно позиционируется как облегченная, у нее есть некоторые особенности, которых нет в десктопе. Одна из них — APM, или accelerated mobile pages (аналог турбо-страниц в Яндекс). Это — упрощенная версия страницы без анимированных баннеров и автоматически воспроизводящихся видео. которая загружается быстрее даже при медленном мобильном интернете. Такой формат был запущен Google в 2015 году и сохранял популярность в течение 5-6 лет, сейчас от него почти полностью отказались в пользу полностью адаптированных под мобильные устройства сайтов. Тем не менее, поисковик продолжает поддерживать AMP-страницы: их можно использовать в качестве временного варианта до того, как сайт будет оптимизирован полностью.
Еще одна особенность мобильной выдачи — привязка к геолокации и контекст выдачи. Это связано с тем, что ПК и ноутбуками в основном пользуются дома, а телефон носят с собой везде. Например, если человек вводит запрос “роллы” со стационарного устройства, в выдачу попадут доставки и рецепты, если с телефона — на первом месте будут заведения в непосредственной близости от местоположения пользователя, где можно найти японскую кухню.
Также в выдаче реализованы интерактивные виджеты, которые поддерживают сенсорный ввод или переход в скачанные приложения. Например, при нажатии на номер телефона открывается программа, через которую можно сразу совершить звонок.
Отличия от десктопной выдачи
Главное отличие между мобильной и компьютерной выдачей — это позиция ресурса в ТОПе. Только 13% сайтов при поиске с телефона находятся на том же месте, что и в десктопной версии. При этом большинство ресурсов из ТОП-10 компьютерной выдачи вообще не попадают на первую страницу мобильного варианта. Поэтому хорошая позиция в десктопной версии не гарантирует, что сайт будут видеть пользователи мобильных устройств.
Попадать в выдачу для телефонов приоритетнее — это приносит больше органического трафика. Поисковики пропускают туда те сайты, которые хорошо адаптированы под мобильные устройства по дизайну и быстро загружаются — это позволяет легко обойти конкурентов с худшей оптимизацией и пройти в ТОП даже по запросам высокой частоты.
Как оптимизировать контент для мобильной выдачи
Итак, получить место в ТОПе мобильной выдачи важно для органического трафика — вот как оптимизировать контент сайта, он соответствовал требованиям поисковика.
Адаптивный дизайн и мобильная версия сайта
Для оптимизации дизайна используется адаптивная верстка — под мобильные устройства разрабатывается своя версия сайта, которая повторяет контент и визуальные элементы, но размещает их по-другому — так, чтобы пользователю было удобно ее просматривать. Например, на компьютере меню навигации по сайту с разделами находится сверху, на телефоне — открывается свайпом от левой части экрана или нажатием на соответствующую кнопку. При этом и контент, и функционал сохраняется — у пользователей мобильных устройств такие же возможности, как и у десктопной версии.
Если сайт делают на сервисе-конструкторе с шаблонами, например, WordPress или Tilda, его можно оптимизировать автоматически — страницы подгоняются под небольшой размер экрана, остается только протестировать его и внести коррективы. Если ресурс создается с нуля, придется делать отдельные макеты под телефон и компьютер.
Мобильная версия сайта должна соответствовать следующим критериям:
- сохранение общей стилистики — страницы должны быть оформлены одинаково;
- функциональность — возможности пользователя не должны быть урезаны;
- сохранение иерархии сайта — нельзя кардинально менять структуру;
- удобный размер кнопок — нужно учитывать, что попасть по нужному элементу пальцем сложнее, чем мышкой;
- логика размещения блоков — лучше, если последовательные элементы читаются сверху вниз, а не слева направо.
Оптимизация изображений и медиа-контента
Распространенная проблема мобильных версий — картинки или видео “залезают” на текст и перекрывают его. Иногда она остается, когда сайт оптимизируется через конструктор. Чтобы этого избежать, нужно тестировать каждую страницу — при выявлении проблемы габариты картинки придется менять вручную.
Другая проблема — это большой вес изображений: они замедляют загрузку, особенно при низкой скорости интернета, и потребляют лишний трафик. Чтобы проверить размер, нужно скачать картинку и посмотреть ее параметры в проводнике. Если файл весит более 1 Мб, изображение лучше сжать — это можно сделать через сторонние сайты, встроенный Paint или массово через конструкторы.
Если на полной версии сайта видео воспроизводятся автоматически, то на телефоне эту функцию по умолчанию лучше отключить.
Ускорение загрузки страниц на мобильных устройствах
Вот что нужно сделать, чтобы страницы в мобильной версии загружались быстрее:
- выберите быстрый хостинг;
- сожмите изображения, уменьшив их размер;
- отключить автовоспроизведение видео;
- не нагружайте интерфейс большим количеством gif-изображений;
- включите кэширование, чтобы браузер “запоминал” страницу и ему не приходилось обрабатывать всю информацию повторно;
- по возможности откажитесь от всплывающих окон;
- размещайте только необходимые плагины;
- используйте как можно меньше разных шрифтов, оптимально — 2-3.
Инструменты и метрики для анализа мобильной выдачи
Самый простой способ проверить, адаптирован ли сайт под мобильные устройства — зайти на него с телефона и посмотреть, удобно ли перемещаться по страницам, просматривать контент, делать заказы или общаться через форму обратной связи. Таким образом можно выявить самые заметные проблемы, а для устранения мелких недочетов, которые влияют на ранжирование, нужно воспользоваться сервисами.
Google Search Console и отчеты по мобильной производительности
Google Search Console — это инструмент, который позволяет узнать, как сайт выглядит для поисковика и дает возможность выявить ошибки, мешающие ранжированию. Раньше там находился раздел “Удобство для мобильных”, но с декабря 2023 года его поддержка прекратилась. В качестве альтернативы рассматривается инструмент Lighthouse от Google Chrome. Он бесплатный, легко устанавливается и позволяет выявить основные недостатки в мобильной версии. Тем не менее, его функционал ориентирован больше на десктоп-сайты, поэтому лучше воспользоваться сторонними сервисами.
Инструменты для тестирования мобильной дружественности
Вот несколько способов бесплатно протестировать адаптивность сайта:
- DevTools в браузере, обычно вызывает кнопкой F12 и позволяет оценить, как любой сайт выглядит на разных размерах экрана;
- расширение Responsive Viewer от Google Chrome отображает вид сайта на самых популярных моделях телефонов;
- I Love Adaptive дает возможность загрузить макет и посмотреть, как он будет выглядеть на устройствах от Apple и Samsung;
- Resizer — расширение для Chrome, которое позволяет самостоятельно менять размер экрана и смотреть, как выглядит сайт;
- Adaptivator — онлайн-сервис, который тестирует сайт по ссылке и представляет его внешний вид на одном из устройств встроенного списка, менять размер самостоятельно нельзя.
Метрики оценки производительности на мобильных устройствах
Вот что нужно оценивать при анализе мобильной версии:
- схожесть с мобильной версией и сохранение функционала;
- внешний вид и юзабилити;
- скорость загрузки;
- время между открытием сайта и полной прорисовкой графических элементов;
- конверсия с мобильной версии сайта;
- количество данных, передаваемых за один сеанс;
- среднее время, которое пользователь телефона проводит на сайте;
- процент посетителей, которые ушли с мобильной версии, не совершив целевое действие.
Заключение
Итак, подведем итоги:
- мобильный трафик постоянно растет, на данный момент он составляет 66%;
- выдача в мобильной и десктопной версии различается, в ТОП попадают разные сайты;
- попасть в мобильную выдачу важнее, чем в компьютерную, а Google отдает предпочтение сайтам с хорошей адаптивностью даже при десктопном поиске;
- для оптимизации под мобильные устройства используется адаптивная верстка — макеты разрабатывают с нуля или создают в конструкторе;
- функционал версии для телефонов нельзя урезать, также должна сохраняться единая стилистика;
- для ускорения загрузки сжимают картинки, отключают ненужные плагины, минимизируют анимацию;
- оценить, насколько сайт адаптирован под мобильную версию, можно через инструмент Lighthouse от Google Chrome или сторонние сервисы.