Найти в Дзене
NEWMARK. Все о сайтах.

5 бесплатных сервисов для проверки адаптивности сайта

Оглавление

Почему так важно проверять сайты на адаптивность? По данным Яндекс.Метрики, количество людей, пользующихся мобильными устройствами в России, приближается к 50% и постоянно растёт.

В связи с этим поисковые системы стремятся сделать мобильную выдачу удобнее для пользователей. В феврале 2015 г. Google заявляет, что наличие адаптивной или мобильной версии положительно сказывается на ранжировании. Ровно через год, в феврале 2016-го, Яндекс объявляет то же самое.

Какими качествами должен обладать адаптивный сайт

  • Отсутствие горизонтальной прокрутки
  • Быстрая загрузка, отсутствие тяжелых картинок
  • Корректно прописан метатег viewport
  • Интерактивные элементы (ссылки, кнопки, формы и т.д.) не находятся слишком близко друг к другу
  • Отсутствие Flash -элементов, Silverlight- плагинов
  • Удобная навигация по разделам
  • Контент (текст и картинки) адаптирован под размер экрана и читаются без увеличения

Сервисы для онлайн-проверки адаптивности сайта

Отображает, как выглядит первый экран сайта на смартфоне, даёт общую оценку качества оптимизации.

-2

Преимущества

  • Официальный сервис Google
  • Указывает на конкретные ошибки
  • Умеет сам определять наличие мобильной версии

Недостатки

  • Нельзя посмотреть, как выглядит сайт при разных размерах экрана
  • Показывает только первый экран, нельзя взаимодействовать с сайтом

  • Яндекс.Вебмастер Mobile Friendlyhttps://webmaster.yandex.ru/site/tools/mobile-friendly/

В отличие от инструмента от Google проверить можно только свои ресурсы, на которые вы подтвердили права в Яндекс.Вебмастере. Показывает общую оценку и показывает, как сайт выглядит на смартфоне.

-3

Преимущества

  • Официальный сервис Яндекса
  • Указывает на конкретные проблемы в оптимизации
  • Понимает, есть ли у сайта мобильная версия
  • Проверить можно только свои сайты
  • Нет возможности посмотреть, как выглядит сайт на разных экранах

Недостатки

  • Проверить можно только свои сайты
  • Нет возможности посмотреть, как выглядит сайт на разных экранах

Удобный и функциональный сервис, есть возможность посмотреть, как будет выглядеть сайт на различных устройствах от смартфонов до телевизоров.

-4

Преимущества

  • Можно выбрать из готового списка устройств или задать собственное разрешение
  • Можно взаимодействовать с сайтом

Недостатки

  • Не умеет определять наличие мобильной версии
  • Нет списка ошибок

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

-5

Преимущества

  • Есть возможность посмотреть, как выглядит сайт на разных операционных системах (IOS и Android)
  • Сам понимает, есть ли мобильная версия
  • Расширение для Google Chrome

Недостатки

  • Нельзя самому указать размер экрана, только выбрать из готового списка
  • Нет списка ошибок
  • Всегда автоматически загружает мобильную версию, без возможности посмотреть, как выглядит десктопная версия при разных разрешениях

-6

Преимущества

  • Подводит общую оценку качеству оптимизации, дает советы по исправлению ошибок.
  • «Не видит» мобильную версию.
  • Нет возможности указать свой размер экрана.

Недостатки

  • «Не видит» мобильную версию.
  • Нет возможности указать свой размер экрана.

Вывод

При наличии доступа к сервисам веб-мастеров (Яндекс.Вебмастер или Google Search Console) проводить тест на адаптивность лучше всего с их помощью. Они отражают наиболее актуальные требования поисковых систем к вашему сайту.

Если же такой возможности нет, то можно воспользоваться http://iloveadaptive.com/ в связке с http://adaptivator.ru/, так как они дополняют друг друга по функционалу.

Вы можете прочитать эту и другие статьи на нашем сайте — https://blog.nmark.ru
Статья оказалась полезной? Ставьте лайки, подписывайтесь на наш канал!