Тег viewport не указан: как исправить meta viewport (и на Тильде)
Что это значит
В коде главной нет короткой служебной строки (meta viewport), которая говорит телефону «показывай страницу под ширину экрана», или в ней вместо ширины экрана указано число, например width=1200.
- Строки meta viewport нет. Телефон считает, что страница сделана для компьютера, и показывает её уменьшенной.
- Ширина задана числом (width=1200 и т. п.). Строка есть, но говорит телефону «страница шириной 1200 пикселей». Результат тот же: уменьшенная копия, мелкий текст. Нужно заменить число на width=device-width.
Чем мешает
На телефоне сайт выглядит как уменьшенная копия компьютерной версии, и всё приходится увеличивать пальцами. Посетители уходят, а поисковики хуже ранжируют неудобные на телефоне сайты.
Если сайт на Тильде
- Тильда сама добавляет строку meta viewport на опубликованные страницы. Если Яндекс Вебмастер пишет «тег viewport не указан», чаще всего дело не в Тильде, а в одном из случаев ниже.
- Страница не опубликована или робот видел её старую версию. Опубликуйте страницу заново и откройте её код (Ctrl+U): найдите
name="viewport". - Свой код в head. Если в настройках сайта или страницы вставлен свой HTML-код для head, проверьте, нет ли там второй строки viewport с числом вместо
width=device-width. - Сайт выгружен с Тильды на свой хостинг (экспорт). Тогда строку нужно проверить в выгруженных файлах — это уже задача того, кто ведёт хостинг.
- Если строка в коде есть, а замечание осталось, подождите, пока робот обойдёт страницу заново, и проверьте сайт снова на yasnoseo.by. Если строки нет на опубликованной странице, напишите в поддержку Тильды.
Как исправить
WordPress
- Почти все современные темы добавляют эту строку сами. Если её нет, тема устарела: стоит перейти на адаптивную тему (Astra, GeneratePress, Kadence и т. п.).
- Временно строку можно добавить плагином для вставки кода в
<head>, например WPCode (раздел «Header»).
Tilda
- Tilda добавляет строку сама. Если её нет, проверьте, не вставлен ли в настройках сайта свой код в head, который мешает, и напишите в поддержку Tilda.
1С-Битрикс
- Строка добавляется в шаблон сайта (файл
header.phpшаблона). Это задача для разработчика.
OpenCart
- Строка добавляется в шаблон темы (
header.twigилиheader.tpl). Если тема старая и не адаптивная, её стоит сменить.
Другой движок или свой сервер
- Добавьте строку в
<head>всех страниц (код ниже) и проверьте вёрстку на телефоне.
Пример кода
Замените example.by на адрес своего сайта.
<meta name="viewport" content="width=device-width, initial-scale=1">Сама строка добавляется за минуту, но если сайт не адаптивный, после неё он может «поехать». Тогда нужна новая вёрстка.
Если сайт делал подрядчик
Перешлите ему ссылку на отчёт и эту просьбу:
Поставьте, пожалуйста, в<head>всех страниц строку<meta name="viewport" content="width=device-width, initial-scale=1">вместо текущей и проверьте адаптивность вёрстки.
Как проверить, что всё исправлено
Проверьте сайт снова на yasnoseo.by.