Как сделать кроссбраузерное тестирование

Добавил пользователь Алексей Ф.
Обновлено: 04.10.2024


Кроссбраузерность — одна из важнейших характеристик любого сайта, подразумевающая одинаково корректное отображение и работу ресурса в разных браузерах, а также их версиях. Для того, чтобы сайт правильно функционировал в Google Chrome, Яндекс.Браузере, Safari, Opera, Firefox, Android Browser и т.д. как на стационарных, так и на мобильных устройствах, необходимо решить вопрос кроссбраузерности еще на этапе верстки. О том, как протестировать сайт на кроссбраузерность и добиться этого свойства, мы рассказываем в данной статье.

Почему сайты могут по-разному отображаться и работать в разных браузерах

Причина этой проблемы — отличия в исходном коде. Особенно это касается старых версий браузеров.

Нередко определенные HTML-коды и CSS-стили по-разному воспринимаются и обрабатываются на разных движках, поэтому один и тот же элемент может в одном браузере отображаться и функционировать корректно, а в другом — нет.

В чем выражается кроссбраузерность сайта и почему она так важна

Если сайт некорректно отображается, неправильно работает в одном или нескольких популярных браузерах, то он неудобен для использования. Посетители будут уходить с него, не просмотрев и одной страницы. Таким образом, увеличится показатель отказов, а, как известно, этот поведенческий фактор ранжирования сайтов имеет весомое значение. Поисковые роботы посчитают такой сайт неинтересным и понизят его позиции в органической выдаче. О конверсиях, разумеется, не может быть и речи, поскольку пользователю не удалось ознакомиться с предлагаемой продукцией или услугой.

Проанализируем конкурентов, подберем запросы с низкой конкуренцией, проведем поисковую оптимизацию сайта, организуем внешнюю ссылочную массу, проработаем карточки компании на онлайн картах, проведем базовую UX-аналитику сайта. Над каждым проектом работает от 6 до 10 специалистов. Собственные разработчики для доработки сайта при необходимости. От вас - сайт, от нас - позиции в Яндекс/Google и трафик.

При этом сайт не должен абсолютно одинаково выглядеть во всех браузерах. Вам достаточно:

  • сохранить структуру;
  • не допустить развала верстки;
  • избежать наложения текста на текст, изображения;
  • сохранить читабельность информации.

Главное, чтобы клиенту было удобно читать, просматривать изображения и совершать действия на сайте с того браузера, которым он привык пользоваться.

Как протестировать сайт на кроссбраузерность

  1. Ручное тестирование кроссбраузерности сайта. Для этого нужно установить на ПК разные браузеры и посмотреть, как сайт отображается в каждом из них. Способ верный, но неудобный: придется скачивать разные браузеры и их версии, а некоторые из них, к слову, можно установить только на macOS.
  2. Использование специальных онлайн-сервисов. Этот способ прост и надежен. Таких сервисов достаточно много: есть и бесплатные, но с определенными ограничениями, и платные, но более функциональные и быстрые.

Результаты тестирования предоставляются пользователю в виде скриншотов. На них видно, все ли в порядке с кроссбраузерностью сайта или над ней нужно еще поработать.

Из бесплатных сервисов также можно использовать CrossBrowserTesting, Browserling и т.д. Каждый из них отличается определенными функциональными особенностями и возможностями. Некоторые сервисы требуют пройти регистрацию, на других можно проверить сайт и без нее.

Если вы планируете использовать платный сервис, попробуйте BrowserStack . Этот мощный инструмент в режиме реального времени проверяет сайты на кроссбраузерность в более чем 2000 браузеров и устройств. А еще здесь есть бесплатный пробный период.

Кроме онлайн-сервисов, существуют и специальные приложения. К примеру, Multi-Browser Viewer. Этот инструмент позволяет проверить не только корректность отображения данных в разных браузерах, но и то, насколько правильно сайт функционирует.

