Как тестировать сайты: Как тестировать сайты — Блог HTML Academy

Содержание

Как тестировать сайты — Блог HTML Academy

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

Когда тестирование полезно

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

Предупреждение: статья не претендует на академическую полноту, но точно поможет что-нибудь не упустить.

Всё посмотреть и прокликать

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

Что проверять:

  • Элементы страницы расположены как на макете на всех устройствах.
  • Сайт одинаково выглядит и работает во всех нужных браузерах.
  • Кнопки нажимаются и после этого что-то происходит, слайдеры крутятся, гамбургеры раскрываются.
  • Все JavaScript-скрипты работают корректно.
  • Отображается правильный контент.
  • Отдаются нужные заголовки.
  • Загружаются правильные шрифты.
  • Фавиконка установлена.
  • Текст отображается не кракозябрами (в 2020 такое редко, но бывает).
  • Курсор интерактивный на интерактивных элементах и обычный на обычных.
  • С локализацией всё в порядке (русская, английская версия).
  • Страница не разъезжается, если включить блокировщик рекламы.

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

Фрагмент реального сайта о том, что тестирование полезно

Инструменты:

  • Реальные браузеры и устройства.
  • Эмуляторы (BrowserStack, LambdaTest, Browsera, BrowserShots).

Ошибки JavaScript

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

Валидность кода

Нужно убедиться, что код удовлетворяет стандартам HTML/CSS, для этого есть специальные валидаторы. Узнайте, как проверить валидность HTML.

Веб-формы

Формы — кладезь пользовательских данных и одновременно потенциальный источник уязвимостей. Формы должны быть удобными для пользователя и безопасными для сайта.

Что проверять:

  • Обязательные поля подписаны.
  • Если данные должны быть записаны в базу, проверяем это.
  • Выводятся понятные сообщения об ошибках заполнения.
  • Проверяем экранирование символов в формах на уровне клиента и сервера.
  • Приходят подтверждающие письма (если так задумано).

Неправильные ссылки

Проверьте, что все ссылки ведут на настоящие сайты и не ведут на 404. Для этого тоже есть несколько инструментов. На главной не должно быть ссылки на главную.

Уберите ссылку на главную с главной

Локализация

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

Но недостаточно проверить перевод текстов в интерфейсе, ошибок и документации — есть ещё ряд нюансов. Например, нужно проверить представление дат и времени, поддерживает ли шрифт локальные символы, и есть ли режим RTL для стран, где текст читается справа налево.

Производительность сайта

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

Что проверять

  • Как быстро браузер отобразит страницу?
  • Сколько времени занимает доставка ответа от сервера к пользователю?
  • Все ли ресурсы загружаются?

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

  • Использовать сжатие контента. Например, выбирать подходящие форматы графики и шрифтов.
  • Включить серверное и клиентское кэширование
  • Избавиться от неиспользуемых данных, которые подгружаются подзапросом. Например в приложении 10 библиотек JS, а используется только одна.
  • Правильно настроить файлы Cookie
  • Хранить статические данные на отдельном CDN-сервере.

Критерии качества

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

Делать сразу хорошие сайты

Всё, что нужно фронтендеру — на курсах HTML Academy. Научитесь всему, чтобы у тестировщиков закончилась работа.

Выбрать курс

Этапы и виды тестирования web-сайтов

Почему тестирование сайта так важно

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

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

Как тестировать сайт?

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


Стратегии тестирования также описывают, как риски снижаются на уровне тестирования, какие типы тестирования должны выполняться, и какие критерии входа и выхода применяются. Они создаются на основе разработки проектной документации. Проектные документы описывают функциональные возможности программного обеспечения, которое будет включено в следующем выпуске. Для каждого этапа разработки проекта должна быть создана соответствующая стратегия тестирования для тестирования новых наборов функций.
Продуманная стратегия тестирования становится основой для разработки более подробной документации, в частности, тест-плана. В первую очередь в построении стратегии принимают участие менеджер проекта и специалист контроля качества разработки, т. е. QA (quality assurance) или QC (quality control) специалисты.
Если говорить об основных правилах тестирования веб-сайтов, то можно сказать, что речь идет об обязательном прохождении нескольких этапов тестирования, которые обеспечивают полную работоспособность приложения, его бесперебойную и безопасную работу. Это важная часть веб-разработки, которая обеспечивает правильную работу приложения до его выпуска.
На определенных этапах тестирования веб-сайтов используются такие виды или типы тестирования, позволяющие в полной мере достичь поставленных целей тестирования. Цели могут быть разные, такие как проверка важных элементов: удобство использования безопасность, надежность, системы в общем, так и на проверку этих элементов после изменений, например, повторное тестирование.

Виды тестирования сайта


В настоящее время специалисты выделяют следующие основные виды тестирования сайта:
• Функциональное тестирование (Functionality testing)
• Тестирования удобства пользования (Usability testing)
• Тестирование интерфейса пользователя (UI testing)
• Тестирование производительности (Performance testing)
• Тестирование безопасности (Security testing)

Функциональное тестирование (Functionality testing)

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


Функциональное тестирование включает в себя:
· проверка работы всех ссылок: корректны ли они и не «биты»;
· проверка пользовательских форм. Например, при не заполнении обязательных полей пользователем в форме выводится сообщение об ошибке; поля заполняются по умолчанию и т.д.
· проверка кода HTML и CSS для облегчения сканирования сайта поисковыми системами;
· Тестирование workflow — точно ли каждый рабочий процесс отражает бизнес-процессы.
А также обязательна проверка отрицательных сценариев —при вводе пользователем некорректных данных должно отображаться сообщение об ошибке или справка.

Тестирование удобства пользования (Usability testing)

С помощью этого вида тестирования проверяются характеристики взаимодействия человека с компьютером с целью выявления недостатков для исправления. Основными характеристиками являются:
• Простота обучения.
• Навигация.
• Субъективное удовлетворение пользователя.
• Общий вид.
Другими словами можно сказать, что сайт должен быть прост в использовании и достаточно последователен; инструкции должны быть очень четкими; главное меню должно быть предоставлено на каждой странице; содержание должно быть логичным и простым для понимания.

Тестирование интерфейса пользователя (UI testing)

Оно определяется как процесс тестирования графического интерфейса пользователя тестируемого приложения. Тестирование UI включает проверку экранов с помощью элементов управления, таких как меню, кнопки, значки и все типы панелей — панель инструментов, строка меню, диалоговые окна, окна и т. д. Оно помогает ответить на такие вопросы:
• Как выглядит интерфейс?
• Удобно ли пользователю нажимать на кнопки?
• Понятны ли иконки, читабелен ли текст, формат, шрифт?
• Какие акценты в каких местах будут располагаться и к чему привлекать внимание?
Также при прохождении этого вида тестирования осуществляются проверки на совместимость с разными интернет браузерами и их версиями; как выглядит сайт при разных разрешениях экрана и на различных устройствах (смартфоны, планшеты).

Тестирование производительности (Performance testing)

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

Тестирование безопасности (Security testing)

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

Заключение

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

Необходимо тестирование сайта? Организуйте тендер на помощью Workspace.ru

Авто/Мото

Финансы, инвестиции, банки

Медицина

Недвижимость

Промышленность

Дизайн и Реклама

Торговля

Туризм и отдых

Услуги

Выставки, конференции

Города и страны

Культура и Искусство

Каталоги, рейтинги, поисковые системы

Компьютеры и интернет

Консалтинг

Мода и красота

Музыка

Некоммерческие, государственные организации

Нефть и газ

Наука

Одежда

Обучение

Работа

Развлечения

Программное обеспечение

Политика

Строительство и ремонт

Спорт

СМИ

Провайдеры, хостинг

Телекоммуникации

Электронная коммерция

Дом, семья

Мебель и интерьер

Потребительские товары

Оборудование

Транспортные услуги

Питание

Религия

30 онлайн-инструментов для тестирования и валидации сайтов

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

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

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

1. Checklink

Link Checker ищет проблемные ссылки на веб-странице, файлах CSS, или рекурсивно по всему Web-сайту. Для лучших результатов, рекомендуется сначала убедиться что код в документе валидный.

2. URL checker

InternetSupervision — служба, которая контролирует доступность HTML, FTP, SMTP, POP3, также контролирует производительность веб-сайта и транзакций электронной коммерции (включая формы веб-сайта) и обеспечивает контроль над контентом веб-сайта (в случае кибератаки).

3. Mobile checker

Это средство проверки выполняет различные тесты на Веб-странице, чтобы определить ее уровень мобильной совместимости. Тесты определены в mobileOK Basic Tests 1.0 specification. Веб-страница — mobileOK когда она проходит все тесты.

4. Unicorn

5. CSS validator

Этот валидатор показывает существующие ошибки в HTML с CSS или только в CSS, в зависимости от вашего выбора.

6. RSS Feed Validator

Этот сервис проверяет синтаксис Atoms или RSS feeds.

7. Accessibility with style

Сервис проверяет соответствие веб-страниц спецификации Web Content Accessibility Guidelines(WCAG 1.0).

8. Color contrast

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

9. WDG HTML Validator

The WDG HTML валидатор проверяет ваши страницы на налицие ошибок.

10. Dr. Watson’s site validation check

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

11. Robots checker

Этот инструмент проверяет ваш Robots.txt на валидность.

12. Firebug Firefox Extension

Firebug — это плагин для Firefox, который предлагает большие возможности для веб-разработки прямо в вашем браузере. Вы можете редактировать, отлаживать и мониторить CSS, HTML, и JavaScript «на лету» на любой веб-странице.

13. Load Impact

Load Impact — это онлайновая служба тестирования нагрузки.

14.
Accessibility-Checker

Это — средство проверки доступности, и оно проверяет соответствие веб-страниц согласно стандартам доступности.

15. Viewlike

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

16. Web Page Analyzer

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

17. Browser shots

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

18. FAE – Functional Accessibility Evaluator

Используйте этот инструмент, чтобы оценить функциональную доступность одной веб-страницы

19. Pingdom tools

Сервис проверяет время загрузки страниц Вашего сайта.

20. WebAIM Wave

 

21. Spoon Browser Sandbox

22. WebSitePulse Test Tools

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

23.
NetRenderer

Онлайн инструмент, который показывает как выглядит ваш сайт в  IE 6/7/5.5

24. YSlow

YSlow анализирует веб-страницы и предлагает способы улучшить их производительность, основанную на ряде правил для высоконагруженных веб-страниц. YSlow — дополнение Firefox, интегрированное с инструментом веб-разработки Firebug.

25. WebXM

Используйте этот Online Risk Management инструмент, чтобы проверить доступность, качество, конфиденциальность, безопасность и проблемы вашего веб-сайта.

26. Web Accessibility Inspector

Web Accessibility Inspector исследует доступность веб-сайта и указывает на любые важные проблемы.

27. Web page reports

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

28. Colour Contrast Analyser

Используйте W3C Colour Contrast алгоритм, чтобы проверить контрастность цветов на вашей странице.

29. ColorDoctor

 


Если у Вас возникли вопросы, то для скорейшего получения ответа рекомендуем воспользоваться нашим форумом

Зачем проводить тестирование сайта? Публикации CASTCOM

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

Цель тестирования

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

 

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

 

Особенности проверки

 

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

 

