Как проверить отображение сайта на разных устройствах

Одно из главных требований к веб-разработчику — Responsive Web Design — что значит сайт должен отображаться красиво и хорошо на абсолютно всех устройствах: айпадах, мобильных телефонах, телевизорах, и даже на холодильнике, если у него уже есть такая функция.

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

А для тех случаев, когда требуется проверить отображение сайта для какого-либо конкретного популярного устройства, то можно использовать браузеры Google Chrome или Firefox, где есть возможность выбрать самые известные форматы или добавить собственные, перевернуть устройство и посмотреть отображение.

В Google Chrome:

Заходим в браузере Google Chrome на страницу с сайтом, которую надо проверить. Нажимаем правой кнопкой мыши по странице.

Во всплывающем меню выбираем Inspect.

В правой секции выбираем картинку с устройствами: там, где курсор наведен на картинке.

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

В Firefox:

Заходим в браузере Firefox на страницу с сайтом, которую надо проверить. Нажимаем правой кнопкой мыши по странице. Выбираем Enspect Element. Внизу открывается меню, где выбираем соответствующий Responsive Design Mode.

И можно играть в удовольствие.