Как правильно просматривать сайт на разных разрешениях экрана?

Question

[Алексей Дмитриев]

В общем дело такое. Мне нужно адаптировать сайт для разных разрешений экрана. При просмотре через инспектор там все съезжает, а после обновления страницы все нормально. Что из этого истина? Иногда и обновление страницы не помогает, а только новое открытие по ссылке. После открытия по ссылке опять же все нормально. Не понимаю на что мне ориентироваться. Может есть какой-то более надежный способ проверить сайт на разных разрешениях экрана? Заранее спасибо за ответы.

Comments

[Максим]

самое правильное - наверно иметь кучу разных девайсов и мониторов ...и тэстировать на сервере - подключаетесь и смотрите

щас тут напишут что есть специальные эмуляторы которые платные и в итоге сумма в год обойдётся как раз в стоимость этих девайсов

[zorca]

Браузера за глаза для тестирования на всех устройствах, кроме яблочных.

Answer 1

[Вова Дружаев]

Если у тебя на стороне php стоит добавление каких либо классов или wp_is_mobile (о ужас) прикручен - то обновление страницы будет влиять... Но так никто в здравом уме не делает.

Медиазапросы css и флексовая минимум или верстка гридами позволяет вообще к минимум медиазапросы свести. И грамотная вёрстка сразу почти адаптивная будет.

Теперь про яблокофоны - у них проблемы как правило с менюшками - то не открываются они... Ну в общем если на одном яблокофоне все отрабатывает верно (не старей 2х лет) - то и все остальные яблочные гаджеты тоже будет норм.

А так всё верно - если надо железно убедиться что в устройствах все норм - есть сервис - там у них работают множество реальных устройств и с ними надежность теста высокая.

Я за ctrl + shift + m - эта проверка покрывает большинство задач.

Comments

[Орхан Гасанлы]

Да, у яблочников то проблемы с меню, то с momentum scroll)))

Answer 2

[Арсений Матыцин]

1. Дебаггер браузера наше все. Если у тебя ломается верстка при его использовании → ты напортачил, переделывай.
2. Как верно подметили, яблоко это та еще жопоболь, притом iPhone-ы имеют более менее адекватную сборку Webkit-а, в отличие от iOS-овского. Но если с мобилкой вполне может хватить автопрефиксора за глаза и за уши, то для тестирования iOS тебе поможет виртуальная машина. Ставь Hackintosh и не отсвечивай.
2.1. Проблема браузера на iOS также в том, что ты не знаешь, какой именно вьюпорт будет у открывшегося браузера, поэтому классические медиазапросы идут лесом и мы возвращаемся к пункту 1 с добавлением того, что стоит отслеживать, что происходит в межбрейкпонтном состоянии.

И всякие сервисы есть, которые позволяют это автоматизировать. Лично я никогда не пользовал, ибо зачем.
И, опять же не пробовал, но поговаривают можно собрать свой нулевой Webkit браузер, который будет близок к тому, что происходит на iOS.