После тщательного анализа и сбора всех необходимых данных проводятся следующие виды тестов:

 

  • блочные, которые составляют разработчики для отдельных частей функционала, чтобы тестировать их в изолированном режиме;
  • интеграционные для проверки нескольких взаимодействующих функционалов, они имитируют действия реальных пользователей и отправляют отчет о проделанной работе;
  • функциональные для проверки работы всей системы, тест проверяет страницы целиком и подтверждает работу всех систем согласно прописанному ТЗ;
  • smoke-тесты для экспресс-проверки системы, они используются для самых простых и поверхностных проверок.

 

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

 

Способы тестирования

 

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

 

  1. Автоматическое тестирование

 

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

 

  1. Ручное тестирование

 

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

 

Результаты тестирования

 

В результате тестирования вы узнаете не только о том, какой функционал исправно работает на сайте, а какой имеет какие-то проблемы, но и получите следующие преимущества:

 

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

 

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

 

Качественная разработка сайтов любых типов — одна из главных услуг digital agency CASTCOM. Обращайтесь в агентство за веб-проектами любого уровня сложности.

Как тестировать сайт? Советы по комплексному тестированию площадки.

Для обеспечения корректного функционирования сайта его тестирование является обязательным. Однако, далеко не каждый представляет себе, насколько это сложный процесс. Приходится проверять в буквальном смысле каждый аспект созданной площадки. Можете не сомневаться в том, что недочёты обязательно будут выявлены. Безусловно, чем быстрее они будут устранены, тем лучше.

На сайте http://loaddy.com/ Вы сможете обеспечить тест для веб-площадки на нагрузочную способность. В особенности это актуально для сайтов, располагающих большой постоянной аудиторией посетителей. Дело в том, что при пиковых посещениях могут наблюдаться сбои в работе форм и отображении вёрстки отдельных страниц. Нагрузочное тестирование позволит выявить проблемы и при необходимости принять решение об устранении найденных проблем.

Комплексный подход к тестированию сайта

Тестирование практически любой современной площадки в сети состоит из следующих этапов:

  • оценка работоспособности функционала;
  • проверка корректности отображения и работы форм;
  • тест поиска;
  • тест гиперссылок и выявление «мёртвых» ссылок;
  • оценка скорости и корректности загрузки материалов на сайт;
  • проверка информации, предоставляемой счётчиками на сайте и т.д.

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

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

Этот недостаток также должен быть выявлен на стадии тестирования. Профессионалы поручают решение задачи фокус-группам.

Нагрузочное тестирование: сбои в пиковые посещения

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

Нередко для тестирования нагрузочной способности привлекаются дополнительные сервисы.

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

Смотрите также:

В видео рассказывается о последних этапах разработки веб-сайтов:

Твитнуть

Добавить комментарий

Юзабилити Тестирование Сайта — Plerdy

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

Команда Plerdy подготовила для Вас новый бесплатный вебинар — «Юзабилити сайта на примере Google & Apple сайтов». Видеозапись Вы можете посмотреть в этом видео. Присоединяйтесь к тем, кто уже успел посмотреть этот вебинар.

Объясняем суть юзабилити-тестирования сайтов на примере юзабилити городов

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

Повседневный Линьфэнь.

До 1978 года в Линьфэнье не было ни одной угольной шахты и город ассоциировался с местом плодов и цветов — правительство КНР ухаживало за городом и беспокоилась о местных жителях. Ниже показан вид города до загрязнения: чистый воздух, зелень и никаких намеков на катастрофу.

Одна из городских площадей Линьфэнья до 1978 года.

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

Бой на территории Вены в апреле 1945 года.

Поскольку правительство Австрии на первое место ставило интересы населения, в 2018 году Вена девятый раз подряд стала самым комфортным городом мира по версии исследовательского агентства «Mercer». С коллегами из «Mercer» согласны аналитики журнала «Economist», которые в 2018 году присвоили Вене статус самого привлекательного города в мире. Ниже показана современная архитектуру города.

Дневной вид на Вену.

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

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

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

Что такое юзабилити-тестирование

Юзабилити-тест — это комплексная проверка сайта на предмет его удобного визуального восприятия и правильной работы всех технических элементов. За удобство визуального восприятия отвечает UI-дизайн, а для проверки технических элементов используется аудит сайта. Давайте разбираться, как это связано.

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

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

Разница между UI и UX на примере бутылки с кетчупом.

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

Разница между UI и UX на примере пешеходных дорожек.

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

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

Варианты исследования пользовательского поведенияКомпоненты комплексного аудита веб-сайта
ИнтервьюТехнический аудит
Онлайн опросыАудит контента сайта
АнкетированиеПроверка семантического ядра
Дерево испытанийАудит целевой страницы
КарточкиПроверка работы аналитических служб
А/Б тестыСсылочный аудит
Создание персонАнализ конкурентов
Тест кликовПроверка качества внутренней оптимизации
Навигационный тестМаркетинговый аудит
Текст 5 секундАудит возможностей развития
Тестирование юзабилитиЮзабилити аудит

Пользовательская проверка или юзабилити — это связующее звено между UI-дизайном и аудитом веб-сайта. В UI-дизайне тестирование юзабилити помогает оценить удобство и практичность созданного сайта (вспоминаем кетчуп и дорожку). Пользовательский аудит помогает понять, какие у сайта технические проблемы и как их устранить, чтобы реализовать концепцию UI-дизайна. Из-за такой взаимосвязи тестирование юзабилити (UX-тест) и юзабилити аудит целесообразно объединить и считать частью одной комплексной проверки. Если же разграничить понятия, то достигнуть нужного результата не получится: никому не нужен нерабочий сайт или рабочий сайт с примитивным и непривлекательным дизайном.

На практике взаимосвязь между UI-дизайном, UX-тестом и юзабилити аудитом проявляется по следующей схеме:

  1. Сначала разработчики исследуют нишу, анализируют конкурентов, собирают материал и создают сайт по своему усмотрению. Это работает UI-дизайн.
  2. Далее сайт проверяется пользователями и на основе этой проверки улучшается исходный дизайн. Это работает UX-тест.
  3. На завершающей стадии спроектированный и протестированный сайт проверяется техническими специалистами. Эти специалисты делают так, чтобы все части UI-дизайна работали без ошибок. Это юзабилити-аудит.

Если сайт удобно спроектирован (в порядке UI-дизайн), нравится пользователям (в порядке UX-тест) и работает без ошибок (в порядке юзабилити-аудит), то есть высокая вероятность того, что он сможет выполнять свою полезную функцию.

Почему юзабилити-тестирование важно

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

1 $ вложенный в вопросы UX-тестирования возвращает обратно 100 $.

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

К чему приводит отсутствие юзабилити-тестов.

В сфере электронной коммерции обращаются триллионы долларов и из-за отсутствия обзоров пользовательского опыта 35% этих средств будут тратиться впустую.

Если же вместо аудита пользовательского интерфейса вы решите заказать дополнительную рекламу и проигнорируете мнение посетителей, то произойдет следующее:

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

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

UX-тесты упрощают проектирование сайта и позволяют его запускать в два раза быстрее.

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

Юзабилити-тест — это возможность возобновить неудачные стартапы.

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

Убытки интернет-магазинов из-за отсутствия юзабилити-тестов.

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

Как проверить юзабилити сайта: разбираем готовый кейс

Из этого раздела вы узнаете, что такое юзабилити-тестирование на примере. Мы проанализируем интернет-магазина wesco-shop.us и дадим рекомендации по его улучшению. Если планируете запускать Google Ads, заниматься SEO-продвижением или менять дизайн, то аналогичный анализ понадобится и вам. В одном из следующих разделов мы поговорим о том, как проверить юзабилити самостоятельно. Если вам некогда ждать — воспользуйтесь услугами специалистов.

Рекомендация №1 — Следите за правильностью категоризации товаров

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

Каталог продукции до проведения юзабилити-аудита.

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

Каталог продукции после проведения аудита: все товары перекрашены в красный цвет.

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

Рекомендация №2 — Некорректная работа скролла

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

Проблема с прокруткой.

На примере полоса прокрутки выглядит слишком жирной и отдаленной от правого края. Плюс она выполнена в том же цвете, что и продукция на странице. Это отвлекает от просмотра и усложняет процесс перемещение. Если прокрутку удалить — страница станет аккуратней.

Совет по редактированию кода.

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

Владелец сайта не воспользовался советом, не поправил код и не решил проблему с прокруткой.

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

Рекомендация №3 — Ошибка в верстке футера

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

Ошибка в подвале сайта.

Страница должна заканчиваться небольшим белым пространством. То есть после ссылки на соцсети и платежные системы не должно быть никаких отвлекающих элементов. Допускается форма вызова подписки «Sign Up» и еще можно добавить стрелку возврата к началу страницы.

Владелец сайта не воспользовался советом и не исправил ошибку в подвале сайта.

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

Рекомендация №4 — Придерживайтесь дизайна и выравнивание элементов

Три блока с рубриками съехали в левую сторону и не вписываются в общий макет страницы. Для исправления ситуации нужно достаточно в админку и правильно выставить настройки центрирования. Дело на три секунды.

Расположение рубрик до проведения юзабилити-аудита.

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

Расположение рубрик после проведения юзабилити-аудита: ошибка центрирования исправлена и блоки стоят ровно.

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

Рекомендация №5 — Придерживайтесь органических размеров элементов

Поле для комментариев нужно уменьшить и расположить в центре. Сейчас это поле выглядит слишком широким и неудобным.

Расположение поля для комментариев до проведения юзабилити-аудита.

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

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

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

Рекомендация №6 — Некорректная верстка изображения

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

Размер изображений до проведения юзабилити-аудита.

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

Рекомендация №7 — Исправьте изображение с 404 ошибкой

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

Битое изображение, обнаруженное в процессе проведения юзабилити-аудита.

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

После исправления ошибок размер изображений поправлен и все блоки выглядят одинаковыми. Вместо поврежденного изображения стоит блок-скидка SALE.

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

Рекомендация №8 — Удалите лишние исходящие ссылки

В форме отзывов присутствует ссылка «Powered by YOTPO» (работает на YOTPO). YOTPO — это специальный сервис, упрощающий работу с отзывами на сайте. Если ссылку не удалить, то она будет уводить часть трафика с сайта. Нам такое не нужно.

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

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

Владелец сайта ссылку не удалил.

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

Рекомендация №9 — Адаптируйте размеры элементов в мобильной версии

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

Ошибка в мобильной версии сайта.

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

Ошибка с размером исправлена и в мобильной версии сайта все элементы коллекции одинакового размера.

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

Смотрим сайт на планшете в горизонтальном положении. Все изображения отображаются корректно.

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

Смотрим сайт на планшете в вертикальном положении. Все изображения отображаются корректно.

Проверяем верстку на планшете и теперь смотрим сайт в горизонтальном положении. В одну строку по прежнему помещается четыре элемента и все смотрится аккуратно. Идем дальше.

Рекомендация №10 — Адаптируйте мобильную версию

В мобильной версии сайта не полностью открывается меню и нет ссылки на главную страницу.

Проблема меню в мобильной версии сайта.

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

Проблема осталась нерешенной.

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

Рекомендация №11 — Оптимизируйте размер картинок

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

Проблемы с размером изображений в одном из разделов каталога.

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

Обновленный вид страницы.

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

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

Этап №1. Сначала нужно сформулировать цели, гипотезы и задачи юзабилити-тестирования. Юзабилити-тестирование — это кропотливая исследовательская процедура, которую уместно проводить только в двух случаях: для профилактики и когда сайт не выполняет полезную функцию. Если тестирование проводится для профилактики, то цели, гипотезы и задачи можно свести к такой формулировке: правильно ли работает сайт и все ли элементы на нем корректно отображаются. В этом случае не понадобится ничего менять и дорабатывать, поскольку в случае какой-то проблемы будут только точечные правки.

Если сайт не выполняет полезную функцию, то здесь придется разграничивать понятие целей, гипотез и задач. Цель определяет проблему, ради решения которой проводится тестирование пользовательского сайта. Гипотезы помогает найти вероятную причину проблемы, а задачи помогают сформировать план по устранению этой причины. Чтобы было понятней — рассмотрим такой пример: владелец сайта провел сео-оптимизацию, купил рекламу, вывел сайт в ТОП-3 и Гугла, на 50% увеличил трафик и потерял 50% продаж. В такой ситуации понадобится юзабилити-тестирование с четкой постановкой целей, гипотез и задач.

Какова цель юзабилити-тестированияГипотезыЗадачи
Определить причину снижения продаж на 50% и понять, почему грамотная стратегия продвижения сайта привела к отрицательному результату.

1. Техническая неполадки.

2. Неправильная сео-оптимизация.

3. Проблемы в настройках рекламы.

4.Некачественный контент.

5. Умышленные действия конкурентов.

1. Провести технический аудит и определить возможный неисправности.

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

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

4. Пересмотреть блок и оценить качество опубликованных статей.

5. Проверить ютуб и тематические форумы на предмет отрицательных отзывов и критики.

Этап №2. Качественное пользовательское тестирование получится провести только в том случае, если сузить фокус и за один тест проверять по одной гипотезе. Если попробовать проверить все сразу, то вычислить настоящую причину проблемы будет проблематично. Вернемся к нашему примеру. После поверхностной проверки предложенных гипотез у нас такой результат: три проблемы не подтвердились, появилась одна очевидная проблема и одна гипотеза вызывает сомнения.

Неподтвержденные проблемыОчевидная проблемаГипотеза, нуждающаяся в дополнительной проверки
Умышленные действия конкурентов. Это гипотеза не подтвердилась потому, что инструменты тестирования юзабилити помогли быстро проанализировать популярные ресурсы на предмет негатива со стороны третьих лиц. Никакой активности не обнаружено.Некачественный контент. За контентное наполнение сайта отвечает три раздела: «Блог», «Карточки товаров» и «Новости».
В большинстве «Карточек товаров» нет описания, фото и видео. Есть только базовый перечень характеристик, которые сами по себе не рекламируют товар.
В разделе «Блог» мало публикаций. При этом каждая опубликованная статья написана с ошибками и не выполняет никакого полезного действия — не приносит пользу читателю.
В разделе «Новости» только корпоративная информация, которую не интересно изучать даже сотрудникам компании.
Техническая неполадки. На некоторых устройствах часть страниц медленно загружается и не отображается так, как это было в первоначальной верстке. Еще проблемы с видеороликами, которые не воспроизводятся на планшетах и смартфонах.
Проблемы в настройках рекламы. Рекламодатели дали обратную связь и подтвердили качество составленных объявлений.
Неправильная сео-оптимизация. Специалисты провели запросы, за счет которых статьи попадают в ТОП-3 Яндекса и Гугла. Все сделано правильно и продвижение проходит по нужным ключам.

Этап №3. Когда фокус на ключевых гипотезах определен — нужно сначала подобрать оптимальные методы юзабилити-тестирования, а после провести испытание на целевой аудитории. Перечислим популярные методы и применим их к нашим гипотезам:

  1. Коридорный метод тестирования — это когда небольшая группа пользователей поочередно проверяют возможности продукта или сайта, а модератор (организатор теста) фиксирует процесс через приложение для тестирования пользователей. Когда задание выполнено — действия пользователей анализируются и используются  для улучшения юзабилити.
  2. Удаленное тестирование пользователя — это когда модератор наедине беседует с респондентами (целевой аудиторией) и узнает информацию через скайп, телефон или другой способ связи. Далее беседы фиксируются и используется для переработки юзабилити.
  3. Дистанционное не моделируемое тестирование юзабилити — это когда пользователи не общаются с модератором и тестируются через специальную программы. В этой программе есть перечень заданий, который каждый из пользователей должен выполнить так, как он считает нужным. Например, можно попросить респондентов найти контактные данные владельца сайта. Когда задание составлено, модераторам остается зафиксировать возникающие проблемы и на их основе переработать сайт.
  4. Проведение А/Б тестов — это когда создается несколько версий продукта и пользователь может выбрать лучший вариант. Больше информации про А/Б тестирование читайте в статье про оптимизацию конверсии сайта.
  5. Экспертная оценка — это когда для анализа продукта привлекается квалифицированный специалист, способный без целевой аудитории обнажить все проблемные места. Например, если нужно проанализировать мебельный сайт, то для экспертной оценки подойдет опытный продавец мебели. Поскольку такой человек всю жизнь принимал заявки на мебель, то именно он может подсказать о тех нюансах, которые повысят показатели сайта.

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

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

Этап №4. После выбора подходящих гипотез подбираются лучшие инструменты тестирования юзабилити и проводится тест. После проведения теста возможны три варианта: гипотеза подтвердится, гипотеза не подтвердится и гипотеза подтвердится частично. В первом случае можно сразу переходить к исправлению ошибок. Во втором случае нужно пересмотреть цель юзабилити-тестирования и подготовить новые гипотезы. В третьем случае придется перепроверять новые гипотезы.

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

Этап №5. После устранения ошибок идет итоговое юзабилити-тестирование. По сути это повторный тест, который позволяет убедиться в правильности совершенных действий. Если после итогового тестирования никаких новых ошибок не возникнет, то все сделано правильно. Если ошибки появятся, то это повод вернуться на первый этап и повторить процедуру сначала. Итоговый тест бессмысленно игнорировать, поскольку без его проведения вы не узнаете, способен ли сайт выполнять полезную функцию. Нет итогового теста — нет результата.

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

Руководство по самостоятельному юзабилити-тестированию

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

Шаг№1. Перед тем, как сделать пользовательское тестирование, поработайте над исправлением типичных ошибок в дизайне юзабилити. Об этом у нас есть статья «ТОП-10 ошибок UX дизайна». Прочтите ее и внесите изменения на своем сайте.

Шаг №2. Пересмотрите предыдущий раздел и сформулируйте цель исследования. После этого подберите гипотезы и распишите под них задачи. Чтобы было проще работать — используйте бесплатные инструменты тестирования UX.

Шаг№3. Вы не будете знать, как провести юзабилити-тестирование сайта, если у вас не будет метрики по основным конверсионным показателям. То есть, если вы не знали эффективность сайта до проведения юзабилити-теста, то проведения теста и внесении корректировок ничего не даст. Вы не будете знать, стал ли сайт лучше или в срочном порядке нужно возвращать все назад (такое тоже бывает).

Шаг №4. Простой лайфхак: если не знаете, как проверить удобство использования сайта — спросите об этом свою аудиторию. Научитесь принимать обратную связь через отзывы, соцсети и комментарии на форумах. Прислушивайтесь к замечаниям пользователей и старайтесь внедрять все, что они рекомендуют.

Шаг №5. Посмотрите статью «20+ сайтов с ужасным юзабилити». Общая ошибка этих сайтов заключается в большом количестве акцентов: на одной странице располагается слишком много изображений, текста, кнопок и прочих элементов, отвлекающих от полезного действия. А теперь посмотрите статью «TOP-60 примеров сайтов ресторанов с крутым дизайном». На этих сайтах все аккуратно и заточено под целевое действие. Вывод: уменьшайте количество акцентов и думайте о целевом действии. В идеале на одной странице пользователь должен выполнять одно целевое действие.

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

Шаг №7. Привлекайте недорогих экспертов из оффлайн-бизнеса. Например, если у вас интернет-магазин электроники — найдите похожий магазин и пообщайтесь с продавцом-консультантом. Попробуйте выяснить, что интересует покупателей, на что они жалуются и что хотят получать. Если будет возможность — сами устройтесь на работу в этот магазин и наладьте контакт с целевой аудиторией. Изучите аудиторию — сможете провести идеальный юзабилити-тест.

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

В 2018 году смартфоны победили ноутбуки по показателю трафика и теперь 52% пользователей предпочитают мобильный интернет. Из-за этого юзабилити-исследования проводятся с помощью двух типов инструментов: одни инструменты понадобиться для проверки сайта на десктопных устройствах, а вторые необходимы для тестирование мобильного UX.

Статистика использования девайсов для выхода в интернет по состоянию на январь 2018 года.

Приложения для тестирования юзабилити веб-сайта

ПриложениеВозможные тесты
Google AnalyticsЭто многофункциональный счетчик от компании Google. С его помощью можно проанализировать посещаемость сайта, оценить поведение целевой аудитории и посмотреть источники перехода на сайт. Здесь же можно отследить те разделы и страницы, на которых пользователи проводят больше всего времени. Эти данные позволяют понять, с какой целью пользователи приходят на сайт, чем они интересуются, что им не нравится и при каких условиях можно рассчитывать на их повторное возвращение.
PageSpeed InsightsМожно узнать скорость страниц загрузки сайта на десктопных и мобильных устройствах. Тест дополняется ссылками на проблемные страницы и рекомендациями по оптимизации.
PlerdyМожно проанализировать поведения посетителей сайта с помощью тепловой карты кликов. Также с помощью Plerdy удобно проводить редизайн, улучшать опубликованный контент, анализировать призывы к действию, увеличивать показатели конверсии и выполнять прочие полезные задания.
AskUsersМожно напрямую связаться с целевой аудиторией и задать вопросы по работе сайта.
User TestingМожно протестировать сайт или приложение в дистанционном режиме: составляете техническое задание → определяете что нужно протестировать → активируете опцию таргетинга → настраиваете нужную целевую аудиторию → передаете задание пользователям User Testing → получаете юзабилити-тест с видео или аудио комментариями.
Usability ToolsМожно сделать видеозапись того, как пользователи ведут себя на сайте.
Usability HubМожно провести тест пяти секунд, тест кликов, вопросов, навигации и предпочтений.
Optimal WorkShopЭто комплексный инструмент, который определяет поведение пользователей по трем тестам: по тесту древа сайта (оценивается навигация), по методу сортировки карточек (оценивается пользовательское мышление на страницах сайта), по карте кликов (оценивается дизайн и привлекательность отдельных элементов сайта или отдельной страницы).
Fend-GUIМожно составить карту внимания и понять, в какой последовательности большинство пользователей изучают информацию на сайте или отдельной странице.

Приложения для мобильного юзабилити-теста

Приложения для UX-тестирования программного обеспеченияВозможные тесты
CrashlyticsМожно в режиме реального времени отслеживать пользовательские жалобы или системные ошибки, которые привели к сбою мобильного приложения.
AdjustМожно отслеживать востребованность программы в магазинах мобильных приложений, определять источники трафика, следить за различными конверсионными показателями, посчитать средний чек и анализировать действия пользователя на платформе.
AppsFlyerМожно оценивать эффективность запущенной рекламной кампании в интернете и по ТВ.
HockeyAppМожно проанализировать действия пользователя внутри приложения, своевременно устранить ошибки, собрать статистику и наладить обратную связь с посетителями платформы.
Sensor TowerЭто специальное приложение, которое помогает продвигать новые приложения в Google Play и App Store.
WoopraЭто приложение помогает интернет-магазинам настроить воронку продаж. С его помощью удобно собирать и систематизировать нужную информацию о зарегистрированных пользователях.
AmplitudeМожно в режиме реального времени следить за тем, как аудитория взаимодействует с готовым продуктом.
AppLyzerМожно сформировать семантическое ядро и отобрать только релевантные запросы.
ClicktaleМожно подготовить тепловую карту и отслеживать пользовательские клики.

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

