Как называется тест поддержки браузером веб стандартов
Эта статья предназначена для дизайнеров, верстальщиков, разработчиков и всех остальных людей, бьющихся с тестированием сайтов в нескольких браузерах.
Всего лишь год назад, хороших средств для тестирования кроссбраузерной совместимости сайтов практически не было. Инструменты, как правило, обладали серьезными недостатками – высокой ценой, скромными возможностями или затрачиваемым временем. Однако, в последнее время, в мире тестирования браузеров появилось много новичков, и некоторые из них являются прекрасными сервисами.
В этой статье, мы рассмотрим 7 простых инструментов для тестирования кроссбраузерной совместимости; инструментов, которые справляются со своей задачей очень легко, и к тому же, каждый из этих инструментов можно использовать бесплатно.
Xenocode Browser Sandbox — это гейм-чейнджер для тестирования браузеров на компьютерах с Windows. Всего лишь одним кликом мыши, вы можете открыть и работать в браузере, без всякой инсталляции. Вы можете тестировать различные версии IE, Firefox, Google Chrome и Safari. В прямом смысле тестировать, а не только получать скриншоты.
Увы, это далеко не идеальное решение. В текущей версии есть довольно серьезный недостаток — нет никакой поддержки Macintosh. Ходят слухи, что она появится в будущем, тем не менее и тогда, этот сервис будет принадлежать отдельному классу.
Вы можете использовать ява-апплет для веб-приложений, чтобы подключиться к их удаленным компьютерам, или использовать локальный VNC-клиент, если он у вас установлен. Их система предлагает полное интерактивное тестирование сайта, и также как решение от Xenocode, это не только скриншоты.
Это бесплатная загружаемая windows-программа, которая все еще находится на ранней стадии разработки. Как было заявлено, она является единственным бесплатным ресурсом, позволяющим полностью протестировать все актуальные версии Internet Explorer.
Просто загрузите и установите этот бесплатный браузер, и вы легко сможете выбрать нужную версию IE для просмотра. Программа также позволяет расположить две вкладки с различными версиями рядом.
Со всем многообразием сайтов тестирования только для IE, самое время кому-нибудь присоединится и создать сервис, позволяющий тестировать сайты на Safari/Mac. Бесплатная версия этого сервиса предоставляет возможность получения скриншотов сайта, тестированных на последней, стабильной версии сафари, практически мгновенно. И хотя в сервисе немного не хватает версий браузеров, он определенно восполняет это предоставлением хорошей скорости.
За несколько долларов дополнительно, есть возможность получить компьютер полностью и проводить более глубокое тестирование
В течении нескольких месяцев, популярность Litmus значительно возросла, и он стал одним из самых благоприятных инструментов для тестирования кроссбраузерности. К сожалению его бесплатные возможности ограничены и позволяют тестировать только IE7 и Firefox 2.
NetRenderer является чуть более скромным инструментом для тестирования совместимости с IE. Как и многие другие сервисы, NetRenderer создает скриншоты вашего сайта в различных браузерах. Он поддерживает все версии IE начиная с 5.5 до версии 8, и создает скриншоты очень быстро, без необходимости ждать.
Есть возможность установить тулбар для браузера, позволяющий быстро протестировать любые страницы, которые вы посещаете вместе с их сервисом. Это также бесплатный сервис, к тому же платное тестирование на этом сервисе вообще не предусмотрено.
BrowserShots стал одним из самых популярных инструментов тестирования, и не без оснований. Он позволяет тестировать большинство браузеров и операционных систем, включая довольно редкие сочетания. Бесплатное использование сервиса имеет только одно ограничение – очередь, поскольку заплатившие пользователи, обслуживаются первыми.
В связи с популярностью сервиса, получение тестовых скриншотов несколько раз в день, может быть очень медленным. Так как сервис предоставляет скриншоты с компьютеров пользователей, все зависит от вашего выбора. Чем популярнее браузер/ОС, тем быстрее вы получите скриншоты.
Adobe MeerMeer это приятный на вид сервис тестирования, который будет выпущен в ближайшее время, компанией Adobe. MeerMeer предлагает значительное количество преимуществ по сравнению с существующими системами тестирования. Наиболее примечательным является, пожалуй, «луковая кожура», или возможность наложения скриншотов из разных браузеров, одно на другое.
Может быть вы используете принципиально иной способ тестирования кроссбраузерной совместимости? Если так, поделитесь, есть множество людей, которым это будет интересно.
У каждого из нас случалось, что при открытии приложения в определенном браузере, текст смещался или таблицы уходили за пределы страницы. Это происходит потому что все браузеры отличаются не только внешне, но и внутренне. И у каждого свои нормы того, как он должен работать, что поддерживать и как развиваться.
Кроссбраузерное тестирование как раз позволяет сгладить эти различия, сделав разработку более или менее универсальной.
Кроссбраузерность является одним из важнейших факторов эффективной работы, поскольку аудитория пользуется разными браузерами. И если ваш сайт некорректно отображается хоть на одном из них, к примеру, текст наезжает на картинку, а шрифт слишком мелкий, то есть риск потерять сразу ощутимый процент пользователей.
Именно поэтому необходимо кроссбраузерное тестирование, которое поможет убедиться, что ваш сайт выглядит и работает корректно во всех браузерах.
Определение кроссбраузерного тестирования.
Кроссбраузерное тестирование — вид тестирования, направленный на поддержку и правильное отображение продукта в разных браузерах на экранах различного разрешения, в том числе мобильных устройств и планшетов.
Другими словами, кроссбраузерность — это способность сайта выглядеть во всех браузерах одинаково (или одинаково хорошо).
Какие есть стандарты для браузеров.
Мы привыкли оценивать браузеры по таким параметрам как:
— Скорость загрузки страниц;
— Скорость запуска;
— Потребление оперативной памяти;
— Доступные дополнения и расширения;
— Приватность и так далее.
Это ключевые значения, по которым пользователь выбирает для себя тот или иной продукт.
Сайт – это адрес, расположенный в интернете, на котором находится какая-либо информация (текст, видео, фотографии, документы, музыка и прочее). Поэтому для отображения сайтов в разных браузерах были придуманы такие понятия, как язык разметки и протоколы, которые объединяют все разнообразные браузеры и заставляют их соответствовать общепринятым нормам.
В браузере за отображение информации отвечает так называемый движок, который преобразует HTML (гипертекстовую разметку) и CSS (каскадные таблицы стилей, отвечающие за внешний вид сайта) в видимую на экране картинку. Любой уважающий себя и своих потенциальных пользователей поставщик браузеров будет соблюдать эти правила и сделает продукт, адаптированным под стандарты.
Также стоит отметить, что количество браузеров во много раз превосходит количество существующих движков, поэтому многие браузеры имеют одинаковые движки и, как следствие, одинаковые особенности и баги (проблемы).
Так, движок Chromium, который стал стандартом для современных браузеров (используется в Google Chrome, Opera и многих других), при всех своих достоинствах имеет и недостатки, например, замедляет работу при множестве открытых вкладок, и потребляет много памяти.
Почему возникают кроссбраузерные ошибки.
Конкуренция между поставщиками заставляет их искать новые технические подходы и по-разному внедрять различные функции. Например, большое количество расширений в браузере (микропрограммы, предназначенные для увеличения функциональности и удобства браузера) способно негативно повлиять на скорость работы.
В связи с тем, что любой из браузеров имеет собственные надстройки и плагины, приложения в них могут вести себя по-разному. В определенных браузерах некоторые страницы могут децентрализоваться (смещаться).
Возможен различный уровень поддержки технологических функций. В некоторых браузерах для повышения скорости загрузки страниц по умолчанию отключен JavaScript. И в таком случае, если в верстке сайта JavaScript берет на себя критические функции, то у пользователя могут возникнуть серьезные проблемы.
Некоторые браузеры могут содержать ограничения, которые способны заставить продукт работать медленно или некорректно. Например, технология, которую может не поддерживать браузер – это Flash-анимация. И, соответственно, если сайт содержит такие элементы, то в браузере они могут отображаться некорректно.
Особенности тестирования.
Важно помнить, что приступать к тестированию кроссбраузерности следует только после того, как функционал ПО будет проверен на дефекты другими видами тестирования. В этом случае можно быть уверенным, что выявленные проблемы имеют отношение именно к особенностям браузера, а не являются следствием ошибок, пропущенных на других стадиях. Также необходимо обращать внимание на сочетание операционной системы и браузера, выбирая наиболее распространенные из них.
В основном при тестировании ПО в разных браузерах, проверке подлежит вёрстка (цвет, шрифты, расположение графических картинок и динамических элементов) и JavaScript.
Для оперативного тестирования существуют удобные онлайн-сервисы и утилиты. В результате такой проверки вы получаете результат отображения вашего сайта в разных браузерах, на основании чего можно сделать выводы и заключения.
PS: автор цикла статей о кроссбраузерном тестировании Анна Вихрова (один из наших преподавателей).
Как часто заказчики ПО хотят, чтобы их детище работало у любого пользователя, в любых условиях и окружениях? Здесь будет уместен ответ — всегда. Что же скрывается за этой фразой? Что именно требуется для проверки от тестировщика? И как он будет воплощать требования в жизнь?
Не секрет, что WEB-приложения имеют отличия от десктопных. Самое главное отличие и опасение — это то, что мы не знаем, в каком браузере и уж тем более — в какой версии этого браузера откроет приложение наш пользователь.
Сколько существует браузеров
Если вас спросят, сколько браузеров вы знаете, думаю, вы с уверенностью назовете не меньше пяти. А если вас спросить, сколько вообще существует браузеров — возможно, вы задумаетесь.
А если спросить об этом у Гугла? Ответ будет неоднозначный. Количество более-менее известных браузеров сейчас превышает 50 наименований. И возможно, прямо сейчас кто-то выпускает в сеть еще один, свой собственный. А давайте представим, что уже завтра этот “кто-то” выпустит обновление своего браузера. Как же в таких непростых условиях проверить всё?
Какие есть стандарты для создания браузеров
Но и тут есть подводные камни. Стандарты совершенствуются; новые версии браузеров, по крайней мере, стараются совершенствоваться. А старые версии? Мало кто занимается доработкой старых версий. Да вообще никто не занимается. Выпустили новую — и все счастливы. А пользователи, думаете, каждый день проверяют наличие обновлений своего браузера? Тоже вряд ли.
К тому же, не стоит забывать про разработчиков, которые пишут само приложение. Они тоже люди, могут ошибиться в коде, могут не посмотреть в стандарт — бывает всякое. Поэтому, к сожалению, стандарты — не панацея.
Как выбрать браузеры под ваше приложение
Теперь о тестировании. Прежде чем начать непосредственно тестировать то или иное web-приложение, тестировщик должен ознакомиться с требованиями, которые выдвигает заказчик. Бывает так, что в требованиях изначально прописано: “Наш продукт должен работать в браузерах Chrome, начиная с версии 43, и IE, начиная с версии 9”. Или же сам заказчик не может определиться и, конечно же, ему хочется охватить всё и всех. Ну а вдруг, его самый важный потенциальный клиент использует браузер Uran? И что тогда? Он не увидит его приложение вовсе?
Прежде чем тестировщик начнет устанавливать себе все браузеры мира на один компьютер или, наоборот, удалять ненужные 48, можно предложить заказчику провести исследование. Таким образом, тестирование пройдет быстрее и более углубленно. Приложение выйдет в свет раньше. Ну а сам заказчик потратит меньше денежных средств.
Для начала надо определить целевую аудиторию будущего приложения. Кто эти люди, где они живут? Исходя из этих данных в сети можно увидеть статистику использования браузеров — например, самые популярные браузеры Азии. Благодаря таким запросам можно увидеть очень интересные и даже неожиданные результаты. Ну а если приложение в каком-то виде уже существует, можно воспользоваться удобной статистикой от ГуглАналитикс и иметь свои конкретные данные.
Хочу показать вам некоторые сервисы по просмотру статистики:
-
— здесь можно посмотреть данные по каждому месяцу, отследить тенденции. Кроме непосредственно браузеров и их версий можно посмотреть данные по использованию ОС, по разрешениям экрана и мобильным платформам; — здесь собрана статистика по отдельным странам или сторонам света (Азия, Европа, Океания); — на этом сервисе можно самому составить список из интересующих Вас браузеров и их версий; — на Гугл Аналитикс можно будет посмотреть свою собственную статистику.
Как проводить кроссбраузерное тестирование
Тут на помощь приходят эмуляторы. Их тоже существует немало. С помощью одних, например, Browsershots, можно получить скриншоты реальных пользователей с нужных нам браузеров и их версий. С помощью других можно самому выполнять нужные нам действия в самом эмуляторе.
Я хочу рассказать про два из них, которые лично использовала в ходе своей работы.
Например, эмулятор IETester, разработанный специально под этот браузер. В соседних окнах эмулятора можно открыть одну и ту же страницу разными версиями браузера. Это очень удобно и наглядно. Путем сравнения двух соседних вкладок можно легко увидеть несоответствия в отображении. В моей практике эта программа меня не подводила. И вдогонку, еще один её несомненный плюс — программа полностью бесплатна и занимает совсем немного места.
Однако, есть мнения, что отображение в этом эмуляторе не соответствует действительности. Как быть в этой ситуации? Есть решение! Проверить в самом браузере. Если какой-то момент “прям смущает-смущает”, открывайте реальный браузер и смотрите.
Если, например, надо проверить в IE 10, а на компьютере уже есть IE 11? Удалять, переустанавливать, проверять — это неверное решение. Тут на помощь приходят виртуальные машины. Это как компьютер в компьютере.
Например, можно воспользоваться Vmware workstation. И иметь на рабочем компьютере одни версии браузеров, а на виртуальной машине — другие. Можно даже установить несколько таких машин на один компьютер, и после этого иметь под рукой много разного софта. Стоит заметить, что виртуальные машины тоже различаются:
-
— поддерживает работу с Windows и Linux; — только для Windows; — готова к установке Windows, Linux и MAC OS.
Другой эмулятор — Spoon. Им также можно пользоваться абсолютно бесплатно. Он включает в себя широкий выбор браузеров: Firefox, Chrome, Opera, Safari и их разные версии. Тоже довольно удобная программа, которая позволяет в разных окошках на одной странице сравнить разные браузеры.
Разнообразие инструментов для тестирования кроссбраузерности
Конечно, этими двумя программами выбор эмуляторов не ограничивается:
- есть платные Multibrowser и CrossBrowserTesting;
- есть бесплатные — например, Lunascape;
- есть с бесплатным пробным периодом — Browsera.
Каждый тестировщик знает и любит какие-то свои программки.
- делать скриншоты;
- тестировать в разных браузерах и ОС;
- записывать тесты и позже прогонять их на других нужных браузерах.
Кроме записи данный сервис может похвастаться полноценной работой в ОС: т.е., можно в рамках одного теста переключаться между браузерами, задавать разные адреса и даже открывать инструмент разработки.
На что важно обращать внимание при кроссбраузерном тестировании
А зачем вообще тестировщики проводят такое тестирование, что именно они хотят проверить? Как я уже говорила, браузеры — разные, движки, на которых они работают, тоже разные. А это значит, что одни и те же элементы могут отображаться по-разному. Ведь разработчикам во время написания приложения довольно сложно подстроиться сразу под все браузеры и учесть все их особенности.
WEB-приложения по-другому называют клиент-серверные приложения. Здесь клиентом выступает браузер, а сервером — веб-сервер. Браузер принимает от пользователя запрос, отправляет его на сервер. WEB-сервер обрабатывает запрос и передает ответ обратно в виде HTML-страницы. Браузер отрисовывает полученный код в страницу, которую мы с Вами в итоге и видим. То есть, непосредственно от браузера будет зависеть то, какой мы увидим страницу.
Тестировщики при таком виде проверок отслеживают отображение форм, полей, чекбоксов, шрифтов, но наибольшее внимание, конечно же, уделяется интерфейсу: ведь это то, что в первую очередь оценивают пользователи вашего приложения.
Какой из этих элементов присутствует в трехуровневой архитектуре программного комплекса?
Сервер базы данных
Куда был помещён первый в мире зафиксированный баг?
Прибит в рамочке на стену
Что является одним из признаков некачественного ПО?
Несоответствие функциональным требованиям
Что из ниже перечисленного не является браузерным движком?
Опыт взаимодействия пользователя с приложением
Для чего нужен DNS?
Для преобразования доменов в IP-адреса
Какая ошибка возникает во всех перечисленных ОС: Android, iOS, Mac OS?
Как называется технология, которая блокирует просмотр интернет-трафика мобильных приложений?
Объясните фразу «Я знаю отличную шутку про UDP, но не факт, что она до вас дойдет»
Какой из этих элементов присутствует в трехуровневой архитектуре программного комплекса?
Сервер базы данных
Куда был помещён первый в мире зафиксированный баг?
Прибит в рамочке на стену
Что является одним из признаков некачественного ПО?
Несоответствие функциональным требованиям
Что из ниже перечисленного не является браузерным движком?
Опыт взаимодействия пользователя с приложением
Для чего нужен DNS?
Для преобразования доменов в IP-адреса
Какая ошибка возникает во всех перечисленных ОС: Android, iOS, Mac OS?
Как называется технология, которая блокирует просмотр интернет-трафика мобильных приложений?
Объясните фразу «Я знаю отличную шутку про UDP, но не факт, что она до вас дойдет»
Читайте также: