Как настроить тег meta name="viewport"

Как настроить тег meta name=

Что такое meta name viewport

Viewport это площадь страницы сайта, которая будет видима для пользователя без скроллинга. На адаптированных сайтах, страницы легко просматривать с любого устройства без горизонтального скролла, вне зависимости от параметров экрана. На таких сайтах пользователь легко может читать текст, скроллить контент, просматривать картинки, заполнять формы и делать покупки.

Типичный сайт, оптимизированный для мобильных устройств, включает мета тег viewport с таким содержанием:

<meta name="viewport" content="width=device-width, initial-scale=1">

Параметр width устанавливает размер окна просмотра. Этот параметр может быть прописан, как определенное количество пикселей, или в виде специального значения device-width, что означает ширину экрана в пикселях CSS в масштабе 100%.

Параметр initial-scale фиксирует уровень масштабирования при первой загрузке URL. Параметры maximum-scale, minimum-scale и user-scalable устанавливают как пользователи могут увеличивать или уменьшать страницу во время просмотра.

Отказ от использования meta name=”viewport”

Бразуер использует инструкции, указанные в теге viewport для масштабирования страницы сайта. Если этот тег не использовать, браузер будет показывать пользователю страницу в стандартном размере (так как она выглядит на десктопе) и попробует оптимизировать отображение контента путем увеличения шрифтов и отдельных элементов. Так, пользователь увидит только тот контент, что поместился на экране мобильного устройства или планшета, и ему придется руками его масштабировать или использовать горизонтальный скролл для просмотра всего содержания страницы.

Протестируйте больше крутых SEO инструментов!
Инструмент для проверки трафика Оценивайте статистику посещаемости сайта по разным каналам и за разные периоды.
Ранк Чекер Получите отчет с ключевыми словами, которые приносят веб-сайту большую часть органического трафика.
Тест скорости Протестируйте конкретную страницу на скорость и получите предложения по ее улучшению.
Инструмент проверки обратных ссылок Наш бесплатный инструмент проверки обратных ссылок поможет вам отслеживать ссылки на ваш сайт.
Инструмент проверки безопасность веб-сайта Убедитесь, что веб-сайт безопасен и не внесен в список подозрительных.
Инструмент поиска похожих сайтов Бесплатные инструменты, позволяющие пользователям получать информацию о похожих сайтах за несколько секунд.
Все инструменты

Check your website SEO performance

Get a personalized checklist on how to improve your website to rank higher on Google

No limits! Upgrade your account to crawl this domain