Запомнить

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

  1. Тестирование юзабилити сайта — это комплексная процедура, которая оценивает сайт с позиции удобства и технической исправности.
  2. Чтобы провести полный обзор юзабилити сайта, нужно задействовать две дисциплины: UI-дизайн и аудит. UI-дизайн будет отвечать за визуальную часть и удобство, а за аудитом закрепляется проверка всей технических элементов.
  3. У UI-дизайн и аудит есть одно общее направлении — юзабилити-тестирование. Юзабилити-тест — это улучшения продукта посредством обратной связи с аторией: спрашиваете о проблеме → получите ответ → принимаетесь за исправление ситуации.
  4. Если не проводить юзабилити-тестирование, то любые действия по продвижению сайта будут неэффективными: 1 $ потраченный на проверку юзабилити — это 100 $ прибыли в будущем.
  5. Юзабилити-тестирование — это сложная многоэтапная процедура, проведением которой занимаются UX-агентства.
  6. Самостоятельно провести юзабилити-тест сложно. Для этого нужно правильно сформулировать цель, определить гипотезы, подготовить задачи и методы тестирования сайта. После нужно организовать сам тест, оценить результат, провести итоговый тест, снова оценить результат, перейти к исправлению ошибок и оценить изменения.
  7. С 2018 года большинство пользователей заходят в интернет через смартфоны, поэтому важно отдельно проводить юзабилити-тестирование для мобильных приложений.

Напишите в комментариях, что вы думаете о юзабилити-тестах: действительно ли это полезная штука или это очередной развод маркетологов?

Полное руководство по тестированию веб-приложений (Как протестировать веб-сайт)

Полное руководство по тестированию веб-приложений: как протестировать веб-сайт

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

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

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

Что такое веб-тестирование?

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

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

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

Дизайн и функциональность пользовательского интерфейса — главные составляющие тестирования веб-сайтов.

Контрольные списки для веб-тестирования

1) Тестирование функциональности
2) Тестирование удобства использования
3) Тестирование интерфейса
4) Тестирование совместимости
5) Тестирование производительности
6) Тестирование безопасности


Рекомендуемые инструменты для отработки концепций веб-тестирования, упомянутых на этой странице:

# 1) Кроссбраузерное тестирование

CrossBrowserTesting позволяет сделать любой веб-опыт идеальным в любом браузере или мобильном устройстве с помощью облачной лаборатории реальных устройств.Откажитесь от виртуальных машин и лаборатории устройств. Легко запускайте ручные, визуальные тесты и тесты Selenium в облаке в более чем 2050 реальных настольных и мобильных браузерах.


# 2) LoadNinja

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


# 3) LambdaTest

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

Платформа

LambdaTest помогает обеспечить бесперебойную визуализацию элементов вашего веб-приложения (например, JavaScript, CSS, HTLM5, видео и т. Д.) На любом настольном и мобильном веб-браузере с поддержкой ручного, визуального и автоматического тестирования. С LambdaTest вы можете получить доступ к более чем 2000 комбинациям настольных и мобильных браузеров в облаке.


# 1) Тестирование функциональности

Test for — все ссылки на веб-страницах, соединение с базой данных, формы, используемые для отправки или получения информации от пользователя на веб-страницах, тестирование файлов cookie и т. Д.

Ознакомьтесь со всеми ссылками:

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

Тестовые бланки на всех страницах:
Бланки являются неотъемлемой частью любого веб-сайта.Формы используются для получения информации от пользователей и взаимодействия с ними. Итак, что нужно проверять в этих формах?

  • Сначала проверьте все проверки в каждом поле.
  • Проверить значения по умолчанию в полях.
  • Неправильные вводы в формах в поля форм.
  • Опции для создания форм, если таковые имеются, удаление форм, просмотр или изменение форм.

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

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

Тестирование файлов cookie:

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

Перед записью на компьютер пользователя проверьте, зашифрованы ли файлы cookie. Если вы тестируете файлы cookie сеанса (т.е. файлы cookie, срок действия которых истекает после завершения сеанса), проверьте сеансы входа в систему и статистику пользователя после завершения сеанса. Проверьте влияние на безопасность приложения, удалив файлы cookie. (Скоро напишу и отдельную статью о тестировании файлов cookie)

Проверьте свой HTML / CSS:

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

Тестирование базы данных:

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

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

При тестировании работоспособности веб-сайтов необходимо проверить:

Ссылки
i. Внутренние ссылки
ii. Внешние ссылки
iii. Почтовые ссылки
iv. Неработающие ссылки

Формы
i. Полевая проверка
ii. Сообщение об ошибке при неправильном вводе
iii. Необязательные и обязательные поля

База данных
Будет проведено тестирование целостности базы данных.

# 2) Тестирование удобства использования

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

• Простота обучения
• Навигация
• Субъективное удовлетворение пользователей
• Общий вид

Тест по навигации:

«Навигация» означает, как пользователь просматривает веб-страницы, различные элементы управления, такие как кнопки, поля или как пользователь использует ссылки на страницах для просмотра различных страниц.

Юзабилити-тестирование включает в себя следующее:

  • Веб-сайт должен быть простым в использовании.
  • Предоставленные инструкции должны быть очень четкими.
  • Убедитесь, что предоставленные инструкции соответствуют его назначению.
  • Главное меню должно быть представлено на каждой странице.
  • Он должен быть достаточно последовательным.

Проверка содержимого:

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

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

Контент должен быть содержательным. Все ссылки якорного текста должны работать правильно. Изображения должны быть правильно размещены и иметь надлежащие размеры.

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

Другая информация для пользователей:

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

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

# 3) Тестирование интерфейса

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

Основные интерфейсы:

  • Веб-сервер и интерфейс сервера приложений
  • Сервер приложений и интерфейс сервера базы данных.

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

Проверьте, что произойдет, если пользователь прервет любую промежуточную транзакцию? Проверьте, что произойдет, если соединение с веб-сервером будет сброшено между ними?

# 4) Тест на совместимость

Совместимость вашего сайта — очень важный аспект тестирования. Посмотрите, какой тест совместимости нужно выполнить:

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

Совместимость с браузером:

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

Кодировка вашего веб-сайта должна быть совместима с кросс-браузерной платформой. Если вы используете java-скрипты или вызовы AJAX для функциональности пользовательского интерфейса, выполняя проверки безопасности или валидации, тогда уделяйте больше внимания тестированию вашего веб-приложения на совместимость с браузером.

Тестируйте веб-приложения в различных браузерах, таких как Internet Explorer, Firefox, Netscape Navigator, AOL, Safari, Opera с разными версиями.

Совместимость с ОС:

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

Следовательно, протестируйте свое веб-приложение в различных операционных системах, таких как Windows, Unix, MAC, Linux, Solaris, с разными версиями ОС.

Мобильный просмотр:

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

Параметры печати:

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

# 5) Тестирование производительности

Веб-приложение должно выдерживать большую нагрузку.Веб-тестирование производительности должно включать:

  • Веб-нагрузочное тестирование
  • Веб-стресс-тестирование

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

Web Load Testing : Вам необходимо проверить, много ли пользователей обращаются к одной и той же странице или запрашивают ее. Может ли система выдержать пиковые нагрузки? Сайт должен обрабатывать множество одновременных запросов пользователей, большие входные данные от пользователей, одновременное подключение к БД, большую нагрузку на определенные страницы и т. Д.

Веб-стресс-тестирование: Обычно стресс означает выход системы за пределы установленных пределов. Веб-стресс-тестирование проводится для того, чтобы сломать сайт, создавая стресс, и проверяется, как система реагирует на стресс и как она восстанавливается после сбоев. Акцент обычно делается на полях ввода, областях входа и регистрации.

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

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

Скорость соединения
Протестировано в различных сетях, таких как Dial-Up, ISDN и т. Д.

Нагрузка
i. Что за нет. пользователей за раз?
ii. Проверьте пиковые нагрузки и поведение системы
iii. Большой объем данных, к которым обращается пользователь

Напряжение
i.Непрерывная нагрузка
ii. Производительность памяти, процессора, обработки файлов и т. Д.

# 6) Тестирование безопасности

Ниже приведены некоторые из тестовых примеров для тестирования веб-безопасности:

  • Протестируйте, вставив внутренний URL-адрес прямо в адресную строку браузера без входа в систему. Внутренние страницы открываться не должны.
  • Если вы вошли в систему, используя имя пользователя и пароль и просматриваете внутренние страницы, попробуйте изменить параметры URL напрямую. Т.е. Если вы проверяете статистику сайта издателя с идентификатором сайта издателя = 123.Попробуйте напрямую изменить параметр URL-адреса сайта на другой идентификатор сайта, не связанный с вошедшим в систему пользователем. Этому пользователю следует запретить доступ к статистике других людей.
  • Попробуйте ввести неверные данные в поля ввода, например имя пользователя, пароль, текстовые поля ввода и т. Д. Проверьте реакцию системы на все недопустимые вводы.
  • Веб-каталоги и файлы не должны быть доступны напрямую, если им не предоставлена ​​опция загрузки.
  • Протестируйте CAPTCHA для автоматизации входа в скрипт.
  • Проверить, используется ли SSL для мер безопасности. Если используется, соответствующее сообщение должно отображаться, когда пользователи переключаются с незащищенных страниц HTTP: // на защищенные страницы HTTPS: // и наоборот.
  • Все транзакции, сообщения об ошибках и попытки взлома должны регистрироваться в файлах журнала где-нибудь на веб-сервере.

Основная причина тестирования безопасности сети — выявление потенциальных уязвимостей и последующее их устранение.

  • Сетевое сканирование
  • Сканирование уязвимостей
  • Взлом пароля
  • Просмотр журнала
  • Средства проверки целостности
  • Обнаружение вирусов

Типы веб-тестирования

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

  • Простое статическое тестирование сайта
  • Динамическое тестирование веб-приложений
  • Тестирование веб-сайта электронной коммерции
  • Тестирование мобильного сайта
# 1) Простой статический веб-сайт

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

Тестировать простой статический веб-сайт очень просто, вам нужно учитывать только несколько вещей при тестировании. Некоторые из них упомянуты ниже:

Следует помнить:

# 1) Тестирование дизайна графического интерфейса необходимо, потому что статический веб-сайт полностью зависит от него.Вам необходимо сравнить утвержденные файлы PSD с разработанной веб-страницей. Проверить, что все элементы в дизайне должны быть представлены на разрабатываемой странице.

# 2) Другая часть дизайна графического интерфейса — проверка размера шрифта, стиля шрифта, интервала и цвета, все было воспроизведено.

[Это изображение объясняет проблему выравнивания интервалов в представлении веб-сайта на рабочем столе.]

# 3) Во-вторых, вам нужно проверить ссылки (ссылки на страницы), чтобы убедиться, что он работает правильно или нет.Также узнать, есть ли неработающая ссылка?

# 4) Проверьте орфографию и содержимое на всех веб-страницах, сравнив содержимое, предоставленное клиентом.

# 5) В некоторых случаях изображение не будет отображаться должным образом, оно может сломаться, а иногда изображение дублируется, могут отображаться неправильные изображения. Это нужно тщательно проверять. Потому что для статичного веб-сайта только контент и изображения могут дать жизнь.

# 6) Внимательно проверьте полосу прокрутки, и по моему опыту я столкнулся с проблемами с полосой прокрутки.Проблема, с которой вы столкнетесь, — это появление нежелательной прокрутки или скрытие прокрутки (это может скрыть содержимое). Вышеупомянутые проблемы применимы как к горизонтальной, так и к вертикальной прокрутке.

# 7) Если есть контактная форма, проверьте ее правильность, отправив несколько фиктивных сообщений.

Что нужно проверить в контактной форме:

  • Правильно ли отправляется сообщение и появляется сообщение об успешном завершении?
  • Проверить, получено ли электронное письмо заинтересованному лицу в надлежащем формате, как задумано?
  • Проверить, что электронная почта не должна попадать в спам как нежелательная почта?
  • Если активирован триггер ответного электронного письма, то проверьте, получил ли отправитель письмо?

# 8) Проверьте, является ли веб-страница безошибочной, и подтвердите ее с помощью валидатора W3 или другого связанного программного обеспечения.

# 9) Некоторые постоянные вещи, которые нужно проверять на статическом сайте,

  • Проверить наличие значка на панели вкладок
  • URL должен содержать правильный заголовок страницы
  • Если есть информация об авторских правах, она должна отображаться
  • Если есть контактная форма, капча обязательна. [Предотвращает нежелательную почту]
  • Проверить скорость загрузки сайта. [Статический веб-сайт не должен долго загружаться]. Если при загрузке используется изображение в формате gif, то отслеживать его работоспособность

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

# 2) Динамическое веб-приложение [Веб-сайт CMS]

Это тип, при котором пользователь может регулярно обновлять и изменять содержимое своего веб-сайта. Отсюда я собираюсь использовать слово «тестирование веб-приложений» вместо динамического тестирования веб-сайтов. Веб-приложение представляет собой комбинацию внешнего и внутреннего программирования .

Интерфейсная часть будет HTML и CSS, тогда как внутренняя часть использует языки программирования, такие как PHP, Javascript, ASP и т. Д. С помощью этого внутреннего интерфейса пользователь / клиент может добавлять или изменять контент на веб-сайте.

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

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

Следует помнить:

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

# 1) В разделе GUI всплывающая подсказка является обязательной для всех полей и кнопок, выравнивание полей (интервал) должно быть выполнено правильно, отключенные поля / кнопки должны быть затенены, поля / кнопки должны быть в стандартном формате как и в SRS, сообщение об ошибке должно отображаться, если что-то пойдет не так, всплывающее сообщение должно отображаться только в центре веб-страницы, раскрывающееся меню не должно быть усечено.

Сочетание клавиш Tab должно работать во всех полях и не только.

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

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

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

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

# 3) Веб-сайт электронной коммерции

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

В разделе GUI нужно проверить все функции, как в SRS, и то же самое с функциональностью. Функциональность будет практически одинаковой для всех коммерческих сайтов.

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

Следует помнить:

# 1) Проверьте, обновляется ли корзина покупок при покупке или увеличении количества.Проверьте эту функциональность на всех страницах и при любых обстоятельствах.

# 2) Проверьте, применяются ли специальные купоны и предложения к правильным заказам. , и вы видите, отображается ли цена со скидкой или нет.

[Это изображение объясняет, что такое бесплатная доставка и как она применяется в разделе оплаты]

# 3) Иногда при обновлении одного продукта он умножается на количество вариаций в продукте.Поэтому проверьте, отображается ли отдельный продукт и правильно ли отображаются его варианты. (Столкнулся с этой проблемой)

# 4) Проверьте, правильно ли работает опция фильтра. Если фильтрация выполняется на основе выбранной категории и цены?

# 5) При регистрации необходимо провести супер-валидацию. Только новый пользователь может зарегистрироваться.

# 6) Если существующий пользователь добавил продукт в корзину, раздел списка желаний при предыдущем входе в систему должен быть сохранен и отображаться при следующем входе в систему.

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

# 8) Проверьте исправность конвертера валют. В зависимости от выбранной страны конвертер валют должен отображать соответствующие цены и налоговые ставки.

[При выборе языка валюта будет конвертирована, здесь по умолчанию используется доллар США]

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

# 10) Проверьте, работает ли опция социального обмена для отдельного продукта или нет.

# 11) Стоимость доставки должна определяться в зависимости от выбранного региона. А также проверьте формирование налоговой ставки. (Это может вызвать некоторые юридические проблемы при покупке конечным пользователем).

[На этом изображении стоимость доставки и налогов рассчитана для региона Франции]

# 12) Платежный шлюз должен работать только в том случае, если указаны данные действующей карты.Подтверждение должно применяться к номеру карты и номеру кода CCV. [Лучше оставить валидацию в самом поле номера карты].

# 13) Генерация электронной почты для каждого процесса во время покупки должна происходить (регистрация, заказ продукта, успешный платеж, отменен, заказ получен и другие триггеры электронной почты, если таковые имеются).

# 14) Проверьте чат с помощью пустых писем.

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

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

# 4) Мобильный сайт

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

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

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

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

Следует помнить:

Важные моменты, которые следует учитывать при тестировании мобильного сайта:

  • Обычно мы используем эмулятор для тестирования мобильного веб-сайта, и мы можем получить идеальные результаты, но я всегда предпочитаю, чтобы вы тестировали на реальных устройствах. Я столкнулся со многими проблемами при тестировании на реальных устройствах [особенно на устройствах Apple].Настоящие характеристики устройства могут противоречить разработанным веб-страницам.

[Это изображение объясняет тестирование симулятора и возникающую в нем проблему с обратной связью.]

  • Графический интерфейс и тестирование удобства использования более важны, поскольку они не являются отражением настольной версии.
  • Производительность — еще один важный фактор, который следует учитывать при тестировании мобильного сайта. Проблемы, связанные с производительностью, можно отслеживать при тестировании на реальных устройствах.
  • Проверьте, не запускается ли просмотр обычных веб-ссылок с мобильного устройства по мобильной ссылке.
  • Проверьте прокрутку страниц, навигацию по страницам, усечение текста и т. Д. На мобильном веб-сайте.

Лучшие инструменты для веб-тестирования

Существует широкий спектр инструментов тестирования, доступных для тестирования веб-приложений.

=> Ознакомьтесь с полным списком самых популярных инструментов для тестирования веб-приложений.

баллов, учитываемых при тестировании веб-сайта

Веб-сайты, по сути, представляют собой клиент-серверных приложений — с веб-серверами и клиентами «браузера».

Следует учитывать взаимодействие между HTML-страницами, связью TCP / IP, подключениями к Интернету, брандмауэрами, приложениями, которые выполняются на веб-страницах (например, апплеты, javascript, подключаемые модули) и приложениями, которые выполняются на сервере. -side (например, сценарии CGI, интерфейсы баз данных, приложения для ведения журналов, генераторы динамических страниц, asp и т. д.).

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

Примеры тестовых сценариев для тестирования веб-приложения

Несколько других соображений, которые следует учитывать при тестировании веб-сайта, приведены ниже .

  • Какова ожидаемая нагрузка на сервер (например,g., количество совпадений в единицу времени)?
  • Какая производительность требуется при каждом условии нагрузки (например, время ответа веб-сервера, время ответа на запрос базы данных)?
  • Какие инструменты потребуются для тестирования производительности (например, инструменты веб-нагрузочного тестирования, другие инструменты, уже имеющиеся в компании, которые можно адаптировать, инструменты загрузки веб-роботов и т. Д.)?
  • Кто целевая аудитория? Какие браузеры они будут использовать? Какие скорости подключения они будут использовать? Являются ли они внутриорганизационными (вероятно, с высокими скоростями подключения и аналогичными браузерами) или общими в Интернете (следовательно, с широким разнообразием скоростей подключения и типов браузеров)?
  • Какая производительность ожидается на стороне клиента (например, на стороне клиента).g., как быстро должны отображаться страницы, как быстро должны загружаться и запускаться анимации, апплеты и т. д.)?
  • Будет ли допущен простой из-за обслуживания / обновлений сервера и содержимого? Если да, то сколько?
  • Какой вид безопасности (брандмауэры, шифрование, пароли и т. Д.) Потребуется и что он должен делать? Как это можно проверить?
  • Насколько надежным должно быть интернет-соединение сайта? И как это повлияет на требования и тестирование системы резервного копирования или избыточного подключения?
  • Какой процесс потребуется для управления обновлениями содержания веб-сайта?
  • Каковы требования к обслуживанию, отслеживанию и контролю содержимого страницы, графики, ссылок и т. Д.?
  • Какая спецификация HTML будет соблюдаться? Насколько строго? Какие варианты будут разрешены для целевых браузеров?
  • Будут ли какие-либо стандартные требования к внешнему виду страницы и / или графике по всему сайту или его частям ??
  • Как будут проверяться и обновляться внутренние и внешние ссылки? И как часто? это случится?
  • Можно ли проводить тестирование в производственной системе или потребуется отдельная система тестирования?
  • Как следует учитывать при тестировании кеширование браузера, вариации в настройках опций браузера, изменчивость коммутируемого соединения и реальные проблемы с «перегрузкой трафика» в Интернете?
  • Насколько обширны или настроены требования к ведению журнала и отчетности сервера; считаются ли они неотъемлемой частью системы и требуют ли они тестирования?
  • Как работают программы CGI, апплеты, JavaScript, компоненты ActiveX и т. Д.для обслуживания, отслеживания, контроля и тестирования?
  • Страницы должны быть максимум 3-5 экранов, если контент не сосредоточен на одной теме. Если больше, укажите внутренние ссылки на странице.
  • Макеты страниц и элементы дизайна должны быть единообразными по всему сайту, чтобы пользователю было ясно, что они все еще находятся на сайте.
  • Страницы должны быть максимально независимыми от браузера, либо страницы должны предоставляться или создаваться в зависимости от типа браузера.
  • Все страницы должны иметь внешние ссылки по отношению к странице; не должно быть тупиковых страниц.
  • На каждой странице должны быть указаны владелец страницы, дата редакции и ссылка на контактное лицо или организацию.

Часто задаваемые вопросы о веб-тестировании

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

  • Работает ли веб-сайт должным образом?
  • Сможет ли конечный пользователь легко просматривать веб-сайт?
  • Доступен ли веб-сайт на различных устройствах конечных пользователей?
  • Достаточно ли защищен сайт?
  • Насколько хорошо работает сайт?
  • Точно ли данные, введенные на веб-сайт, сохраняются и сохраняются во время сеансов?
  • Хорошо ли интегрирован веб-сайт с другими интерфейсами в рабочем процессе?
  • Будет ли веб-сайт работать должным образом даже после запуска?

Чтобы ответить на эти вопросы, были определены различные методы тестирования, которые можно использовать для тестирования веб-приложений.

Давайте возьмем пример веб-сайта электронной коммерции, который недавно был передан команде QA для тестирования.

Мы подробно рассмотрим каждый из указанных выше вопросов, чтобы понять объем теста и увидеть, как можно проводить тестирование веб-сайта.

Веб-сайт работает должным образом?

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

