Проверка мобильной версии сайта
Откроем главную вашего сайта в настоящем браузере на телефоне и на компьютере, снимем скриншоты и измерим, что мешает человеку с телефона: страница ездит вбок, кнопки мелкие, меню уходит за край, плашки закрывают экран. Около 5 минут, бесплатно, регистрация без карты.
Что проверяем на телефоне
Скриншоты на телефоне и компьютере
Главная целиком, в рамке устройства. Вёрстку по скриншотам смотрит отдельная проверка: наезды блоков, обрезанный текст, вылезшие за край картинки. Каждое замечание перепроверяется по увеличенному фрагменту.
Страница шире экрана
Если блок вылезает за край, страница ездит пальцем вбок, а часть текста не видна. Меряем, сдвигается ли страница на самом деле, — карусель с прокруткой внутри себя ошибкой не считаем.
Запрет увеличения
Сайт запрещает растянуть страницу двумя пальцами — мелкий текст и цены не прочитать. Видно по настройке viewport в коде страницы.
Мелкие кнопки и ссылки
Кнопки и значки меньше 24 px, рядом с которыми легко промахнуться пальцем, — по правилу доступности WCAG 2.5.8. Ссылки внутри текста не считаем.
Меню на телефоне
Открываем бургер на экране iPhone и смотрим, все ли пункты видны. Бывает, что часть разделов уехала за нижний край и до неё не долистать.
Плашки на пол-экрана
Закреплённые баннеры, предложение скачать приложение и окна, которые занимают четверть первого экрана и больше. Одну плашку cookie ошибкой не считаем: её закрывают одним нажатием.
Кнопка заявки на первом экране
Видно ли с телефона, как записаться, заказать или позвонить, без прокрутки. Если на первом экране только номер телефона без кнопки — тоже скажем.
Формы и маска телефона
Вводим номер с 8 и с +7, как это делают люди, и смотрим, не портит ли его маска поля. Формы не отправляем.
Отчёт делит замечания на три группы: «Мешает клиентам», «Стоит поправить» и «Мелочи». У каждого — скриншот, объяснение простыми словами и раздел для разработчика с тем, где именно ошибка.
Как проверить мобильную версию самому
Chrome на компьютере
Откройте сайт, нажмите F12 (на Mac — Cmd+Option+I), затем значок телефона слева вверху панели или Ctrl+Shift+M. Выберите iPhone или Galaxy и пролистайте главную. Так видно вёрстку, но не всё: шрифты и панели браузера на настоящем телефоне другие.
Свой телефон
Откройте главную в Safari или Chrome на телефоне, не залогиненным. Попробуйте растянуть страницу двумя пальцами, сдвинуть её вбок, открыть меню и дойти до кнопки заявки одной рукой.
Увеличение текста
Включите в настройках телефона крупный шрифт и откройте сайт снова. Так сайт видят все, у кого в телефоне включён крупный шрифт: проверьте, не наезжает ли текст и не пропадают ли кнопки.
Главная в порядке. А дальше?
Полный аудит открывает остальные страницы и проходит сайт с компьютера и телефона, как клиент: от главной до заявки, записи или корзины. В отчёте — где он застрял, со скриншотами и тем, что исправить. 990 ₽ за проверку.
Вопросы
- Это бесплатно?
- Да. Проверка главной бесплатна для 3 разных сайтов на аккаунт, регистрация — по почте или через Яндекс ID, без карты. Один и тот же сайт проверяем не чаще раза в 30 дней: если его недавно проверяли, откроем свежий отчёт.
- Почему нужна регистрация?
- Проверка идёт в настоящем браузере около 5 минут. Отчёт сохраняется в кабинете, и мы пришлём ссылку на почту, когда он будет готов: ждать на странице не нужно.
- Чем это лучше режима телефона в Chrome?
- Режим телефона показывает вёрстку, а проверку делаете вы сами. Мы открываем страницу на компьютере и телефоне и меряем кодом: сдвигается ли страница вбок, какие кнопки меньше 24 px, все ли пункты меню видны, что закрывает первый экран. Вёрстку по скриншотам смотрит отдельная проверка, и каждое замечание она перепроверяет.
- Проверяются все страницы сайта?
- Нет, только главная. Полный аудит за 990 ₽ открывает остальные страницы и проходит сайт как клиент — до заявки или корзины, на компьютере и телефоне.
- Что ещё будет в отчёте?
- Кроме телефона — те же замеры на компьютере, тексты главной (опечатки, непонятные фразы), скорость открытия, тяжёлые картинки и ролики, согласия в формах и cookie по 152-ФЗ. Отчёт написан для владельца сайта, технические детали — в разделе для разработчика.