# Мобильная версия сайта: что проверить

Обновлено 29 октября 2026 г. · 3 мин чтения · Студия AETHER · https://aether-studio.ru/blog/mobilnaya-versiya-sajta

Большая часть посетителей открывает сайты с телефона, и судят о компании по тому, что видят на маленьком экране. Сайт, который отлично выглядит на мониторе, на телефоне может превращаться в мелкий текст и кнопки, по которым невозможно попасть. Разбираем, какой должна быть мобильная версия и как её проверить самому.

## Отдельный сайт или адаптивный

Раньше для телефонов делали отдельный сайт на поддомене вроде `m.site.ru`. Сейчас почти всегда делают один сайт, который подстраивается под ширину экрана: на компьютере блоки стоят в несколько колонок, на телефоне — друг под другом. Такой сайт проще обновлять — правка делается один раз, а поисковики видят одну версию страницы.

Но «подстраивается» не значит «сжимается». Хорошая мобильная версия продумана отдельно: что показать первым, что убрать, где поставить кнопку.

## Какие экраны учитывать

Ширина большинства телефонов — от 360 до 430 точек, планшетов — от 768. Проверять стоит хотя бы три размера: небольшой телефон, большой телефон и планшет. Дизайн для телефона рисуют на ширине около 375–390 точек, и вёрстка должна корректно работать на всём диапазоне, а не только на одном образцовом размере.

## Что проверить

- **Текст** — основной не меньше 16 пикселей, читается без увеличения.
- **Кнопки** — не меньше 44 пикселей в высоту, с отступами, чтобы не промахнуться пальцем.
- **Нет горизонтальной прокрутки** — страница не «уезжает» вбок, таблицы и картинки помещаются в экран.
- **Меню** — понятная кнопка меню, пункты крупные, меню закрывается.
- **Телефон нажимается** и сразу открывает звонок, адрес — открывает карту.
- **Формы** — у поля телефона цифровая клавиатура, у поля почты — с «@», подписи полей видны.
- **Главная кнопка под рукой** — для магазинов и записи её часто закрепляют внизу экрана.
- **Всплывающие окна** закрываются, а не перекрывают весь экран без крестика.
- **Скорость** — мобильный интернет медленнее домашнего, тяжёлые картинки и видео особенно заметны. Как проверить, разобрано в статье [«Скорость загрузки сайта»](https://aether-studio.ru/blog/skorost-zagruzki-sajta).

## Как посмотреть мобильную версию на компьютере

В Chrome, Яндекс Браузере и Edge откройте инструменты разработчика клавишей F12 и включите режим устройства: Ctrl+Shift+M на Windows или Cmd+Shift+M на Mac. Сверху можно выбрать модель телефона или задать ширину вручную.

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

## Проверка на настоящих телефонах

- Откройте сайт со своего телефона через мобильный интернет, а не по Wi-Fi.
- Попросите посмотреть знакомых с другими телефонами: iPhone и Android отображают сайты по-разному.
- Пройдите путь клиента целиком: найти услугу, узнать цену, оставить заявку. Если где-то пришлось увеличивать текст или целиться в кнопку — это место нужно исправить.

## Мобильная версия и поиск

Google оценивает сайты в первую очередь по их мобильной версии, а неудобная мобильная версия ухудшает поведение посетителей — они уходят быстрее, и поисковики это видят. Поэтому мобильная версия — не дополнение к сайту, а его главная версия.

## Как это делаем мы

Версию для телефона мы проектируем отдельным сценарием, а не сжатой копией компьютерной: показываем макеты для обеих версий и правим до начала вёрстки. Перед запуском проверяем сайт в основных браузерах и на мобильных устройствах — это прописано в нашей [оферте](https://aether-studio.ru/offer).

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

**Услуга «Редизайн сайта»:** от 7 рабочих дней, от 35 000 ₽, обычно 35 000–110 000 ₽. Подробнее: https://aether-studio.ru/services/redesign

**Обсудим ваш сайт.** Ответим в течение рабочего дня, зададим несколько вопросов и назовём вилку по сроку и бюджету. Бесплатно и без обязательств. Написать: [Telegram @aether_agency](https://t.me/aether_agency), почта aether-studio@mail.ru, форма — https://aether-studio.ru/#contact.