Как добиться кроссбраузерности сайта

Предлагаем вам несколько самых действенных способов решения этой задачи:

1. Вендорные префиксы. Они представляют собой приставки к названиям уникальных свойств, которые используются вендорами (в данном случае это производители браузеров). Такие префиксы применяются в конкретных случаях, а именно, когда CSS-свойство:

  • нестандартно и прописано для определенного браузера;
  • это эксперимент, который еще дорабатывается;
  • реализует частичный функционал.
  • -moz- применяется в Firefox;
  • -ms- применяется в IE и Edge;
  • -webkit- применяется в Safari, Google и прочих браузерах на базе WebKit и Blink;
  • -o- применяется в старых версиях Opera (на платформе Presto).

Код может выглядеть следующим образом:

  • -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
  • - webkit-flex-wrap — это свойство для версий Chrome с 4 по 28 и версий Safari с 3.1 по 8;
  • -ms-flex-wrap — свойство для IE 10.

CSS-свойство flex-wrap определяет, будет ли flex-контейнер расположен в одной строке или в нескольких. Wrap указывает на то, что flex-элементы внутри контейнера в случае переполнения располагаются в несколько горизонтальных рядов. Программист, создающий сайт, разумеется, хочет, чтоб так было во всех браузерах, поэтому использует вендорные префиксы.

2. CSS-hacks. Хаки — это части кода, которые может понять только какой-то конкретный браузер. То есть, если, к примеру, ваш сайт правильно отображается в четырех браузерах, а в остальных есть проблемы с корректностью интерпретации данных, то эту проблему можно решить, отдельно прописав соответствующие хаки для каждого браузера, в котором страницы отображаются неверно.

3. Разделение стилей. Используется для поддержки Internet Explorer. Этот способ предполагает определение браузера и подключение конкретного файла стилей. В IE применяются условные комментарии, которые понимает только Internet Explorer. Другие браузеры воспринимают этот код как простой комментарий.

4. Универсальные элементы. Они одинаково качественно функционируют практически во всех популярных браузерах. Благодаря им исходный код ресурса не выглядит громоздким, а главное, соответствует требованиям браузеров.

На бесплатном онлайн-сервисе caniuse. com вы узнаете, какие теги поддерживаются той или иной версией браузера.

Самые популярные браузеры среди пользователей Рунета

По данным Яндекс.Радара за июнь 2020 года, в большей степени пользователи Рунета предпочитают Google Chrome, Яндекс.Браузер и Safari.

Самые популярные браузеры среди пользователей Рунета


Самые популярные браузеры среди пользователей Рунета

Что касается браузеров на мобильных устройствах, то здесь Яндекс.Браузер и Safari меняются местами.

Самые популярные браузеры на мобильных устройствах


Самые популярные браузеры на мобильных устройствах

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

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


Ниже я составил список из 7 на мой взгляд выдающихся инструментов для тестирования кроссбарузерности, как платные, так и бесплатные.

Browsershots


Browsershots – простой и очень полезный сервис. Сервис бесплатный, но в нем есть такой функционал, какой вы не сможете найти в других приложениях, даже в платных.


JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Сервис создает скриншот работы веб-сайта в определенных браузерах. Список поддерживаемых браузеров обширен. Можно выбрать разрешение экрана, глубину цвета, есть возможность проверять сайт на наличие ошибок с JS (и определение версии JS), Java и Flash.

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

Если вам нужно больше функций и возможность расставлять приоритеты при тестировании, вы можете приобрести подписку на месяц за $29.

Browser Sandbox


Browser Sandbox – еще один сервис для тестирования кроссбраузерности с большим списком поддерживаемых браузеров. Существенный минус заключается в том, что данный сервис доступен только пользователям Windows. Пользователям Linux и Mac OS не повезло, однако разработчики обещают версию для Mac в скором будущем.

