АДАПТИВНОСТЬ САЙТА
Сегодня у каждого пользователя сети есть широкий выбор как устройств для использования, так и браузеров для нетсёрфинга, поэтому вопрос адаптивности вёрстки стоит особенно остро. Если сайт отображается неудобно, не полностью, грузится слишком долго или в принципе ведёт себя неадекватно из-за плохо интегрированных элементов - пользоваться им будут только самые стойкие и верящие в силу контента, а не визуальной составляющей.
Осуществить проверку на адаптивность можно и "вручную", используя собственные устройства и ближайших знакомых, причём как мобильных гаджетов, так и компьютеров разной комплектации и форматов мониторов. Удобством такой метод не блещет, да и скоростью тоже. Кроме того, обновления устройств, операционных систем и браузеров приводят к тому, что вариантов как "эдаково" вёрстка может повести себя становится всё больше.
Более удобно и быстро проверить адаптивность сайта можно с помощью специальных инструментов и приложений, причём как в вопросе формата экрана и использованного устройства, так и кроссбраузерности.
Панель разработчика в браузере
Для демонстрации использую наш ForumD и свой Google Chrome.
Вызвать панель разработчика можно по сочетанию клавиш Ctrl+Shift+I или через три точки - дополнительные инструменты - инструменты разработчика. После - Ctrl+Shift+M или кнопочку в виде двух устройств слева в верхнем углу панели разработчика, чтобы открыть панель инструментов устройства.
Инструменты устройства позволяют выбрать некоторые распространённые гаджеты или вписать размеры мониторов для проверки внешнего вида сайта на экране. Там же можно перевернуть ориентацию страницы и увидеть как это будет выглядеть.
Инструменты Google и Яндекс
У Гугла есть специальное расширение для разработчиков Lighthouse, позволяющее работать с производительностью сайта. То же самое (и даже чуууть больше) предлагает Яндекс Вебмастер после регистрации сайта в их системе. Для продвинутого верстальщика эти инструменты подскажут где и какие проблемы в прогрузке странице фиксируются на том или ином устройстве и даже предложат (не всегда удачно и точно, но тем не менее) как их исправить.
Обрезанным аналогом Лайтхауса служит и гугловский сервис PageSpeed Insight в котором можно вбить ссылку на свой сайт и так же увидеть ошибки и рекомендации по их устранению во благо прогрузки своего детища. У Яндекса есть так же возможность проверить сайт, в т.ч. на кроссбраузерность (не очень быстрое решение, но всё-таки), через Яндекс Метрику.
Аналитики по внешнему виду тут будет меньше, данные ресурсы предназначены больше для работы непосредственно с быстродействием и весом страниц.
Другие сайты для проверки
http://adaptivator.ru/ - только отображение на разных типах устройств, бесплатно.
http://iloveadaptive.com/ - тоже самое, есть расширение для хрома.
https://saucelabs.com/ https://crossbrowsertesting.com/ http://browsershots.org/ - сайты для проверки кроссбраузерности, платные и с пробным периодом. Скорее всего не работают из РФ, но упомяну, т.к. сами по себе они рабочие. По крайней мере были.
https://testgrid.io/ - тоже проверка адаптивности в разных областях. В РФ работает. Требует регистрации, есть бесплатная версия с ограничениями.
https://www.browserstack.com/ - тоже самое. Ресурс отмечается разработчиками как один из наиболее популярных.
А какими способами вы проверяете адаптивность сайта? Через боевых и не очень товарищей или всё-таки пользуетесь какими-то ресурсами? Расскажите о своём опыте, что используете и как! Ваши ответы помогут и дополнить статью, и помочь разобраться в теме лучше.