Ниже приведены несколько общих сценариев, которые, как ожидается, охватит QA при выполнении функционального тестирования любого веб-сайта, даже если они не упомянуты в функциональных спецификациях:

  • Переход пользователя на разные страницы веб-сайта и выполнение сквозного рабочего процесса
  • Если пользователь может устанавливать / снимать флажки
  • Если пользователь может выбирать значения из полей раскрывающегося списка
  • Если пользователь может выбрать / отменить выбор радиокнопок
  • Различные кнопки навигации, такие как «Отправить», «Далее», «Загрузить» и т. Д.кнопки работают хорошо
  • Календари загружаются правильно и позволяют пользователю выбрать дату
  • Расчеты выполняются в соответствии с выполнением
  • Функция поиска работает, если есть
  • Отображение правильной информации
  • Различные внутренние и внешние ссылки на другие страницы
  • Правильный порядок табуляции полей на веб-страницах
  • Обязательные и необязательные поля должны быть проверены на наличие положительных и отрицательных входов
  • Необходимо проверить значения по умолчанию для каждого веб-поля
  • Функциональность электронной почты реализована для некоторых действий на сайте

Важно, чтобы веб-сайты были совместимы с поисковыми системами.Следовательно, мы должны проверять веб-сайты на предмет правильности синтаксиса HTML, формата и стандартов соответствия, таких как WS-I, ISO и ECMA.

Что касается файлов cookie, которые используются для поддержания сеансов входа в систему, веб-сайт следует протестировать, включив / отключив файлы cookie или используя несовпадающий домен. Тестирование также можно проводить между сеансами, сбросив файлы cookie, чтобы вернуть браузеры в исходное состояние.

QA также должен проверить, что файлы cookie веб-сайтов всегда хранятся локально в зашифрованном формате.

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

Аналогичным образом, различные функции, такие как вход, регистрация, параметры поиска, фильтры, порядок сортировки, добавление в корзину и т. Д., Должны быть проверены на разных веб-страницах, таких как страница входа, страница регистрации, страница сведений о продукте, корзина для покупок, просмотр заказа, оплата. , так далее.Веб-сайт должен быть проверен на предмет управления сеансом / файлами cookie, например истечением срока действия сеанса, хранением сеанса и т. Д.

Сможет ли конечный пользователь легко просматривать веб-сайт?

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

Ниже приведены некоторые из тестовых сценариев, которые следует проверить при выполнении тестирования удобства использования для веб-сайта:

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

Некоторые инструменты, которые можно использовать для тестирования удобства использования, — это User Zoom и Reflector.

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

Принимая во внимание увеличение количества интерфейсов на основе сенсорных экранов, нам необходимо проверить доступность как клавиш, так и сенсорных экранов. Точно так же изображения и контент веб-сайта должны быть проверены на удобство использования на экранах разных размеров (мобильные телефоны, ноутбуки, вкладки и т. Д.).

Доступен ли веб-сайт на различных устройствах конечных пользователей?

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

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

Совместимость браузеров (кроссбраузерное тестирование):

Веб-сайт должен хорошо работать с различными браузерами, такими как Microsoft Internet Explorer, Microsoft Edge, Firefox, Google Chrome, Safari и Opera.Все активные версии этих браузеров должны быть проверены с включением / выключением различных функций браузера.

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

Совместимость с операционной системой (кроссплатформенное тестирование):

Чтобы определить потенциальные проблемы взаимодействия с пользователем, веб-сайт следует протестировать на различных платформах, таких как Windows, Linux, Unix.MAC, Solaris и т. Д., Чтобы убедиться в совместимости с ОС.

Совместимость устройств (тестирование между устройствами):

Веб-сайт можно просматривать с различных устройств, таких как ноутбуки, мобильные телефоны, планшеты и т. Д., С различными доступными ОС, такими как iOS, Android, Windows и т. Д. Следовательно, на устройствах также следует проводить тестирование с учетом следующих сценариев.

  • Размер экрана веб-сайта должен регулироваться в соответствии с устройством
  • Устройство должно иметь возможность поворота экрана
  • На веб-сайте не должно быть проблем с загрузкой на разных устройствах с разной скоростью сети
  • Проверить поведение веб-сайта, когда устройство находится в / вне диапазона сети
  • Проверить поведение веб-сайта при низком уровне ЦП и памяти для поддержки различных форм-факторов

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

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

Достаточно ли защищен сайт?

Тестирование безопасности проводится для выявления уязвимостей в системе и обеспечения безопасности веб-сайта.

Ниже приведен контрольный список, который можно проверить при выполнении тестирования безопасности:

  • Веб-сайт должен быть доступен только авторизованным пользователям
  • Пользователи веб-сайта должны иметь возможность выполнять только те задачи, для которых они авторизованы
  • Веб-сайт должен быть проверен на наличие полей CAPTCHA для идентификации пользователя
  • Необходимо проверять настройки безопасности браузера при переходе с защищенных страниц на небезопасные
  • Защита веб-сервера должна быть предусмотрена для недоступных веб-каталогов или файлов
  • Убедитесь, что файлы с ограниченным доступом не должны загружаться без соответствующего доступа
  • Сессии, которые стали неактивными, должны автоматически завершаться через определенный период времени
  • Все недействительные и несанкционированные попытки конечных пользователей или периодические системные ошибки / сбои должны регистрироваться для целей анализа.

Инструменты, такие как Vulnerability Management, Veracode и SQL Map, можно использовать для тестирования безопасности вашего веб-сайта.

В рамках тестирования безопасности веб-сайт электронной коммерции должен быть проверен на соответствие

  1. Контроль доступа к веб-сайтам.
  2. Любая утечка личной информации пользователя.
  3. Безопасные способы оплаты.
Насколько эффективен сайт?

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

Веб-сайт можно протестировать на нагрузку и стресс.

Ниже приведен контрольный список для веб-тестирования производительности:

  • Поведение веб-сайта должно соблюдаться при нормальной и пиковой нагрузке
  • Производительность веб-сайта следует проверять путем измерения времени отклика, скорости, масштабируемости и использования ресурсов.
  • Правильный RCA (анализ первопричин) должен выполняться с решением, если система выходит из строя или становится нестабильной в любой момент времени
  • Необходимо выявить проблемы с задержкой в ​​сети, если таковые имеются.

Веб-сайт электронной коммерции должен быть тщательно протестирован с использованием набора смоделированных пользователей в нормальных условиях, а также в условиях пиковой нагрузки, которые могут быть во время «сезона распродаж».

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

На рынке доступны различные инструменты для тестирования производительности. Немногие из них: LoadRunner, WinRunner, Silk Performer, JMeter и т. Д.

Точно ли данные, введенные на веб-сайт, сохраняются и сохраняются во время сеансов?

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

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

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

1) Размещение заказа на товар.

2) Аннулирование продукта.

3) Выберите обмен на продукт.

4) Согласие на возврат продукта.

Хорошо ли интегрирован веб-сайт с другими интерфейсами в рабочем процессе?

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

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

Будет ли веб-сайт работать должным образом даже после запуска?

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

При проверке продукта в производстве можно рассмотреть следующие сценарии:

  • Тесты веб-приложений должны выполняться периодически, а журналы тестов должны сохраняться в качестве подтверждения соответствия Соглашения об уровне обслуживания (SLA)
  • Необходимо проверить системы автоматического масштабирования и балансировщики нагрузки, если они установлены и функционируют.
  • Следите за опытом конечных пользователей и попытайтесь выявить дефекты или вредоносные атаки, которые обычно остаются незамеченными во время тестирования QA
  • Отслеживать время отклика продукта при пиковых нагрузках
  • Выполнение тестовых примеров пограничного уровня в режиме реального времени для выявления сбоев в сети, сбоев подключения или прерывания из-за неожиданного вызова

Заключение

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

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

Надеюсь, эта статья была для вас информативной!

Как протестировать сайт перед запуском: контрольный список из 28 пунктов

Три года назад Марк Ноулз составил подробный контрольный список для тестирования веб-сайта перед его запуском в реальном времени.Это было очень полезное руководство, поэтому мы решили обновить его с учетом текущего цифрового ландшафта.

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

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

Для редактора и писателей…

1. Орфография, грамматика, пунктуация

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

2. Формы

Заполните формы на сайте и ответьте на следующие вопросы:

  • Можно ли улучшить расход?
  • Вы застряли?
  • Насколько точны инструкции?
  • Отправляется ли заполненная форма нужным людям или нужным людям?

3.Проверить изображения

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

4. Контекст

Если критически относитесь к страницам сайта, спросите:

  • Почему я должен посетить эту страницу?
  • Готово ли содержание для посетителей?
  • Обращается ли страница к аудитории?

Для веб-дизайнера

5.Скорость сайта

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

6. Удобство работы с мобильными устройствами

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

7. Совместимость

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

8. Шрифты

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

9. Навигация

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

Убедитесь, что ваш поиск на сайте работает и дает точные результаты, а если есть какие-либо нулевые результаты, вы обеспечиваете навигацию на другие релевантные страницы.

Для веб-разработчиков

10.Действующие URL-адреса

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

На небольших сайтах без каких-либо инструментов вы можете перейти на каждую страницу, чтобы убедиться, что все они работают. На сайте с менее чем 500 URL-адресами вы можете бесплатно использовать Screaming Frog SEO Spider Tool для поиска плохих URL-адресов. Для более крупных сайтов существует небольшая годовая плата.

11. Зарегистрируйтесь в Google Search Console

Google Search Console (ранее — Инструменты для веб-мастеров) — бесценный инструмент для всех веб-мастеров. Здесь Google свяжется с вами, если что-то пойдет не так (ошибки сканирования, ручные штрафы, увеличение количества страниц 404, обнаружение вредоносных программ и т. Д.)

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

Вам также следует зарегистрироваться в Bing Webmaster Tools.

12. Минимизировать

Это метод, который объединяет и сжимает код веб-сайта на более мелкие фрагменты для ускорения вашего сайта. Вы можете прочитать об этом в Google. Затем посмотрите на предварительный запуск веб-сайта, чтобы узнать, использует ли сайт minify там, где это возможно.

13. 404 стр.

При возникновении ошибки 404 («страница не найдена») убедитесь, что у вас есть настраиваемая страница, чтобы помочь посетителю найти что-то еще полезное, даже если это не то, что они искали.У вас есть карта сайта в формате HTML? Включает ли страница 404 поиск по сайту?

14. Favicon

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

Для команды SEO

15. 301 Перенаправляет

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

Упомянутый ранее паук Screaming Frog может работать как на старом, так и на новом сайте. Электронная таблица Excel — отличный способ задокументировать эти усилия. Столбец A содержит старый URL-адрес, и вы помещаете новый URL-адрес в столбец B. Каждая строка представляет собой перенаправление со старого на новый. В день запуска пора выполнять.

16.Теги заголовка / метаданные

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

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

17. XML-файлы Sitemap / HTML-файлы Sitemap

Убедитесь, что на вашем новом веб-сайте есть точная карта сайта в формате XML и HTML.Вы можете загрузить свою карту сайта в Search Console, однако большинство CMS, таких как WordPress, автоматически создадут карту сайта для вас.

18. Аналитика

Убедитесь, что Google Analytics или пакет аналитики, который вы используете, настроены и готовы к работе с первого дня, чтобы вы могли измерять и анализировать трафик на свой сайт.

19. Структурированная разметка

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

