Как легко проверить сайт на адаптивность в браузере Google Chrome


Сегодня уже нет нужды убеждать кого-либо в необходимости мобильной версии сайта. Ведь с каждым днем посетителей со смартфонов и планшетов становится все больше и больше. На момент написания этой статьи около 20% посетителей моего блога используют мобильные устройства для просмотра. То есть каждый пятый заходит на мой сайт с телефона или планшета.

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

А как же проверить адаптивный ваш сайт или нет? В браузере Google Chrome есть встроенная функция проверки сайтов на адаптивность. Для её включения нажмите F12, находясь на сайте. Вы увидите похожую картину:

Проверка адаптивности сайта в Google Chrome

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

Для выхода из режима просмотра адаптивности, нажмите F12

В браузере Firefox, аналогично, только нажимайте Ctrl + Shift + M


Комментарии (0)


Добавить комментарий:





Разрешённые теги: <b><i><br>Добавить новый комментарий:


Последние комментарии:


Любые предложения интернет-ресурса не являются публичной офертой.