deloren89
commented
7 years ago Browser dev tools
www.responsivedesigntest.net Хороший сервис для проверки сайтов. Есть множество разрешений экранов как планшетов так и телефонов.
mattkersley.com Простой сервис для проверки сайта на адаптивный дизайн от Matt Kersley. Так же доступны все популярные разрешения мобильных девайсов.
screenqueri.es Очень классный сервис, который проверит любой сайт. Очень понравилось оформление, а так же функциональность.
quirktools.com Очень красивый и функциональный сервис. Есть возможно даже проверить как будет выглядеть сайт на телевизоре :-)
http://ami.responsivedesign.is/ Am I Responsive, очень простой инструмент, позволяющий быстро просмотреть ваш сайт на 4 устройствах. Все они — IOS и разработчик объясняет это фишкой сайта. В общем никаких настроек, никакого выбора, а очень просто и наглядно. Доступные размеры: настольный монитор — 1600 x 992px; ноутбук — 1280 x 802px; планшет — 768 x 1024px; мобильный телефон — 320 x 480px.
http://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
http://quirktools.com/screenfly/ наиболее функциональный из всех. Доступно 9 больше чем планшет устройств — от 10" ноутбуков, до 24" мониторов, 5 планшетов, 9 телефонов, 3 телевизионных разрешения, а также произвольное разрешение. Добавьте сюда отдельный переключатель в портретный и альбомный режим, а также опцию показа прокрутки. Также можно поделится ссылкой на тест с помощью одной кнопки.
У каждого устройства в меню указано размер экрана в px., а также в правом верхнем углу отображается фактический размер вашего окна браузера.
Aдаптивный дизайн, какие есть техники есть для тестирования адаптивного дизайна.