20. Ускоренные мобильные страницы

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

21. Интеграция с социальными сетями

Иконки социальных сетей на сайте переходят на нужные страницы? Установлены ли у вас правильные кнопки и социальные плагины для того, что вы пытаетесь выполнить и что вы хотите, чтобы пользователь мог делать? (Например, он «поделится постом», а не «лайкнет» вашу страницу в Facebook.)

22. Отображение результатов поиска

Правильно ли поисковые системы отображают ваши страницы на страницах результатов поисковой системы? Вы написали правильные метаописания, но они не используются? Тщательно исследуйте свою видимость в Search Console.

23. Настройка PPC

Убедитесь, что если вы проводите какие-либо кампании PPC, они настроены и готовы к запуску сайта. Чтобы избежать перебоев в обслуживании, если у вас есть представитель Google PPC, вы можете настроить и приостановить все свои кампании на новые URL-адреса до запуска, и вместо того, чтобы объявления были отклонены, ваш представитель может одобрить их вручную.

Для сетевого администратора

24. Мониторинг

Монитор сайта регулярно проверяет страницы, чтобы убедиться, что они доступны для посетителей. Базовые мониторы проверяют, работает ли страница.

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

25. Система резервного копирования

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

26. Транспортные нагрузки

.

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

27. Защищенные страницы

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

28. Сертификат безопасности

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

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

Как протестировать веб-сайт вашей компании

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

Что такое тестирование веб-сайтов?

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

На что я должен обращать внимание при тестировании своего сайта?
  • Отзывчивость
  • Внешний вид и поток
  • Грамматика и правописание
  • Ссылки
  • Контактные формы

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

Оперативность

Тот факт, что ваш веб-сайт отлично выглядит в Google Chrome на рабочем столе, не означает, что он будет выглядеть так же на мобильном устройстве или даже в другом браузере. Проверьте каждую ссылку в Chrome, Firefox, Internet Explorer, а также на мобильных и планшетных устройствах.Как ваши страницы отображаются, когда вы их открываете? Если некоторые изображения смещены по центру на мобильном устройстве, но выглядят нормально во всех браузерах для настольных компьютеров, это красный флаг, что что-то нужно исправить. Найдите время, чтобы исправить эти проблемы; ваши мобильные посетители не потерпят плохого опыта.

Внешний вид и поток

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

  • фото
  • белое пространство
  • расстояние между элементами
  • шрифт и интервал между текстом
  • иерархия элементов
  • отступы и поля
  • форматирование шрифта

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

Грамматика и правописание

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

Ссылки

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

  1. Нажмите на каждую текстовую ссылку или связанное изображение
  2. Убедитесь, что он работает
  3. Убедитесь, что это актуально
  4. Если он ссылается на другую из ваших страниц, он должен открываться на той же вкладке
  5. Если он ссылается на другой веб-сайт, он должен открываться на другой вкладке
  6. Исправьте ошибки
  7. Обновить страницу

Формы Формы

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

Заполните каждую контактную форму, чтобы убедиться, что они работают. Сначала попробуйте отправить его без какой-либо информации (это не должно работать). Затем медленно заполняйте его, пока не будете уверены, что получите нужную информацию, когда кто-то отправит ее в реальном мире. Формы тестирования важны, потому что иногда формы могут быть отправлены без ключевой информации о потенциальных клиентах, такой как адрес электронной почты или номер телефона. После нажатия кнопки «Отправить» убедитесь, что отображается правильная страница или сообщение с благодарностью.Затем проверьте электронную почту, связанную с этой формой, чтобы убедиться, что ваш запрос действительно отправлен.

Итог

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

Нужна помощь не только в тестировании?

Мы тебя поймали.

Узнайте, как тестировать веб-приложения вручную — Testrig Technologies

Лучшие практики тестирования веб-сайтов: узнайте, как тестировать веб-приложение вручную

Эффективность программных продуктов во многом зависит от тестирования. Процесс тестирования веб-сайта или веб-страницы также следует аналогичным принципам и включает в себя тщательную проверку веб-сайта или связанного программного обеспечения. С развитием мобильных технологий предприятия переходят от веб-сайтов к веб-приложениям, которые выполняют аналогичные функции, хотя и с разной степенью привлекательности и вовлеченности.Но самый большой вопрос — как тестировать веб-приложения вручную? Прежде чем мы подробно рассмотрим службы тестирования веб-приложений, давайте рассмотрим, почему тестирование веб-приложений важно.

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

Лучшие практики тестирования веб-приложений: узнайте, как проверить веб-сайт на наличие ошибок?

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

  1. Смешайте исследовательское тестирование с традиционными методами

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

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

  1. Включить сторонние приложения, расширения и плагины в тестирование

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

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

  1. Тестирование кроссбраузерной совместимости

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

Разработчики должны создавать адаптивные веб-сайты с использованием открытых технологий, таких как CSS3, JavaScript и HTML5. Поэтому тестировщикам важно выполнять тестирование совместимости с разными браузерами. В результате тестировщик может проверить, доступен ли веб-сайт в разных версиях определенных веб-браузеров.

  1. Сотрудничать с командой разработчиков

Большое количество организаций выбирают DevOps для объединения деятельности по разработке и тестированию программного обеспечения.В результате специалисты по обеспечению качества должны не только тестировать веб-приложение на протяжении всего жизненного цикла разработки программного обеспечения, но и обеспечивать сотрудничество с разработчиками, клиентами и бизнес-аналитиками. Координация между тестировщиками, программистами и ИТ-специалистами может помочь им в работе как единое целое при разработке программного обеспечения.

Читайте также: Контрольный список для тестирования мобильных и веб-приложений

  1. Никогда не недооценивайте здравомыслие

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

  1. Думай как хакер

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

  1. Выберите идеальные параметры для тестирования удобства использования

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

  1. Убедитесь, что строка URL-адреса невосприимчива к изменениям

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

  1. В зависимости от циклов нагрузочного тестирования

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

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

  1. Новые способы тестирования чат-ботов

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

Заключение

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

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

Полное пошаговое руководство по тестированию удобства использования веб-сайтов

16,2% высокотехнологичных компаний отдают предпочтение работе с клиентами. 15,5% планируют увеличить инвестиции в улучшение качества обслуживания клиентов. О чем тебе это говорит?

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

  • Sales Hacker использовал отзывы пользователей, чтобы повысить вовлеченность, повысить лояльность и улучшить свои контент-стратегии с помощью предоставленной пользователями информации.
  • Оператор спортивных онлайн-гемблинга Стэн Джеймс (ныне Unibet) использовал результаты юзабилити-тестирования, чтобы удвоить свой коэффициент конверсии с 1,5% до 3% в месяц.
  • Список успехов можно продолжать и продолжать. Не стесняйтесь ознакомиться с другими тематическими исследованиями.

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

Шаг 1. Определение показателей и создание анализа задач

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

В ходе юзабилити-тестирования обычно согласовываются три показателя:

  • КПД
  • Эффективность
  • Удовлетворение

Вот краткое описание того, что обычно влечет за собой эти показатели:

Измерение юзабилити (Источник изображения: презентация SlideShare Яна Мун)

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

  • Каковы цели пользователя?
  • Какие шаги необходимо предпринять для достижения этих целей?
  • Как измеряется усилие?

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

Анализ задачи (Источник изображения: Loop11)

Вот как это работает.Вы начинаете с всеобъемлющей цели. В приведенном ниже примере цель — ежедневно принимать лекарства.

Пример иерархического анализа задач (Источник изображения: Lilly Browne)

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

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

Для начала зайдите в Lucidchart. Зарегистрируйте учетную запись, нажав кнопку «Зарегистрироваться бесплатно» в правом верхнем углу или в середине экрана. Вы попадете на эту страницу и сможете начать пробную версию. А пока прокрутите вниз, пока не увидите синюю кнопку «начать бесплатную учетную запись» и выберите ее.

Lucidchart регистрация

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

Блок-схема Lucidchart

Выберите первый вариант, «пустая диаграмма».

Пустая диаграмма Lucidchart

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

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

Процесс Lucidchart

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

Когда вы будете готовы соединить фигуры, щелкните белые кружки по бокам и перетащите мышь к следующей фигуре. Если это ромбовидный (решающий) треугольник, он автоматически добавит к вашим линиям «да» и «нет».

Да или нет в блок-схеме

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

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

Шрифты и цвета блок-схемы

После создания потока задач перейдите к «файлу», чтобы увидеть свой общий ресурс и параметры загрузки. Вы можете экспортировать поток задач с прозрачным фоном, как векторную графику (SVG) или как PDF, среди других параметров.

Блок-схема скачать как вектор

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

Блок-схема анализа задачи

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

Шаг 2: Определите лучший тип теста

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

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

1. Сорта карт

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

Сортировка карточек (Источник изображения: cary-anne olsen-landis)

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

Пользователи упорядочивают оставшиеся карточки, обычно отдельные веб-страницы или этапы процесса, по категориям, которые лучше всего соответствуют их ментальной модели. Большинство экспертов рекомендуют использовать от 30 до 60 карт. Сортировка карточек отлично подходит для того, чтобы увидеть, как ментальные модели ваших пользователей соответствуют архитектуре вашего сайта и процессу выполнения задач.Он может выявить любые существенные проблемы на ранних этапах процесса тестирования, как это было при редизайне Pottery Barn (как показано ниже).

Пример сортировки карточек в редизайне (Источник изображения: Джон Вуд Квартана)

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

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

2. Полевые исследования

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

Это исследование также называется контекстным запросом .

Контекстный запрос (Источник изображения: Филип Адейе)

Не волнуйтесь, неловкость взгляда через чье-то плечо довольно быстро исчезает. 😉

Полевые исследования требуют гораздо больше времени, чем сортировка карточек, но они идеально подходят для тестирования задач и получения прямой обратной связи от пользователей. Для тех, кто хочет глубже разобраться в вопросах юзабилити, лучше всего подойдут полевые исследования. Контекстные запросы — это первая стратегия, применяемая студией дизайна пользовательского интерфейса MELEWI для корпоративных продуктов или продуктов для «ограниченных пользователей».

Авик Гангули, консультант по UX-дизайну в MELEWI, объясняет:

Спринт контекстного запроса MELEWI предназначен для встраивания непосредственно в контекст пользователя: наблюдения за тем, что участники сделали, что они почти сделали и чего не сделали.

Вы можете увидеть, как MELEWI классифицирует и объясняет преимущества встраивания в контекстной части исследования удобства использования ниже.

Контекстная сторона (Источник изображения: RealtimeBlog)

Обратите внимание, что полевые исследования можно проводить удаленно, но они часто теряют в объеме данных.Николь Фентон и Джейми Альбрехт из 18F, агентства цифровых услуг при правительстве США, выделяют этот момент:

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

3. Отслеживание взгляда

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

Анализ тепловой карты (Источник изображения: MockingFish)

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

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

Отслеживание взгляда (Shopify)

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

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

Вот плюсы и минусы использования веб-камеры для отслеживания взгляда:

Подпишитесь на информационный бюллетень

Мы увеличили наш трафик на 1187% с помощью WordPress.

Мы покажем вам, как это сделать.

Присоединяйтесь к более чем 20 000 других людей, которые получают нашу еженедельную рассылку с инсайдерскими советами по WordPress!

Подпишись сейчас

Плюсы и минусы отслеживания глаз с помощью веб-камеры (Источник изображения: iMotions)

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