К плюсам можно отнести большой список поддерживаемых браузеров, среди которых IE, Firefox, Chrome, Chromium Canary, Firefox Mobile, Safari, Opera и Firefox Nightly. В бесплатной версии сервиса можно делать тесты только в последних версиях браузеров.

За доступ к старым версиях браузеров придется заплатить. К счастью тарифы дешевые и начинаются от $4.95 в месяц.

IE Testers

Если вы создаете свой сайт в первую очередь под IE и вам нужно протестировать его на работу в различных версиях данного браузера, мы подобрали парочку бесплатных сервисов специально для IE.

Netrenderer


В Net Renderer можно проводить тесты в версиях IE от 5.5 до 11. Быстрый и простой инструмент, но функционал оставляет желать лучшего.

Microsoft Edge


Microsoft Edge – целая платформа, выходящая далеко за пределы тестов для IE. Собственно говоря, браузер позволяет создавать скриншоты работы сайта в других браузерах и из-под различных мобильных устройств. Причина, по которой я вынес данный браузер в группу тестировщиков IE, в том, что в браузере есть виртуальные машины для различных версий IE, а также в браузере есть Azure Remote App, с помощью которого можно удаленно проводить тесты в IE.

My Debugbar


И последний сервис для теста IE — My DebugBar, также известный как IETester. В отличие от Net Renderer, My Debugbar – десктопное приложение весом 60Мб. Его необходимо загрузить, и работает программа только в Windows.

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

Webshot by Mobile Ready



JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Отличие Webshot в том, что это сервис только для тестирования кроссбраузерности на мобильных устройствах. Сервис бесплатный, но вам придется зарегистрироваться.

На момент написания статьи сайт Webshot не работал, по крайне мере у меня. При попытке зарегистрироваться я получал ошибку Internal Server Error. Пару недель назад я писал разработчикам данного сервиса о возникшей проблеме, ответа до сих пор нет, да и в будущем не ожидается.

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

Browsera


Платные сервисы начинаются с Browsera. Крайне полезное приложение, и вы точно знаете, за что вы платите деньги. С его помощью можно тестировать макеты, JS, динамические страницы, страницы с паролем и т.д.

Установка не нужна. Данный сервис можно бесплатно опробовать в течение 30-ти дней. В бесплатном аккаунте почти нет функций, а платные тарифы идут от $39 до $99.

CrossBrowserTesting


В этом сервисе мне больше всего нравится то, что он использует настоящие устройства для запуска браузеров. Эмуляторы вполне справляются со своей работой, но нет ничего лучше, чем запустить сайт на реальном устройстве. Список возможностей довольно впечатляющий, и CrossBrowserTesting точно стоит своих денег. Я думаю, что список поддерживаемых браузеров и ОС самый большой в сети – 900 браузеров в более чем 40 операционных системах, в том числе iOS, Android, Windows, Mac и т.д.

Мне также понравилась функция теста в реальном времени. С ее помощью можно тестировать веб-страницы на реальном оборудовании. Тестировать можно AJAX, HTML формы, JavaScript, Flash. Среди других возможностей – локальные тесты, Selenium тесты (пишет автоматизированные скрипты), а также сравнение скриншотов. Минимальный тариф стоит $29 в месяц, но можно взять семидневный триал.

BrowserStack


BrowserStack – еще один крупный игрок в индустрии. Отлично подходит для теста мобильных устройств (настоящие устройства), однако также имеется 700+ десктопных браузеров.

С помощью данного сервиса также можно проводить локальные тесты, делать быстрые скриншоты с разрешениями от 800×600 до 2048×1536. Так же как и у CrossBrowserTesting, тарифы начинаются от $29 в месяц, но BrowserStack также предлагает ограниченные предложения за $12.50 в месяц для фрилансеров. Также для проектов с открытым исходным кодом у них есть бесплатные сервисы.

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

Заключение

Лично я долгое время работаю с BrowserShots, и меня не смущает ограниченный функционал. Недавно я проектировал простой шаблонный HTML сайт для друга. Шаблон был простой, и мне очень нравился его код.

