Как настроить meta viewport для корректного отображения сайта?
Чтобы сайт правильно масштабировался на мобильных устройствах, нужно добавить тег <meta name=»viewport»> в секцию head HTML-документа. Правильный код выглядит так: <meta name="viewport" content="width=device-width, initial-scale=1.0">.
Почему это важно? Без настройки viewport страницы могут отображаться некорректно, растягиваясь или сжимаясь до неудобных размеров, что ухудшает пользовательский опыт.
Практическое уточнение: обязательно проверьте, чтобы теги meta viewport были прописаны во всех страницах вашего сайта, особенно в шаблонах и макетах главной страницы.
Мини-чек-лист:
- Убедитесь, что тег meta viewport присутствует;
- Проверьте значение width (оно должно быть равно device-width);
- Установите начальный масштаб (initial-scale) равным 1.0.