Адаптация под телефон (viewport)
пошаговая инструкция · Быстро: 5–15 минут
1. Что произошло
Без настройки мобильного вида страница на телефоне выглядит уменьшенным компьютерным сайтом.
2. Почему это важно
Поисковик ранжирует сайты для телефонов по мобильной версии; неудобный сайт теряет позиции. После исправления: Сайт станет удобен на телефонах, улучшатся позиции в мобильном поиске.
3. На каких страницах обнаружено
Тег meta name="viewport" в head главной страницы.
Чтобы увидеть адреса на вашем сайте, откройте инструкцию из отчёта или добавьте домен в адрес: /fix/viewport/ваш-сайт.ru.
4. Как исправить
Для phpBB
- В prosilver тег есть; в других стилях добавьте в overall_header.html.
Общее для любого сайта
- Добавьте в head тег viewport — без него телефон показывает страницу как уменьшенную копию версии для компьютера.
- Проверьте сайт в режиме мобильного устройства в Chrome (F12 → иконка телефона): текст читается без увеличения, нет горизонтальной прокрутки, кнопки не меньше 44 px.
- Если вёрстка не адаптивная, нужна новая тема или доработка CSS (media queries).
5. Готовый код
Замените example.com на свой домен. Перед правкой конфигурации сделайте резервную копию файла.
Любой сайт
Тег в head
<meta name="viewport" content="width=device-width, initial-scale=1">6. Как проверить результат
- Тег виден, а в мобильном режиме браузера нет горизонтальной прокрутки.
- Нажмите «Перепроверить сайт».
Тег
curl -s https://example.com/ | grep -io '<meta[^>]*viewport[^>]*>'Чтобы перепроверить сайт, откройте отчёт и нажмите «Проверить заново».