Но когда друг открыл сайт на своем компьютере, он сказал мне, что в IE сайт выглядит очень плохо. И да, я не тестировал его на работу в IE перед отправкой – проект был предварительным и с таким отличным кодом, что он просто не мог не работать в каком-либо браузере.

Я открываю BrowserShots, и там все в порядке. На всякий случай я предложил сменить шаблон. И опять та же проблема. Я начал подозревать, что проблема кроется в браузере друга, и предложил ему открыть сайт на другом компьютере. И проблема исчезла.

Но если бы у него не было под рукой еще одного ПК с рабочим IE, было бы сложно убедить его, что проблема в его браузере, а не в моем коде.

Вот именно для таких случаев, когда нужно быстро набросать примерный проект, вам подойдут BrowserShots или другие IE тестировщики. Ну и естественно, если вам нужны более надежные гарантии, то тут вам не помогут бесплатные решения. Вот почему трудно выделить какой-то один сервис и назвать его лучшим – все зависит от конкретного случая.

Автор: Ada Ivanoff

Редакция: Команда webformyself.


JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Кроссбраузерность сайта

SEO

Кроссбраузерность — одна из важнейших характеристик сайта, которая подразумевает под собой одинаковое корректное отображение и работу ресурса в разных браузерах (Google Chrome, Safari, Opera, Firefox, Android Browser и т.д. как на стационарных, так и на мобильных устройствах), а также их версиях. Вопрос кроссбраузерности лучше решать на этапе верстки. О том, как протестировать сайт на кроссбраузерность и добиться этого свойства, читайте в данной статье.

Почему верстка сайта может по-разному отображаться и работать в разных браузерах

Причина этой проблемы — отличия в исходном коде браузеров. Особенно это касается старых версий — т.к. они не поддерживают много современных CSS технологий.

Нередко определенные HTML-коды и CSS-стили по-разному воспринимаются и обрабатываются на разных движках, поэтому один и тот же элемент может в одном браузере отображаться и функционировать корректно, а в другом — нет.

Почему кроссбраузерность сайта так важна

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

При этом сайт не должен абсолютно одинаково выглядеть во всех браузерах. Вам достаточно:

  • сохранить структуру;
  • не допустить развала верстки;
  • избежать наложения текста на текст, изображения;
  • сохранить читабельность информации.

Главное, чтобы клиенту было удобно читать, просматривать изображения и совершать действия на сайте с того браузера, которым он привык пользоваться.

Как протестировать сайт на кроссбраузерность

  1. Ручное тестирование кроссбраузерности сайта. Для этого нужно установить на ПК разные браузеры и посмотреть, как сайт отображается в каждом из них. Способ верный, но неудобный: придется скачивать разные браузеры и их версии, а некоторые из них, например Safary (речь о свежем), можно установить только на macOS.
  2. Попросить знакомых, чтобы зашли на сайт со своих девайсов.
  3. Использование специальных онлайн-сервисов (о них ниже) или ПО (например Blisk ). Этот способ прост, надежен и самое главное быстрый.

Сервисы проверки кроссбраузерности

Перечислю самые популярные.

CrossBrowserTesting

crossbrowsertesting

Сервис платный (первые 7 дней или 60 минут бесплатно), в нем более чем 2050 реальных настольных и мобильных браузеров. И так же четыре режима тестирования:

Browserling

browserling

Бесплатно только тестирование в устаревших IE на устаревших платформах.

Sauce Labs

saucelabs

Триал у него довольно ограниченный, а вот при оформлении платной подписки станет доступна автоматическая проверка. Здесь есть около 700 комбинаций браузеров, разрешений и устройств.

Litmus

litmus

Откройте для себя лучший способ разрабатывать, кодировать и проверять свои идеи в более чем 100 приложениях и устройствах. Пользоваться бесплатно можно только первые 3 дня.

