7 инструментов для тестирования отзывчивого сайта 

7 инструментов для тестирования отзывчивого сайта 

Secret Design



Хороший дизайнер знает, что, как и какого размера нарисовать, чтобы картинка хорошо смотрелась на любых экранах. Но одно дело — теория, и совсем другое — практика. Поэтому необходимо тестировать сайт на разных устройствах. Или с помощью инструментов, представленных ниже. 


1. Responsinator 


Прелесть Responsinator в его простоте. Просто вводите адрес интересующего сайта и смотрите, как он выглядит на разных устройствах. Совершенно бесплатно. В эмуляторе устройств можно взаимодействовать со страницей: кликать, скролить и т.д. 


2. Screenfly 


Позволяет тестировать сайт на экранах разных устройств: телефонов, планшетов, мониторов и даже телевизоров. Бесплатно. Вводите URL, выбираете нужное устройство и смотрите результат. 


3. Google DevTools Device Mode 


Эмулятор устройств в Google Chrome. С его помощью можно смотреть, как сайт выглядит на разных устройствах, а еще имитировать сенсорное управление, менять ориентацию устройства и работать с геолокацией. 


4. Google Resizer 


Гайдлайн по Material Design предусматривает использование точек излома, отзывчивой сетки, моделей поведения пользователей. И чтобы посмотреть, соответствует ли ваш сайт этому документу, Google сделал сервис Google Resizer. 


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


5. Ghostlab 


Платное приложение Ghostlab позволяет тестировать сайты в симуляторах разных устройств и браузеров. Начните тестировать в одном браузере или девайсе, и ваши действия повторятся в симуляторах остальных устройств. Можно тестировать ссылки, кнопки, формы и перегрузки на одном устройстве, а результаты получить сразу со всех. 


Здесь же можно сделать запись экрана любого девайса, описать его и мышкой перетащить в баг-лист. 


6. Browser Stack 


Это платное приложение для тестирования, рассчитанное на большие компании. Один из самых продвинутых и навороченных инструментов. Дает доступ к 1000 мобильных и десктопных браузеров, список которых постоянно обновляется. Среди пользователей Browser Stack — Twitter, Microsoft, AirBnB и Mastercard. 


7. CrossBrowserTesting 


Позволяет тестировать сайт на огромном количестве реальных устройств. 


Этот инструмент — главный конкурент Browser Stack. CrossBrowserTesting предлагает протестировать сайт в 1500 браузерах и девайсах. Здесь также можно проводить автоматическое тестирование, сравнивать макеты и верстку, взаимодействовать с сайтами и удаленно дебажить код. 


Вывод: Даже если у вас нет кормушки для девайсов, это не повод не тестировать сайты на различных мобилках. Теперь у вас есть минимум 7 способов проделать это, используя всего одно устройство — компьютер. Вы сэкономили 10 минут.


источник: http://www.creativebloq.com/features/7-great-tools-for-testing-your-responsive-web-designs


Report Page