Тестирование переносимости веб-страниц

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

Для многих браузеров не существует «легального» метода одновременной установки нескольких разных версий на одну машину. Обычно каждая новая инсталляция стремится автоматически затереть более старую. Но если поискать, можно найти специальные «комплекты» браузеров, ориентированные именно на тестирование верстки.

Например, пакет Multiple IE содержит в себе пять версий IE — от 3.0 до 6.0 (на том же сайте можно найти дистрибутив седьмой версии в standalone виде). После установки, 4 из 5 браузеров у меня действительно заработали (даже IE 3), что в какой-то степени удивительно — весь дистрибутив занимает всего 10 Мб.

Несколько сложнее обстоит дело с тестированием на других (отличных от той, что на рабочей станции), платформах. Но и эта задача вполне решаема. Самый дешевый способ состоит в установке интересующих ОС с их браузерами на виртуальные машины. Разве что с OS X в этом плане могут возникнуть проблемы, если, конечно, это не основная ОС на компьютере разработчика.

Другой способ — проверка сайта на нескольких компьютерах. Естественно, это более дорогой, но и во многом более выигрышный метод. Например, с его помощью, можно распределять задачу тестирования между несколькими сотрудниками, что актуально для больших проектов. В результате применения такого подхода (при грамотной организации) можно существенно повысить скорость выполнения работы.

Тестирование дизайна и последующая проработка деталей, связанных с его переносимостью, — одна из тех деталей, которая отличает любительскую работу от профессиональной. Этот факт должен учитывать не только дизайнер, но и заказчик, принимающий его работу. В последнем случае проверке качества верстки зачастую не уделяют внимания вообще. Иногда из-за непонимания вопроса, а зачастую — просто из нежелания тратить время на детали, свалив все на плечи абстрактного «профессионала».

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

Один из таких сервисов — browsershots.org. С его помощью можно узнать, как выглядит ваш сайт во всех распространенных (и не очень распространенных) браузерах на платформах Linux, Windows, OS X и даже BSD. Всего в списке порядка 60 доступных браузеров.

Выдача отчета со скриншотами происходит не мгновенно. Это связано с тем, что сам процесс их изготовления довольно ресурсоемкий и на сервере существует очередь обрабатывания сайтов. При каждом запросе, browsershots выдает URL будущего отчета, на котором по мере готовности начинаю появляться скриншоты. Проще всего сохранить этот URL в закладках и вернуться на сайт через несколько минут. Продолжительность обработки может варьироваться, но когда я в последний раз пользовался сервисом, на генерацию полного «комплекта» скриншотов ушло около 30 минут.

Как я уже упомянул, подобный сервис не вполне пригоден для оперативного тестирования. Для этого он слишком медленный. Но для проверки качества принимаемой работы — как раз то, что нужно.

Ссылки по теме

• browsershots.org — сервис генерации скриншотов веб-страниц. Примеры готовых полноразмерных скриншотов можно посмотреть на специальной странице.
• browsercam.com — еще один альтернативный «немножко-платный» сервис, позволяющий дополнительно получить скриншоты c мобильных устройств.

Комментарии к заметке «Тестирование переносимости веб-страниц»

# Kupuyc: ^{(25 марта, 2008 @ 10:38)}

Вот интересно, неужели имеется смысл или далекая на него перспектива использования сервисов по генерации скринов того как отображается страница? Ведь зачастую отладка верстки – это десятки обновлений, так и до луча ненависти в собственный мозг недолго :).

# admin: ^{(25 марта, 2008 @ 12:12)}

Kupuyc: Тестировать с помощью такой штуки – действительно нереально. Я вижу смысл использования такого сервиса в однократных проверках переносимости дизайна. Например, при оценке дизайна заказчиком. Об этом, в общем, и писал.

# Kupuyc: ^{(26 марта, 2008 @ 05:47)}

Все в порядке. Просто такого рода сервисов довольно много, много и заметок про них, но мало кто акцентирует зачем же они, в конце концов, нужны.

# Средства отладки веб-страниц для Internet Explorer | Paradigm.ru: ^{(26 апреля, 2008 @ 12:24)}

[...] более удобное решение, чем используемый мной ранее Multiple IE, в котором разные IE просто устанавливались [...]

Написать комментарий