Browsershots

Browsershots

Онлайн сервис, где есть возможность сохранять скриншоты сайта, который проверяется на кроссбраузерность, со многих браузеров и их сборок (более 200 штук), в числе которых устаревшие и малопопулярные. В последнее время часто не работает.

В бесплатной версии ваш запрос становится в очередь, и скриншоты начнут подгружаться на сервер поочередно после высвобождения сайтов. Данная процедура может занять от 10 минут до 2-3 часов.

Browserstack

browserstack

Платный и мощный инструмент который проверяет сайты на кроссбраузерность в режиме реального времени, в более чем 2000 браузеров и устройств. Есть бесплатный пробный период.

Программное обеспечение для тестирования кроссбраузерности

MultiBrowser

multibrowser

Настоящие веб-браузеры с песочницей, а также набор для тестирования адаптивного дизайна, мобильных устройств, iPhone и iPad Simulator, которые можно запускать в автономном режиме в среде вашего рабочего стола!

Демо версия работает 14 дней.

Как добиться кроссбраузерности сайта

Вариант 1. Вендорные префиксы

Они представляют собой приставки к названиям уникальных свойств, которые используются вендорами (в данном случае это производители браузеров). Такие префиксы применяются в конкретных случаях, а именно, когда CSS-свойство:

  • нестандартно и прописано для определенного браузера;
  • это эксперимент, который еще дорабатывается;
  • реализует частичный функционал.
  • -moz- применяется в Firefox;
  • -ms- применяется в IE и Edge;
  • -webkit- применяется в Safari, Google и прочих браузерах на базе WebKit и Blink;
  • -o- применяется в старых версиях Opera (на платформе Presto).

Пример обычного CSS кода:

И этот же CSS код с вендорными префиксами:

Есть онлайн веб сервис для расстановки вендорных префиксов для лучшей кроссбраузерности: Автопрефиксер . Его рекомендуют к использованию Google и используют в Twitter и Taobao.

Вариант 2. CSS хаки

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

Примеры хаков можно посмотреть на habr .

Вариант 3. Универсальные элементы

Самые популярные браузеры среди пользователей Рунета

По данным Яндекс.Радар более 70% пользователей Рунета предпочитают с ПК заходить с брузеров: Google Chrome и Яндекс.Браузер.

Популярные десктоп браузеры рунета

Что касается браузеров на мобильных устройствах, то здесь история похожая, только можно еще добавить Safari.

Популярные мобильные браузеры рунета

В общем если занимаетесь версткой, то нужно как минимум ориентироваться на Google Chrome, Яндекс.Браузер (он по моему на той же платформе что и хром) и Safari. В идеале на все где количество пользователей более 1%.

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

Проверка кроссбраузерности сайта это один из видов тестирования сайта перед его запуском (сдаче заказчику) в серии тестирования внешнего вида. Помимо кроссбраузерности, в этой серии, делаются проверки на адаптивность сайта и проверку пиксельного соответствия.

Видимость сайта в браузерах

Вручную проверить видимость сайта во всех браузерах задача, мягко сказать, бестолковая. Хотя можно установить у себя основные браузеры и очень быстро открыть свой сайт в основных браузерах Google Chrome, Яндекс Chrome, Firefox и Opera и тем самым перекрыть 90% возможных посетителей вашего сайта.

По данным статистики StatCounter, популярность браузеров в России на октябрь 2018 года выглядит так.

StatCounter browser RU

Сомневаюсь, что это график сильно измениться в ближайшие годы.

Если этой информации не достаточно, то проверить, как выглядит сайт в различных браузерах, помогут специальные сервисы.

Сервис Browsershots дает вам бесплатную возможность сделать скиншоты проверяемой страницы сайта в основанных браузерах и их версиях. Бесплатно, проверка кроссбраузерности сайта, проводится для осей Linux и Windows. Для MAC и BSD придётся делать денежный взнос.

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

