Веб-разработка, логотип Eqsash

Верстка HTML - как проверить сайт на разных разрешениях экрана, где взять мобильный эмулятор

В настоящее время сайт может открываться на самых разных устройствах с самыми разными разрешениями экрана. Для тестирования страниц сайта на разных разрешениях следует использовать специальный инструментарий, предоставляемый разработчиками браузеров.

Самый простой способ проверить сайт на другом разрешении экрана – это не смена самого разрешения на ПК, а изменение масштаба в браузере. Уменьшение масштаба соответствует увеличению разрешения, увеличение масштаба – уменьшению разрешения. Таким способом можно легко посмотреть, как выглядят различные элементы и при необходимости внести изменения.

Более продвинутый способ – использовать специальный инструментарий. Раньше такие средства поставлялись отдельно - в виде расширений для браузеров (например, Firebug), сейчас же такой функционал обычно встраивается в браузеры. В этот функционал входит также и мобильный эмулятор для сайта или эмулятор различных разрешений экранов.

site-emulator-screen-resolutions

Для использования данных возможностей достаточно открыть консоль разработчика в браузере. Это можно сделать при помощи специального пункта меню браузера или использовав горячие клавиши, которые могут отличаться для разных браузеров. После открытия консоли необходимо переключиться в специальный режим – режим просмотра на различных устройствах, обычно кнопка для включения данного режима находится вверху консоли и помечена значком мобильных устройств. Также можно использовать и сочетание клавиш.

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

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

Обычно эмулятор содержит следующие типы устройств и разрешения:

Данная статья показала, что для разработки адаптивной версии сайта достаточно использовать современные браузеры с их консолями разработчиков, которые содержат необходимый инструментарий для проверки сайта на разных разрешениях экрана.

Оставить заявку

Последние статьи

Популярные разделы