Мы не устанем повторять: бо́льшая часть поискового трафика идёт с мобильных устройств. Не оптимизируете сайт – теряете аудиторию. Всё просто. Самые опасные ошибки мобильных версий мы разбирали в отдельной статье. А здесь расскажем, как проверить ваш сайт без дорогих инструментов и привлечения специалистов.
Зайдите на сайт с телефона
Да, вот просто открыть и посмотреть. Увы, такая гениально-простая идея не всегда приходит в голову. Иначе этой статьи бы не было. Некоторым проще заплатить большой команде, чем ввести адрес в браузере смартфона.
Да и вообще, какие бы продвинутые инструменты ни появлялись, лучше человеческих глаз ещё ничего не придумали.
Конечно же, обычным просмотром дело не закончится. Но с него стоит начать. Запишите всё, что вам покажется неправильным. Привлеките к тестированию друзей, семью и коллег. Пусть посмотрят со своей стороны. На что нужно обратить особое внимание:
- Основные страницы. Убедитесь, что их легко найти. Поставьте таймер, например, на 20 секунд. Не дошли до конечной точки – значит, навигация плохая.
- Контакты. Задача минимум – адрес и телефон должны быть копируемыми. Люди пришли к вам на сайт не для того, чтобы с экрана переписывать ваши контакты на листочек, а потом вручную вбивать их в навигатор и окно вызова. Лучше всего, конечно, сделать их кликабельными: чтобы нажатие на адрес открывало метку на карте, а на телефон – вызов.
- Меню и поиск. Панель меню, раскладывающаяся из «гамбургера» – это уже классика.
- Скрытое меню экономит вам место, безусловно. Но его могут не заметить пользователи. Не заметить, не найти и уйти. Поэтому добавьте ещё поиск по сайту.
- Адаптивность и юзабилити. Сайт, у которого мобильная версия – это уменьшенная десктопная, ужасен. Все эти маленькие значки, поля в которые нужно вглядываться, отталкивают. Если вы не можете сверстать отдельную версию для маленьких экранов, сделайте основной сайт адаптивным. Настройте всё так, чтобы элементы дизайна легко подстраивались под ориентацию и диагональ экрана пользователя.
- Кнопки и ссылки. Они должны быть достаточно заметными и крупными, чтобы на них кликнуть с первой попытки.
- Читаемость. Читать с экрана сложно и при идеальных условиях, а если у вас проблемы с типографикой, можете попрощаться с тысячами посетителей.
- Производительность. Сайт быстро загружается? Ничего не тупит? Чат поддержки не тормозит? Что там Google написал о вашем Page Experience?
Обратите внимание, что вид вашего сайта на разных смартфонах может отличаться. Может даже получиться так, что страница или какие-то элементы вообще не отобразятся. Помните об этом и попытайтесь зайти на сайт со всех возможных устройств. Ну а если такой возможности нет, немного позже мы расскажем, как сымитировать разные диагонали в браузере.
Когда с этим ручным способом вы разберётесь, можно перейти к более автоматическим.
Тестировщики
Здесь мы имеем в виду не людей, а специальные инструменты. Инструменты, которые поисковики создали, чтобы веб-мастера не спрашивали, почему их сайты не проходят в топ. Поисковые роботы учитывают адаптированность под мобильные устройства. Это часть образа качественного сайта. Вы можете воспользоваться инструментом от Google, найти тестировщик в Вебмастере Яндекса или выбрать какой-нибудь сторонний продукт. Выбор у вас огромен.
Даже у Bing есть такой инструмент.
Здесь будет хорош комплексный подход. Проверьте свой сайт несколькими тестерами, они по-разному анализируют страницы, поэтому вы получите больше информации. Но на 100% этой информации доверять не стоит, всё-таки машинный взгляд ещё далёк от человеческого. Оставьте ему 5% кредита недоверия, который компенсирует ваш здравый смысл.
Панель инструментов веб-разработчика
Потестить ресурс можно и из браузера. Откройте свой сайт и нажмите F12 в верхнем ряду клавиатуры. Если ничего не открылось (или открылось что-то, что не похоже на картинку ниже), то кликните правой кнопкой мыши и выберите «Просмотреть код», «Исследовать страницу» или что-то подобное.
Здесь мы смотрим, есть ли сверху такая панелька.
Если нет, открываем её кликом по этому значку:
А дальше – развлекайтесь. В раскладывающемся меню выбирайте разные модели смартфонов.
Когда они закончатся, кликните по последней строчке – и вам выйдет ещё больший список. Кроме того, вы можете растягивать и сжимать размеры, с помощью ползунков. Если что-то вдруг где-то съехало, запишите себе разрешение экрана, где дизайн поломался, чтобы потом починить.
Тестирование производительности
Вид сайта – это ещё не всё. Нужно, чтобы всё ещё и загружалось быстро. Вы не сможете исправить медленный интернет, но с медленным сайтом разобраться придётся. Здесь, опять же, есть множество простых инструментов. В том числе, PageSpeed Insights от Google. Быстрый аудит сайта покажет вам, что его замедляет и потенциально отпугивает посетителей.
Подытожим
Мобильная или хорошо адаптированная версия сайта – это даже не половина успеха, а больше. Если посетителю не нравится сайт, он не купит товар. До него пользователь даже не дойдёт. Нет позитивного опыта – нет клиента – нет денег. Предлагаем вам другую цепочку: хороший сайт – хорошая посещаемость – хорошая конверсия – хорошая прибыль. Мы даже готовы помочь вам выстроить эту цепочку. Обращайтесь!
Смотрите также:
Тест: оценка эффективности главной страницы сайта
Как нарастить трафик на сайт и увеличить окупаемость
Эстетика и юзабилити сайта: психологические принципы