настройки сервиса внизу страницы

Более интересны 5 настроек: Screen Size, Color Depth, Javascript, Java, Flash. По умолчанию они выставлены на усмотрение сервиса.

Также обратите внимание, что выделены не все чеки и по умолчанию проверяются не все браузеры, а лишь последние, по данным сервиса, версии Браузеров.

Browsershots.org

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

результат проверок Browsershots.org

результат проверок

Turbo.net

К сожалению, с недавних пор этот сервис стал условно бесплатным, и бесплатная пробная версия позволяет запускать ограниченное количество сеансов с ограничением по времени.

Видео покажет, как работает сервис и что такое, видимость сайта в браузерах.

Видимость сайта в Internet Explorer

Возвращаясь к статистике StatCounter, мы обнаруживаем, что, в мире, браузер Microsoft Internet Explorer, занимает третье место, по использованию. А это значит, что игнорировать это браузер со всеми его версиями нельзя.

статистике StatCounter

IE NetRenderer

Сервис IE NetRenderer работает быстро. В отличие от других служб скриншотов, мы можем обрабатывать большое количество захваченных заданий параллельно и в реальном времени. Скорость рендеринга должна быть сопоставимой, если не быстрее вашего локального браузера. Наши двигатели IE имеют гарантированную пропускную способность интернета в 200 Мбит/с.

Для чего подходит

Этот инструмент веб-рендеринга идеально подходит для веб-дизайнеров, работающих на рабочих платформах Apple iMac и Linux. Он позволяет проверять веб-проекты изначально на всех популярных версиях Internet Explorer, без необходимости выделять несколько физических или виртуальных ПК с Microsoft Windows для этой цели. Перед каждым заданием рендеринга мы очищаем кэш Internet Explorer. Это позволяет сразу увидеть эффект от всех изменений, внесенных во время веб-разработки.

Обычно IE Netrenderer показывает только самую верхнюю часть любой веб-страницы. Если вы хотите увидеть части страницы ниже, введите вертикальное значение смещения пикселя в поле справа на URL. Затем рендеринг начинается с указанной позиции вертикального пикселя.

Снимок экрана всегда соответствует 100% оригинального размера и точности картинки вплоть до пикселя. Пользователь отмечает максимальную ширину видимого просмотра на экранах 800×600 и 1024×768 с учетом ширины полосы прокрутки браузера.

NetRenderer загружает веб-страницы из Германии, а не с вашего ПК. Это делает его полезным для нескольких других целей. Вы можете, например, использовать его как быструю проверку из вашей локальной сети вашей компании, чтобы узнать, доступны ли Webmail или веб-интерфейс вашего брандмауэра снаружи.

Можете использовать его в качестве приблизительной оценки, скорости загрузки веб-сайта людьми в Центральной Европе. Вы также можете использовать IE NetRenderer для просмотра веб-сайтов анонимно. Посетив веб-сервер вы не оставите никаких следов ни о вашем IP-адресе, ОС, версии браузера, плагинах или файлах cookie.

browserling.com

Сервис удобный, но на бесплатном тарифе ограничено время сессии проверки тремя минутами. Платный тариф с неограниченными проверками стоит 19$/месяц. Примечательно наличие проверок на Android (6 версий).

Так как проверка кроссбраузерности сайта относится к профессиональным проверкам, то большинство сервисов платные. Посмотрим на них.

CrossBrowserTesting

Сервис CrossBrowserTesting позволит провести тестирование совместимости кросс-браузера в облачном сервере на 2000+ реальных браузерах Интернет.

В бесплатном тарифном плане, после регистрации, можно провести 60 минут проверочных сессий в месяц (6 сессий по 10 минут). Неограниченное использование сервиса стоит 15$/в месяц.

На сайте мощный набор различных платных инструментов, среди которых есть тест кроссбраузерности, от 19$. ссылка.

Зачем нужно время для проверок

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

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

Читайте также: