Сайт на телефоне: 9 проверок мобильной версии за 10 минут

У большинства сайтов малого бизнеса больше половины посетителей приходят с телефона, а у кафе, салонов и служб доставки — и все три четверти. Посмотреть точную долю можно в Яндекс Метрике, в отчёте «Устройства». При этом сам сайт владельцы чаще всего делают и проверяют на компьютере.

Возьмите телефон, откройте свой сайт так, как его открыл бы клиент, и пройдитесь по девяти пунктам. Это займёт минут десять.

1. Понятно ли с первого экрана

Первое, что видно без прокрутки на телефоне: что вы делаете и где, и одна кнопка. На телефоне первый экран в два-три раза меньше, чем на компьютере, поэтому большой баннер может занять его целиком, и человек увидит только картинку. Проверьте, что заголовок помещается без прокрутки.

2. Текст читается без увеличения

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

3. Кнопки удобно нажимать пальцем

Кнопки и ссылки должны быть достаточно крупными, чтобы попасть пальцем с первого раза, и не стоять вплотную друг к другу. Хороший ориентир — кнопка размером с подушечку большого пальца.

4. Телефон звонит по нажатию

Нажмите на номер телефона. Должен открыться набор номера. Если ничего не происходит, номер вставлен просто текстом или картинкой. Это одна из самых частых и самых дорогих ошибок: человек не будет переписывать номер вручную.

То же с мессенджерами: кнопка должна сразу открывать чат.

5. Форма заполняется легко

Заполните форму заявки с телефона. Поля должны быть крупными, при вводе телефона должна появляться цифровая клавиатура, а после отправки — понятный ответ. Чем меньше полей, тем лучше: на телефоне каждое лишнее поле теряет заявки.

6. Ничего не вылезает за край

Проведите пальцем по странице влево и вправо. Страница не должна сдвигаться вбок. Если сдвигается, какой-то блок шире экрана: широкая таблица, картинка, длинное слово или ссылка. Поверните телефон горизонтально и проверьте ещё раз.

7. Всплывающие окна не закрывают всё

Окна «Подпишитесь», «Получите скидку», чаты, баннеры про файлы cookie на телефоне могут закрыть почти весь экран. Если окно появляется сразу и его трудно закрыть, человек просто уходит. Поисковики тоже не любят страницы, где главное закрыто навязчивым окном.

8. Страница открывается быстро

Откройте сайт на мобильном интернете, а не по Wi-Fi. Если главная грузится дольше трёх-четырёх секунд, начните с фото: обычно виноваты они. Подробнее в статье «PageSpeed простыми словами».

9. Меню находится и работает

Откройте меню, перейдите на пару страниц и вернитесь. Важные разделы — услуги, цены, контакты — должны находиться за одно-два нажатия.

Как поправить на A5

На A5 мобильная версия собирается автоматически из версии для компьютера. На платных тарифах её можно поправить отдельно: в редакторе переключиться на вид телефона и передвинуть или изменить блоки, версия для компьютера при этом не меняется. Подробнее в справке «Мобильная версия сайта».

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