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

Кто чем пользуется для проверки верстки и корректного отображения сайта?
Подобные сайты:
quirktools.com/screenfly
deviceponsive.com
responsivetest.net
Не дают полной картины и не всегда корректно отображают.
  • Вопрос задан
  • 10183 просмотра
Решения вопроса 1
@azShoo
Вариантов довольно много, на самом деле.
Тут нужен ряд уточняющий вопросов:
1) Вам нужно проверять _регулярно_ или единоразово (сдаешь проект - проверил - забыл)?
2) Какие браузеры и разрешения вам реально нужны? Тут надо определить две вещи:
Под какие браузеры вы разрабатываете, и готовы обеспечивать поддержку, и нужно ли это вашим пользователям? Первое определяется исходя из ваших ресурсов, второе - исходя из статистики посещений сайта и прочего.
Поддерживать "ВСЕ БРАУЗЕРЫ" и "ВСЕ РАЗРЕШЕНИЯ!!" - бессмысленный кейс. Вы потратите много времени на поддержку древних браузеров и разрешений, существующих на двух нетбуках в мире, но не получите ничего.
3) Сколько вы готовы тратить времени, сил и денег на подобные тесты?
4) Какая "погрешность" в результатах тестирования вас устроит?

Вариант 1) Виртуалки. Много разных, с разными версиями браузеров, осей и пр.
Разрешения экранов там отлично настраиваются, масштабируется все соответственно.
Плюсы:
- Высокая вероятность воспроизведения багов с реальных устройств.
- Кастомизируемость - все, что нужно сделать, это развернуть N виртуалок, и накачать на них нужные вам версии браузеров.
Минусы:
- Миллиард виртуалок, которые надо создать и актуализировать.
Вариант 2) Специализированные сервисы. Упомянутый выше BrowserStack и прочее.
Аналогичные сервисы есть и для мобильных и MacOS устройств отдельно.
Плюсы:
- Простота - купил, открыл, проверил.
Минусы:
- Низкое соответствие. Часто вместо реальных старых версий используются "эмуляторы" старых версий, которые выдают ложные результаты.
- Далеко не везде можно прописать хосты и прочие радости для доступа к "внутренним" стендам.

Ну, и отдельно стоит упомянуть, что если смотрите сервис для тестирования на мобилках и MacOS - ищите те сервисы, которые предоставляют доступ к "железным" машинам, а не эмуляторам.
Эмуляторы - плохой вариант.

Вариант 3) Собственный "зоопарк" устройств.
Особенно актуально для мобильных устройств. В большинстве случаев проще завести свой парк устройств, к которым настроить доступ "из вне". Для этого, тоже, кстати, есть готовые решения.
Плюсы:
- Реальное железо = реальная работа этого железа, а не псевдосрабатывания эмуляторов.
- Кастомизируемость - только то, что нужно, и настроенное так, как надо.
Минусы:
- Дорого.
- Необходимо постоянно пополнять "коллекцию" устройств.

Ну, или отдать на откуп индийским аутсорсерам.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 4
@slavik_210
Сходить в ближайший магазин техники и там протестировать. Я так всегда делаю. Консультанты никогда не будут против.
Ответ написан
Комментировать
@pocteg
lahno, привет!

Хром имеет средство для тестирования сайтов для мобильных устройств. Это можно активировать в консоли хрома.a8813d84e5d845d787eda31a42f87810.png
Ответ написан
baskerville42
@baskerville42
Учусь работать (Junior)
www.browserstack.com - платно, но круто
https://modern.ie/ru-ru - бесплатные виртуальные машины от макрософаков.
А вообще-то для проверки на разных разрешениях экранов (подходит только для ПК) можно банально сжать окно браузера до нужных размеров.
Ответ написан
Комментировать
shcherbanich
@shcherbanich
Программист
Можно использовать виртуалку, поустанавливать разные браузеры туда и тестить)) Размеры можно тестировать изменением размера окна браузера)
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы