На компьютере сайт может выглядеть аккуратно, а на телефоне посетитель не найдёт меню, не нажмёт кнопку или бросит форму после первого поля. Поэтому вопрос «как проверить мобильную версию WordPress-сайта» лучше решать до запуска, а не после первой жалобы. Проверять нужно не отдельную картинку, а весь путь от входа на страницу до целевого действия.
Сначала разберитесь, что именно проверяется
При адаптивном отображении один сайт перестраивает блоки под ширину экрана. Отдельный адрес или второй набор страниц для этого не обязателен. Поэтому поиски специального плагина — расширения WordPress — могут не решить проблему: она бывает в теме, которая задаёт оформление страниц, в стилях, таблице или содержимом.
Откройте сайт на реальном смартфоне. Режим эмуляции в браузере имитирует экран телефона и помогает сравнить, как страница выглядит при разной ширине. На самом телефоне дополнительно проверьте клавиатуру, прокрутку, загрузку изображений и нажатия пальцем.
Проверьте путь посетителя с телефона
Выберите страницу, на которую должен прийти потенциальный клиент, и пройдите её как новый посетитель. Во время проверки смотрите, выполняются ли следующие условия:
- логотип и меню помещаются на экране, а открытый список разделов можно закрыть;
- заголовок и описание страницы видны без долгой прокрутки;
- на кнопку заявки удобно нажимать пальцем, её не перекрывают плавающие элементы;
- поля формы помещаются на экране, а клавиатура не закрывает заполняемое поле;
- изображения и таблицы не создают горизонтальную прокрутку;
- после отправки формы видно сообщение, из которого понятно, что делать дальше.
В интернет-магазине пройдите путь от карточки товара до оформления заказа: выберите вариацию (вариант товара), добавьте её в корзину и перейдите к заказу. Так станет видно, работают ли эти действия вместе на телефоне.
Почему одной ширины недостаточно
Проблема может появиться только на узком телефоне, в горизонтальном режиме или после открытия системной клавиатуры. Поэтому сравните хотя бы несколько распространённых размеров и прокрутите страницу сверху вниз. Особое внимание уделите длинным словам, адресам, ценам, кнопкам рядом друг с другом и блокам, которые появляются после нажатия.
Если первый экран долго остаётся пустым, посетитель может уйти до того, как увидит форму. На скорость влияют тема, плагины, скрипты — программы на странице — и настройки сервера. Важно и кеширование: сохранение копий данных для повторного использования. Прежде чем менять настройки, выясните, что именно замедляет страницу.
Что исправлять в теме, а что — в контенте
Если блоки в принципе не перестраиваются, заголовки перекрываются, а меню работает неверно, нужна техническая правка темы или шаблона. Когда проблема вызвана слишком длинным заголовком, неподходящим изображением или таблицей, достаточно изменить контент и его оформление.
Разделяйте эти случаи. Иначе редактор будет сокращать текст, пытаясь компенсировать ошибку в шаблоне, или разработчик начнёт переписывать тему из-за одного неудачного изображения. Для каждой проблемы запишите страницу, устройство, действие и то, что пользователь видит в результате. После правок повторите проверку на телефоне, в том числе в другом браузере и горизонтальной ориентации.