Softonic

Тестер для мобильных устройств

Шаг 1 / 2
Далее

Введите URL, тестер загрузит его в имитированное окно телефона (по умолчанию размером 375×812 пикселей, соответствующий размеру экрана iPhone), проверит типичные проблемы с читаемостью на мобильных устройствах, которые ранее выявлялись в собственном тесте Google Mobile-Friendly Test до его отмены, и вернёт список недостатков, которые можно устранить: отсутствие мета-тега viewport, текст размером менее 12 пикселей, цели для нажатия меньше 48×48 пикселей, горизонтальное прокручивание, использование Flash или несовместимых плагинов, а также контент шире размера окна.

Как выполняется тест

  1. 1

    Введите URL

    Полный URL с протоколом. Доступно только для публичных страниц.

  2. 2

    Страница отображается в окне размером с телефон

    По умолчанию размер 375×812; настраиваемый.

  3. 3

    Автоматические проверки выполняются.

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

  4. 4

    Предварительный просмотр и отчёт

    Скриншот отображаемого интерфейса телефона вместе с списком конкретных проблем.

Что проверяет тестер

Конфигурация видоотображателя

– Существует ли модель <meta name="viewport" content="width=device-width, initial-scale=1">? Без неё мобильные браузеры отображают экран так, как будто устройство имеет размеры настольного компьютера, и сжимают его для размещения текста, в результате чего он становится крайне мелким.

Размер текста

Весь отображаемый текст размером менее 12 пикселей выделяется, его сложно прочитать на телефоне без функции масштабирования пальцами. Многие руководства по стилю рекомендуют минимальный размер шрифта 16 пикселей. Краткие подзаголовки допустимы; однако текст основного содержания размером 11 пикселей не рекомендуется.

Размер цели для нажатия

Кнопки, ссылки и элементы управления формами должны иметь размер не менее 48×48 пикселей (согласно руководству Google и W3C по доступности для мобильных устройств). Меньшие цели трудно точно попасть пальцем большого; такие цели отмечаются специальным знаком.

Расстояние между целевыми точками

Цели, расположенные ближе чем на 8 пикселях к соседним целям, вызывают ошибочные нажатия; каждая такая цель отмечается отдельно.

Горизонтальное прокрутывание

Если содержимое превышает размер экрана, необходимо выполнить горизонтальное скольжение, это неблагоприятно для пользовательского опыта на мобильных устройствах. Обычно такое происходит из-за изображений без свойства max-width: 100% или таблиц, не способных к автоматическому переформатированию.

Не поддерживаемые плагины

Flash, Silverlight и ActiveX не работают на смартфонах; устаревшие сайты иногда всё ещё используют их.

Загрузка шрифта

Очень крупные веб-шрифты, которые на несколько секунд препятствуют отображению текста, обозначаются специальным знаком.

Почему это до сих пор важно

В декабре 2023 года Google прекратил проведение отдельного теста на поддержку мобильных устройств, однако уровень мобильной совместимости по-прежнему является прямым показателем ранжирования по данным Core Web Vitals и метрикам пользовательского опыта на страницах. Индексация с учетом мобильных устройств означает, что система сканирует ваш сайт в режиме работы с смартфоном: проблемы, обнаруженные на мобильных устройствах, также отражаются в результатах поиска на стационарных компьютерах.

Типичные исправления

– Добавьте метаинформацию о области отображения к файлам <head> и <meta name="viewport" content="width=device-width, initial-scale=1">. – Адаптивный CSS с использованием запросов на медиафакторы: @media (max-width: 768px) { ... }. – Flexbox и Grid вместо шаблонов с фиксированной шириной.

  • Установите изображение max-width: 100%; height: auto, чтобы оно сжималось вместе с полем зрения. – Убедитесь, что таблицы могут скроллироваться на малых экранах: используйте форматирование <div style="overflow-x: auto"> для их размещения.
  • Используйте rem или em для регулировки размера текста, чтобы обеспечить корректную масштабацию в соответствии с предпочтениями пользователя.

Что тестер не обнаруживает

– Производительность на реальном оборудовании: бюджетный смартфон с операционной системой Android в режиме 3G испытывает задержки, которые не воспроизводятся при тестировании. Для оценки производительности используйте инструмент Lighthouse. – Взаимодействие при касании: выпадающие списки, доступные только при наведении курсора и отображающиеся при касании, требуют ручного тестирования на реальном устройстве. – Доступность, выходящая за рамки параметров мобильных устройств: контрастный дизайн, поддержка программ чтения экрана и навигация с помощью клавиатуры, используйте специализированные инструменты для обеспечения доступности. – Ошибки JavaScript в браузерах, предназначенных для мобильных устройств. Браузер Safari на платформе iOS иногда ведёт себя иначе по сравнению с другими сборками WebKit.

Часто задаваемые вопросы

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

Да, с 2020 года Google использует подход «mobile-first» при индексировании, то есть версия сайта для мобильных устройств является основной для определения позиций в результатах поиска. Проблемы с адаптацией сайта на мобильные устройства негативно влияют на позиции даже при поиске на компьютере.

Нет. Тестер получает только URL, доступные для всех пользователей. Для защищённой стадии тестирования выполните тестирование локально в режиме эмуляции устройства Chrome DevTools.

По умолчанию размер экрана составляет 375×812 пикселей (для iPhone 12/13/14). Можно настроить его на 390×844 пикселя (iPhone 14 Pro), 360×640 пикселей (стандартные модели Android) или 412×915 пикселей (Pixel 7).

Как правило, время выполнения составляет от 5 до 15 секунд в зависимости от объёма страницы. На сложные страницы с большим количеством кода требуется больше времени: тестер ожидает завершения загрузки и короткого периода без активности перед началом сбора данных.

Сопутствующие инструменты

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

Измерьте мета-описание в символах и расчётных пикселях, сравните редакционные ориентиры и макеты для компьютера и телефона.

Инструмент проверки заголовков безопасности HTTP

Вставьте HTTP-заголовки ответа и локально проверьте HSTS, CSP, clickjacking, MIME, referrer и политики cross-origin.

Инструмент для извлечения внешних ссылок

Вставьте сырой HTML-код, при желании укажите базовый URL и получите чистый список без дубликатов всех внешних ссылок http/https в коде для проверки ссылок и анализа SEO.

Канонический генератор тегов

Создайте действительный тег ссылки rel=canonical для любого URL. Включает проверку URL и типичные ошибки, которых следует избегать.

Валидатор XML-карты сайта

Проверьте XML-карту сайта в браузере: ошибки разбора, отсутствующие адреса, повторы URL и распространённые значения полей.

Симулятор выдачи Google

Посмотрите приблизительный сниппет в стиле Google с лимитами символов для телефона и компьютера. Черновик остаётся в текущем сеансе браузера.

Инструмент доступен на других языках