littleguga
@littleguga
Не стыдно не знать, а стыдно не интересоваться.

Как тестировать верстку под разные браузеры и экраны?

Работаю за ноутбуком с довольно небольшим размером экрана с win7, виртуальные машины не потянет.

Как тестировать верстку под разные размеры экрана и браузеры?
Как Вы это делаете(например задача IE9+ и прочие популярные браузеры, а также andoid/ios) - просматриваете в каждом браузере?

Заранее благодарен за информативный ответ!
  • Вопрос задан
  • 20268 просмотров
Решения вопроса 3
lega111
@lega111
DevOps
Под мобильные устройства тестирую с помощью стандартных функций браузера (Firefox & Chrome это умеет в devtools)
Так же есть такая штука - ami.responsivedesign.is
Доступные размеры:
настольный монитор — 1600 x 992px;
ноутбук — 1280 x 802px;
планшет — 768 x 1024px;
мобильный телефон — 320 x 480px.

Так же есть это - deviceponsive.com
Устройства и доступные разрешения экранов.
Macbook — 1280 x 800
iPad портрет — 768 x 1024
iPad портрет — 1024 x 768
Kindle портрет — 600 x 1024
Kindle альбомная ориентация — 1024 x 600
iPhone портрет — 320 x 480
iPhone альбомная ориентация — 480 x 320
Galaxy портрет — 240 x 320
Galaxy альбомная ориентация — 320 x 240

Ну и мой любимый - quirktools.com/screenfly
Доступно 9 больше чем планшет устройств — от 10" ноутбуков, до 24" мониторов, 5 планшетов, 9 телефонов, 3 телевизионных разрешения, а также произвольное разрешение. Есть отдельный переключатель в портретный и альбомный режим, а также опция показа прокрутки.
Ответ написан
Apathetic
@Apathetic
Frontend
1) Эмуляция мобильных устройств в devtools в хроме и firefox
2) Эмуляция старых IE в Edge
3) https://www.browserstack.com/

Ну и регулярно вручную смотреть, где есть возможность, да.
Ответ написан
@azShoo
По девайсам - sauceLabs. Насколько я знаю, они одни из немногих, кто дает живые девайсы, а не эмуляторы.
В остальных случаях - готовьтесь к серьезным погрешностям.

По браузерам - оптимальное решение это виртуалки, нет - browserstack и альтернативы (или упомянутый уже сауслабс).
Использовать девтулс и эмуляторы предыдущих версий (например для IE, как выше советовали) - только для "очень грубой" проверки. Точных результатов там не ждите.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 4
@sarathorn
php программист, веб-дизайнер, коллекционер
Проверяю вручную. На компе установлены все современные браузеры. iOS проверяю через iPad Mini брата, Android - прошу друзей глянуть :) Windows Phone - своя Люмия 1020. IE7,8,9 не поддерживаю. Но если понадобится - поставлю виртуальную машину и буду там проверять.
Ответ написан
Комментировать
@Alexk91
У Opera есть удобная штука Opera Mobile Classic Emulator
Мобильные браузеры смотрю через него. Остальное руками.
Ответ написан
Комментировать
S-ed
@S-ed
Комбайнёр
mobitest.akamai.com/m/index.cgi
Может быть полезен, выдаёт скрины реальных устройств и не требует регистрации.
Был еще один похожий сайт (без регистрации), с дизайном в духе Win98, но увы линк утерян и второй раз я найти его не могу. -_-
Ответ написан
Комментировать
Адаптивность проверяю через devtools (там, как правило, есть такая возможность, вне зависимости от браузера), а если требуется проверить на iphone, mac или любой девайс, выходящий за рамки эмулирования, пользуюсь Browserstack. Они дают 30 минут тестирования на живых устройствах с настоящими браузерами и ОС (хватает на 10-15 проверок), далее платно, но чтобы не платить, просто регистрируйте аккаунт на фиктивную почту (10minutesmail и подобные сервисы).

Выбор девайсов очень велик, вплоть до версий операционной системы.
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
30 нояб. 2022, в 00:04
1000 руб./за проект
29 нояб. 2022, в 23:48
300 руб./за проект
29 нояб. 2022, в 22:19
1000 руб./за проект