Почетные упоминания

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

Фокус-группы, A / B-тесты и опросы — все это жизнеспособные формы пользовательского тестирования, которые могут поощрять обратную связь, но не должны рассматриваться для каких-либо серьезных изменений.

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

Шаг 3. Найдите подходящих участников

Сколько пользователей вам нужно для проведения юзабилити-теста? Отраслевой стандарт — около пяти. Согласно опросу UserTesting, 33% компаний набирают пять или меньше пользователей, а 41% — от шести до десяти.

Пользователей на исследование удобства использования (Источник изображения: UserTesting)

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

Именно поэтому здесь, в Kinsta, мы сделали отзывы пользователей прямой частью нашего процесса редизайна.

Тем не менее, бывают случаи, когда поиск репрезентативных пользователей занимает слишком много времени или дорого для целей теста. В таких случаях могут быть полезны внутренние тестировщики.Этот метод тестирования, именуемый «собачьим кормом» (т.е. поеданием собственного корма для собак), позволил изданию The Boston Globe получить ценные качественные отзывы о новых функциях навигации. Проверьте это:

Качественный отзыв (Источник изображения: UXpin)

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

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

Исследование Gallup показало, что даже всего лишь 5 долларов США могут серьезно повысить уровень вашего участия.

Доля ответов на интернет-опрос (Источник изображения: Marketing Charts)

Вы можете использовать платформы для проведения опросов, такие как SurveyMonkey и Google Forms, или, если вы используете сайт WordPress, вы можете использовать конструкторы форм для сбора информации от потенциальных участников.Мы большие поклонники Hotjar и используем его в Kinsta.

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

Пользовательское тестирование

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

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

Пользовательское тестирование

Userlytics

Используемая Google, Userlytics — еще одна надежная платформа со средними ценами и беспрецедентным качеством. Панель тестирования Userlytics, предоставляющая записанные видео, насчитывает более 200 000 пользователей, что позволяет легко найти идеальные прокси для пользователей.

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

Userlytics

Теперь пора запустить тест, а это значит, что пора решить, где, когда и кто будет участвовать.

Шаг 4. Решите, когда, где и кто

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

  • Дистанционно или лично?
  • Модерируемый или немодерируемый?

Узнайте, как это работает в отрасли:

Юзабилити-тестирование (Источник изображения: UserTesting)

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

Если нет, давайте вернемся на минутку: что такое модерируемое тестирование и почему вы должны его использовать?

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

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

Специалист по юзабилити (Источник изображения: Graphic Mint)

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

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

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

Используйте следующие бесплатные платформы для удаленных тестов:

Skype

Если вы помните MELEWI из предыдущих разделов, Skype — их предпочтительный инструмент для удаленных тестов на удобство использования. Самым значительным преимуществом Skype является его знакомство с пользователями и возможность совместного использования экрана.Однако недостатком этой платформы является отсутствие встроенной записи экрана.

Skype

Google Hangouts

Доступная для любого пользователя с учетной записью Google, Google Hangouts — еще одна бесплатная платформа с возможностью совместного использования экрана. Однако только определенные типы аккаунтов G Suite могут записывать видео изначально. Преимущества Hangouts перед Skype зависят от предпочтений и от того, что вашим пользователям удобнее. Оба выполняют аналогичные функции и потребуют записи с экрана, если вы не настроили аккаунт G Suite Enterprise.

Google Hangouts

Zoom

Завершает наш список платформ для удаленного тестирования удобства использования Zoom. Эта платформа имеет существенное преимущество перед Skype или Hangouts: она обеспечивает запись экрана и видео в собственном формате. Фактически, мы используем Zoom здесь, в Kinsta.

Однако у него есть и большой недостаток. Если в вашей видеовстрече участвует более одного пользователя, для бесплатных аккаунтов действует 40-минутный лимит.

Zoom

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

Время для нашего последнего шага: итерация.

Шаг 5. Промыть и повторить

Итеративное тестирование — ключ к удобству использования, хотя есть некоторые аргументы в пользу его роли в инновациях. Что означает итерация в контексте дизайна? Это означает, что ваш процесс никогда не заканчивается: после создания веб-сайта вы постоянно тестируете, настраиваете и улучшаете этот веб-сайт бесконечно .

Итеративный и циклический (Источник изображения: Шон Ван Тайн)

Итак, после того как вы провели тесты и собрали результаты, самое время проверить, внедрить и повторить все заново. Enginess, цифровая консалтинговая компания, прекрасно иллюстрирует ценность итеративного дизайна:

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

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

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

Карта путешествия (Источник изображения: Sailthru)

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

Карты

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

Кроме того, наличие единой информации, которой можно поделиться между членами команды, значительно упрощает итерационный процесс.Так чего же ты ждешь? Вернитесь к первому шагу, чтобы повысить удобство использования вашего сайта. Небо это предел.

Сводка

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

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

По завершении юзабилити-тестирования вернитесь и просмотрите результаты, чтобы увидеть, какие изменения нужны вашему веб-сайту.Затем внедрите эти изменения и сделайте это снова: итерация — это разница между удобством использования «мэх» и безупречным юзабилити.

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


Если вам понравилась эта статья, то вам понравится хостинговая платформа Kinsta WordPress. Ускорьте свой сайт и получите круглосуточную поддержку от нашей опытной команды WordPress.Наша инфраструктура на базе Google Cloud ориентирована на автоматическое масштабирование, производительность и безопасность. Позвольте нам показать вам разницу в Kinsta! Ознакомьтесь с нашими тарифами

сайтов для тестирования на COVID-19 на уровне сообществ

Алабама

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Алабамы.

Аляска

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Аляски.

Американское Самоа

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Американского Самоа.

Аризона

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Аризоны.

Арканзас

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Арканзас.

Калифорния

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Калифорнии.

Колорадо

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Колорадо.

Коннектикут

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Коннектикута.

Делавэр

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Делавэр.

Округ Колумбия

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения округа Колумбия.

Флорида

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Флориды.

Грузия

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Джорджии.

Гуам

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Гуама.

Гавайи

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Гавайев.

Айдахо

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Айдахо.

Иллинойс

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Иллинойс.

Индиана

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Индиана.

Айова

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Айова.

Канзас

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Канзаса.

Кентукки

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Кентукки.

Луизиана

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Луизианы.

Мэн

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Мэн.

Мэриленд

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Мэриленда.

Массачусетс

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Массачусетса.

Мичиган

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Мичиган.

Миннесота

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Миннесоты.

Миссисипи

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Миссисипи.

Миссури

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Миссури.

Монтана

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Монтана.

Небраска

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Небраски.

Невада

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Невада.

Нью-Гэмпшир

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Нью-Гэмпшира.

Нью-Джерси

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Нью-Джерси.

Нью-Мексико

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Нью-Мексико.

Нью-Йорк

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт Департамента здравоохранения Нью-Йорка.

Северная Каролина

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Северной Каролины.

Северная Дакота

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Северной Дакоты.

Огайо

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Огайо.

Оклахома

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Оклахомы.

Орегон

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Орегон.

Пенсильвания

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Пенсильвании.

Пуэрто-Рико

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Пуэрто-Рико.

Род-Айленд

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Род-Айленда.

Южная Каролина

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Южной Каролины.

Южная Дакота

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Южной Дакоты.

Теннесси

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Теннесси.

Техас

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Техаса.

Юта

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Юта.

Виргинские острова США

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Виргинских островов США.

Вермонт

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Вермонт.

Вирджиния

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Вирджинии.

Вашингтон

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Вашингтон.

Западная Вирджиния

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения Западной Вирджинии.

Висконсин

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Висконсин.

Вайоминг

Бесплатное тестирование доступно в местных медицинских центрах и некоторых аптеках:

Для получения информации о местных тестах посетите веб-сайт департамента здравоохранения штата Вайоминг.

Лучшие демонстрационные сайты для практики тестирования программного обеспечения

Тестовые сайты всегда нужны для практики, будь то курсы, семинары, вебинары, тестирование новых инструментов и т. Д. Вот почему в этом посте я хочу оставить вам список сайты, на которые мы ссылаемся, когда пробуем новые инструменты для тестирования программного обеспечения в Abstracta. Мы будем обновлять этот список по мере нахождения новых веб-сайтов, так что следите за обновлениями!

Демо-сайты электронной коммерции

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

Вот несколько демонстрационных сайтов электронной коммерции для тестирования:

Demoblaze

Demoblaze — это пример системы электронной коммерции, предоставляемой BlazeMeter для практики автоматизации с использованием JMeter, запускающей ее с Blazemeter. Он даже включает раздел с видео, чтобы вы могли протестировать протокол HLS.

OpenCart

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

WPmobilepack

WPmobilepack — очень простая система электронной коммерции, отлично подходящая для тестирования.

Juice-Shop

Juice-Shop — известный сайт, используемый для тестирования уязвимостей безопасности.

2Checkout

Система Sandbox 2checkout — это не только система электронной коммерции для клиентов, но вы также можете поиграть с другими функциями в административном бэкэнде, включая отчеты, управление продажами и т. Д.

Примеры систем

DBank Demo

Здесь вы найдете пример системы онлайн-банкинга, с которой вы можете попрактиковаться в тестах.

OrangeHRM

OrangeHRM — это продукт с открытым исходным кодом для управления персоналом, на котором есть демонстрационный сайт, который очень хорошо подходит для отработки тестирования реальной системы.

Computer-Database

Это тестовый сайт, предоставленный Gatling (инструмент для тестирования производительности). Это сайт с компьютерной базой данных, где есть список из нескольких столбцов и поисковый фильтр.

JPetStore Demo

JPetStore — это тестовая система, предоставляемая Octoperf (еще один инструмент для тестирования производительности). Как следует из названия, это фальшивый зоомагазин с различными списками, фильтрами и т. Д.

Демо-сайты для тестирования инструментов автоматизации веб-тестирования

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

DemoQA

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

SwagLabs

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

Selenium Easy

Selenium Easy похож на DemoQA, за исключением того, что он предоставляется Smartbear CrossBrowserTesting.

Тестовые страницы для автоматизации

Наряду с DemoQA и Selenium Easy, ознакомьтесь с этим ресурсом, который полон примеров страниц, которые Алан Ричардсон, также известный как «Evil Tester», может использовать для автоматических проверок.

The-Internet

Дэйв Хэффнер, создатель Elemental Selenium, предлагает этот сайт, а также для тестирования различных вещей, таких как раскрывающиеся меню, наведение курсора и т. Д.

GlobalsQA

Этот сайт Angular Banking представляет собой небольшой пример написанного веб-сайта банка. в Angular для тестирования вашей среды автоматизации на веб-сайте, написанном на Angular. На сайте есть список транзакций, а также сценарии входа в систему, список транзакций, операции внесения и вывода средств.

Площадка для автоматизации тестирования пользовательского интерфейса

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

Базовый калькулятор

На этой странице представлен объект с базовыми функциями, предоставленный Майком Талксом, для первой попытки использования Selenium.

Практика автоматизации — магазин одежды

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

Сайты для опробования инструментов тестирования уровня обслуживания (API, SOAP, REST) ​​

«API» — это сокращение от интерфейса прикладного программирования, также известного как «набор правил, который позволяет программистам разрабатывать программное обеспечение для конкретной операционной системы, не имея чтобы быть полностью знакомым с этой операционной системой.”Ниже вы можете найти список демонстрационных API.

Оставьте комментарий