Оптимизация Сайты

Как обеспечить стабильную работу лендинга в любом браузере?

5_via_6

Для того, чтобы Ваши продажи стабильно росли (или хотя бы не падали, в наше-то кризисное время), а поток покупателей не ослабевал, необходимо сделать процесс выбора и приобретения по максимуму приятным. А теперь честно ответим на такой вопрос: может ли человек наслаждаться покупкой, если при попытке зайти на Ваш веб-сайт часть картинок у него не открывается, половина текста уезжает за пределы экрана, а сделанные на java плагины и вовсе отказываются запускаться? Очевидно, что ответом в данном случае будет решительное «нет». Как же избежать подобной ситуации и добиться стабильной работы всех элементов Вашей страницы в любом браузере и операционной системе (включая и мобильные)? Есть один надежный способ – тестирование сайта на кроссбраузерность и кроссплатформенность. В чем его суть и как его применять – читайте далее.

Как, зачем и почему?

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

Statistics-desktop-browsers-2016

Если все вышенаписанное Вас не убедило, взгляните на цифры для всего мира (StatCounter, декабрь 2016) …

Скриншот 2017-03-09 22-03-18

…и России (LiveInternet, февраль 2017)

Как выполнить такую проверку? Можно воспользоваться «дедовским» методом и поставить дюжину приложений на свой компьютер, а потом открывать Ваш лендинг во всех поочередно. Но на это потребуется немало времени и сил. К тому же, сейчас существует несколько десятков сервисов, которые сделают это за Вас. Среди них есть платные и бесплатные, специализирующиеся на чем-то одном или имеющие массу дополнительных функций, онлайн и оффлайн. Все их можно разделить на три категории:

  • «Скриншотеры». Умеют только испытывать на совместимость и делают это простейшим путем – с помощью скриншотов. Дают возможность только оценить отображение в статике, не выявляют проблем с работоспособностью плагинов, форм заказа и т.д. Из плюсов: со своей миссией они вполне справляются, а еще среди них встречаются free-to-use варианты.
  • Механизмы виртуализации. Они, как правило, требуют оплаты, однако и функционал у них богаче: к мощностям первой группы здесь добавляется опция не только констатировать, что «в Хроме все нормально, а вот в Опере что-то все съехало», но и рассмотреть ситуацию в динамике, понять, нажимаются ли кнопки, воспроизводятся ли видео-ролики и прочее.
  • Многофункциональные «комбайны». Наиболее дорогие из перечисленных, но и средств для анализа веб-сайта, помимо вышеперечисленных, предоставляют огромное множество. Например, можно провести валидацию кода или посмотреть, как Ваша рассылка будет выглядеть в разных почтовых системах!

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

Нажимаем PrintScreen за вас

Browsershots

«Дешево и сердито». Здесь Вы можете узнать, совместим ли Ваш одностраничник с более чем 189 веб-браузерами для 3 операционок. Вернее, таковы заявления авторов. На деле речь идет о 65 версиях обозревателей, причем для Windows почему-то доступны только Chrome, Firefox, Opera и Lynx. Происходит все медленно (очередь общая, и весь процесс может занять до 2 часов), а максимальная длительность одного неоплаченного сеанса – 15 минут. Стоимость «приоритетного статуса» — 30 $/мес. Все скриншоты выкладываются в общую галерею, из которой их может посмотреть любой желающий. В качестве преимущества заявляется наличие русского языка – что, к сожалению, ни соответствует реальности.

Скриншот 2017-03-09 19-49-49

Интерфейс полностью на английском, на «великом и могучем» — одна-единственная сиротливая надпись «Начало»

Для справки: нам не удалось проверить здесь страницу нашего агентства, сессия закончилась раньше

Browsera

Проект построен на уникальной услуге – параллельном просмотре в одном окне того, как отображается Ваш портал в разных интернет-обозревателях. Автоматически их сравнивает, выделяет различия и сообщает об имеющихся ошибках JavaScript. Имеет free-версию с всего несколькими открытыми браузерами, низким разрешением и ограничением в 25 web-страниц в месяц.

Скриншот 2017-03-09 20-42-19

Turbo.net Browser Sandbox

Решает ровно одну задачу: тестирует веб-страницы на совместимость. Зато за это не придется платить ни копейки! В списке — исключительно основные интернет-браузеры, но если вспомнить, что они покрывают 85-90 процентов соединений, то этого оказывается абсолютно достаточно, если Вы в режиме жесткой экономии.

Скриншот 2017-03-09 21-02-17

Включаем виртуальную машину

CrossBrowserTesting

Предлагает шаблонный для этого класса набор: автоматическая проверка (скриншоты, со сравнением) и ручная через VNC (программа запускается на удаленном сервере, а Вы получаете к ней доступ). Список поддерживаемых интернет-браузеров внушителен (1500+ комбинаций), в том числе для Android и iOS. Стоит все это от 350$ в год с помесячной оплатой, но есть пробный доступ на 7 дней.

Скриншот 2017-03-09 20-16-02

BrowserStack

Очень интересное решение. По сути – все то же самое, что и у других: запуск в облаке, динамическая отладка, поддержка гаджетов и т.п. Отличается от конкурентов тем, что в него встроены инструменты разработчика. Среди фирм, пользующихся их услугами: Microsoft, Twitter и Википедия.  Цены начинаются от 30$ в месяц при годовой подписке. Есть триальный период, а еще онлайн-сервис полностью свободен для работающих c open source.

Скриншот 2017-03-09 20-40-38

Mogotest

Позиционируется как ресурс для SEO-экспертов, что выражается в размещении нескольких трогательных статьей о важности апробации landing page. Ничем особенным не выделяется, но зато есть донельзя урезанный free-доступ с двумя снимками экрана, а премиум можно приобрести всего за 5$/мес.

Скриншот 2017-03-09 20-39-42

Multibrowser

Отдельное приложение с типичным для категории функциональным наполнением, записью видео и интеграцией с VisualStudio. Количество уважаемых клиентов также вызывает доверие (среди них Xerox и Калифорнийский университет). При первой установке дается триал на 14 дней, а после придется приобрести годовую лицензию за 149 долларов.

Скриншот 2017-03-09 20-38-50

Sauce Labs

Компания предоставляет облачные серверы для различных потребностей, включая кроссбраузерные тесты. Возможных комбинаций браузер-ОС тут более 800. Из необычного –параллельный анализ мобильной и десктопной версий. Ценовая политика щадящая: от 29$ ежемесячно, имеется пробный период.

Скриншот 2017-03-09 20-52-33

Анализируем каждую мелочь

Litmus

Предельно многофункционален. Помимо стандартизированного набора, также может оценить валидность html и css и показать, как отобразится Ваше письмо в нескольких десятках e-mail служб, что очень удобно, если Вы организуете рассылки для постоянных покупателей (а Вы ведь помните, что это прекрасно способствует установлению персонализированных отношений с ними). Несмотря на многозадачность, его можно попробовать в течение недели, а потом плата составит 79$/мес.

Скриншот 2017-03-09 21-05-55

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

comments powered by HyperComments
Похожие записи
3_via_8
Создание сайта: от идеи до продающей страницы (part I)
5_via_9
7 новых способов ускорить загрузку страницы