Usability - аудит

Começar. É Gratuito
ou inscrever-se com seu endereço de e-mail
Usability - аудит por Mind Map: Usability - аудит

1. Интернет - магазин

1.1. Общие стандарты

1.1.1. Логотип хорошо заметен и размещен в верхней части каждой страницы

1.1.2. На сайте указан номер телефона

1.1.3. Номер телефона расположен на одном и том же месте на всех страница

1.1.4. Номер телефона видно на любой странице в течение первых 3-х секунд просмотра

1.1.5. Номер телефона указан с кодом города

1.1.6. Не используется Flash-анимация (кроме баннеров)

1.1.7. Поиск по сайту находится в верхней части всех страниц сайта и виден втечение первых 3-х секунд просмотра

1.1.8. Кнопка «найти» присутствует

1.1.9. Все ссылки в текстах подчеркнуты

1.1.10. В текстах не используется подчеркивание не для ссылок

1.1.11. Основной цвет фона белый или светлый

1.1.12. Все ссылки на форму обратной связи или номер телефона снабжаются призывами к действию «Позвоните нам»...

1.1.13. На любой странице не более 8-ми блоков

1.1.14. На любой странице не более 3-х колонок

1.1.15. На всем сайте используется единый принцип выравнивания

1.1.16. Все значимые изображения снабжены тэгом Alt

1.1.17. Цвета шрифтов и фона контрастны

1.1.18. Не используются скрипты видоизменяющие курсор мыши

1.1.19. Не используются анимация формата «падающий снег»

1.1.20. Страница 404 ошибки выполнена в дизайне сайта и содержит ссылки на основные навигационные страницы сайта

1.1.21. Любая страница сайта должна содержать торговое предложение

1.1.22. При минимальном разрешении экрана (1024x768) полоса прокрутки отсутствует (IE,Chrom, Firefox, Opera)

1.1.23. Сайт одинаково отображается во всех основных браузерах (IE,Chrom, Firefox, Opera)

1.1.24. Любая страница сайта имеет не более 3-х «ярких акцентов»

1.2. Базовая навигация

1.2.1. Меню каталога товаров расположено вертикально

1.2.2. Меню каталога товаров содержит не более 8 пунктов

1.2.3. Если меню разворачиваемое то:

1.2.3.1. по клику на знак + меню разворачивается без смены страницы

1.2.3.2. по клику на пункт меню — меню разворачивается и происходит переход на новую страницу

1.2.4. Меню основной навигации расположено горизонтально

1.2.5. Меню основной навигации продублировано в нижней части сайта

1.2.6. Существуют виртуальные категории «новинки», «хиты», и прочие, в них товары подобраны по понятному принципу

1.2.7. Текущий пункт меню всегда выделен

1.2.8. Ссылка в меню на текущий пункт не активна

1.2.9. Используются «хлебные крошки» для всех страниц сайта.

1.2.10. Все навигационные элементы занимают не более 20% площади экрана

1.2.11. Блок корзины находится на всех страницах на одном и том же месте

1.2.12. Блок корзины является одним из ярких пятен и заметен при первых 3-х секундах просмотра сайта

1.2.13. Рядом с блоком корзины располагается информация о доставке

1.2.14. При добавлении товара в корзину - рядом с кнопкой появляется информация о том, что товар в корзину добавлен

1.2.15. При добавлении товара в корзину в блоке «Корзина» происходит видимое изменение

1.2.16. При нажатии на ссылку «добавить в корзину» повторно – появляется сообщение о том, что товар уже в корзине и предложение «просмотреть» содержимое корзины» или «добавить еще один такой товар»

1.2.17. При наведении на блок корзина мышки во всплывающей подсказке выводятся все товары и их цены

1.2.18. Страница корзины не содержит витрины магазина

1.2.19. Страница корзины не содержит новостей

1.2.20. Страница корзины не содержит баннеров и любой другой рекламы

1.2.21. Страница корзины не содержит анимации

1.2.22. Страница корзины не содержит базовой навигации по сайту

1.2.23. Страница корзины не содержит меню каталога товаров

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

1.2.25. На странице корзины есть информация о доставке

1.2.26. На странице корзины есть информация о том как задать вопросы или связаться с менеджером

1.2.27. Используется две кнопки (или кнопка + ссылка) «Оформить заказ» (оформить заказ обычным и необычным способом)

1.2.28. Страница корзины не содержит резких прямых горизонтальных линий

1.2.29. Страница корзины работоспособна при выключенном JavaScript и других плагинах

1.2.30. Оформление заказа не прерывается, если пользователь не зарегистрирован

1.2.31. Для незарегистрированных пользователей требуется ввести только e-mail и возможно логин

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

1.2.33. Предлагается несколько вариантов доставки

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

1.2.35. Предлагаются способы снизить стоимость покупки

1.2.36. В блоке корзины не используются надписи «ваша корзина пуста» или «0 товаров на 0 рублей»

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

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

1.2.39. При оформлении заказа предлагаются доп. товары из «объемного ассортимента» на сумму не более 20% от покупки

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

1.2.41. После завершения оформления заказа автоматически предлагается upsell

1.3. Главная страница:

1.3.1. УТП видно сразу в течение первых 3-х секунд просмотра (баннер, текст, слоган)

1.3.2. Используется технология входных точек

1.3.3. Главная страница содержит осмысленный заголовок

1.3.4. Главная страница содержит краткий текст «о магазине, о компании», построенный на выгодах и (или) УТП

1.3.5. Главная страница содержит как минимум одно конкретное предложение о покупке до линии второго экрана

1.3.6. Ссылка «о магазине, о компании» выделена цветом

1.3.7. С главной страницы нет работающей ссылки на главную же страницу

1.3.8. Заметная ссылка на предложение помощи

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

1.3.10. Главная страница не содержит pop-up баннеров (кроме вариантов захвата в рассылку)

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

1.3.12. Информационные сервисы (подписка, регистрация) находятся в верхней части экрана

1.3.13. Подробная контактная информация (телефон, email, ссылка на форму обратной связи и контактную информацию)

1.3.14. Примеры отзывов покупателей о сервисе компании и ссылка на все отзывы

1.3.15. На главной странице должны отсутствовать не несущие информации блоки и заголовки типа: «Добро пожаловать» «Рады приветствовать», «Уважаемый посетитель!» и т.д.

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

1.3.17. Отсутствуют всплывающие окна (кроме вариантов захвата в рассылку)

1.4. Карточка товара:

1.4.1. Содержит в заголовке название товара

1.4.2. Содержит подзаголовок, на основании выгоды

1.4.3. Существует описание товара, написанное человеческим языком

1.4.4. Присутствуют технические характеристики

1.4.5. Присутствует цена

1.4.6. Кнопка «купить» или «положить в корзину» находится в правой части первого экрана карточки

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

1.4.8. Есть фотография товара

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

1.4.10. Каждое окно содержит навигационный элемент, цену и «купить»

1.4.11. На карточке товара отсутствует отвлекающие элементы (новости, витрина, реклама)

1.4.12. Используются вкладки для разделения содержания

1.4.13. Показано несколько цен в зависимости от типа пользователя сроков и способов покупки

1.4.14. Есть как минимум два варианта совершения покупки

1.4.15. Показаны «сопутствующие товары» с возможностью добавить в корзину вместе с основным товаром.

1.5. Каталог товаров:

1.5.1. Меню каталога товаров расположено вертикально

1.5.2. В основном меню каталога не более 10-и пунктов

1.5.3. Разделы, сформированные по одному принципу оформлены одинаково, по разным — по разному

1.5.4. Оформление ссылок в меню на виртуальные разделы «новинки», «хиты», «распродажа»

1.5.5. На любой странице каталога есть товар и предложение его купить

1.5.6. Страница раздела и подраздела содержит

1.5.6.1. заголовок

1.5.6.2. краткое описание

1.5.6.3. список товаров с фильтрами

1.5.7. Существует как минимум два альтернативных способа навигации по каталогу

1.5.8. Пользователь имеет возможность управлять выводом

1.5.9. Блок товара как минимум содержит:

1.5.9.1. название товара

1.5.9.2. изображение товара

1.5.9.3. описание товара

1.5.9.4. цену товара (или несколько цен)

1.5.9.5. значки и иконки акций и скидок

1.5.9.6. кнопку «купить» или «добавить в корзину»

1.5.10. Количество товаров по строкам и колонкам не всегда совпадает

1.5.11. В разделах и подразделах содержатся ссылки на популярные разделы

1.6. Регистрация:

1.6.1. Пользователю объясняется выгода регистрации рядом с кнопкой «зарегистрироваться»

1.6.2. Процесс регистрации имеет минимум два варианта, один из которых должен быть предельно коротким (Имя, email)

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

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

1.6.5. При регистрации нужно спросить согласие на получение писем от вашей компании

1.7. Тексты:

1.7.1. На сайте используется не более 3-х шрифтов

1.7.2. Нет абзацев длиннее 5-6 строчек

1.7.3. Каждый текст имеет заголовок

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

1.7.5. Все тексты должны легко читаться при масштабировании

1.8. Поиск на сайте:

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

1.9. Есть карта сайта; ссылка на нее — на каждой странице

2. Информационный портал

2.1. Сайт как целое

2.1.1. По главной странице сразу понятно, чему посвящен сайт

2.1.2. Все основные возможности доступны без регистрации

2.1.3. Вcе функции работают корректно

2.1.4. Удобство для новичков: простота, подсказки, помощь

2.1.5. Удобство для опытных: упрощенные процедуры, сочетания клавиш

2.1.6. Информация представлена в соответствующих региональных стандартах (метрическая система и пр.)

2.1.7. Нет лишней, отвлекающей информации

2.1.8. Если отвлекающие элементы есть, то их в любой момент можно остановить (заставки, флеш-анимация, фоновая музыка)

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

2.1.10. Метафоры используются очень осторожно и интуитивно понятны типичному пользователю сайта

2.1.11. Пользователю не приходится вводить одну и ту же информацию дважды

2.2. Структура сайта, информационная архитектура

2.2.1. Контент разделен на основной и дополнительный

2.2.2. Сложность структуры сайта соответствует контенту и задачам

2.2.3. На первом экране находятся основные побуждающие к дальнейшему действию элементы страницы

2.3. Навигация

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

2.3.2. Критически важные пути (такие как покупка, подписка и пр. в зависимости от бизнес-целей сайта) предельно просты

2.3.3. Важная информация легко доступна со всех страниц сайта

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

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

2.3.6. Нет «тупиковых» страниц

2.3.7. Сайт не блокирует кнопку Back (Назад) браузера

2.3.8. Кнопка Back (Назад) всегда возвращает на предыдущую посещенную страницу

2.3.9. Главное меню есть на всех страницах, в одном и том же месте (исключение может составлять процесс покупки)

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

2.3.11. Используется не более двух подуровней меню

2.3.12. Пункты, содержащие подменю, отличаются от остальных пунктов

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

2.4. Структура страниц сайта

2.4.1. Логотип расположен в одном и том же месте на всех страницах сайта

2.4.2. Слоган четко описывает цели сайта (он краткий и расположен рядом с логотипом)

2.4.3. Самые важные блоки расположены на первом экране

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

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

2.4.6. Каждый блок можно охватить одним взглядом

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

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

2.4.9. «Цена — рядом с товаром»: все связанные элементы находятся рядом друг с другом

2.4.10. Значение иконок и графических элементов интуитивно понятно

2.4.11. Элементов, привлекающих внимание, мало (анимация, крупные, цветные тексты и прочее)

2.5. Поиск

2.5.1. Поле поиска доступно на любой странице сайта

2.5.2. Поле поиска находится в ожидаемом месте

2.5.3. На странице одно поле поиска

2.5.4. В поле поиска работает подсказка

2.5.5. Поиск проверяет орфографические ошибки и ищет синонимы

2.5.6. Длина поля поиска — не менее 30 символов (достаточно для наиболее частых запросов); длина запроса не ограничена

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

2.5.8. Результаты поиска легко воспринимаются, отсортированы по релевантности

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

2.5.10. Пользователю показывается количество результатов поиска

2.5.11. Поиск охватывает весь сайт целиком, если не предусмотрен поиск по определенным разделам сайта

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

2.6. Текст

2.6.1. Изложение соответствует принципу перевернутой пирамиды: сначала важное, потом остальное

2.6.2. Текст лаконичен, без «воды»

2.6.3. Текст структурирован: заголовки, подзаголовки, абзацы, цитаты, списки (тогда текст легко сканируется)

2.6.4. Кегль основного текста для чтения — 16px

2.6.5. Выравнивание крупного абзаца — только по левому краю (не по центру и не по ширине)

2.6.6. Для длинных строк — увеличенное межстрочное расстояние

2.6.7. Длина строки — ~70-80 символов; слишком короткие и длинные — плохо

2.6.8. Заголовок ближе к «своему» абзацу, чем к предыдущему

2.6.9. Заголовки — назывные («О чем дальше?»), а лучше — транзитивные («Что там сказано?»)

2.6.10. Кегль заголовка тоже больше кегля подзаголовка в ~1,5 раза

2.6.11. Кегль подзаголовка больше кегля текста в ~1,5 раза;

2.6.12. Верхний регистр используется по минимуму или не используется (он затрудняет чтение)

2.6.13. Шрифты единообразны на всех страницах, читабельны и контрастны

2.6.14. Цвет ссылок никогда не используется для текста

2.6.15. Разнообразие цветов должно быть оправданным

2.6.16. Для улучшения восприятия длинные числа разбиваются на разряды неразрывным пробелом (1 234 567)

2.7. Ссылки и кнопки

2.7.1. Текст ссылки обозначает объект, к которому она ведёт (плохо: «нажми сюда», «перейдите по ссылке», «лежит тут» и пр.)

2.7.2. Все ссылки визуально отличаются от остального текста (синие и подчеркнутые — стандарт)

2.7.3. Посещенные ссылки выделяются другим цветом (фиолетовые — стандарт)

2.7.4. Скриптовые ссылки (которые не перезагружают страницу) подчеркнуты пунктиром

2.7.5. Ссылки достаточно длинные, чтобы по ним было легко кликнуть

2.7.6. Ссылки для скачивания файлов визуально отличаются от ссылок на другие страницы

2.7.7. Кнопки — для действий

2.7.8. Кнопки похожи на кнопки: форма, цвет, текст, реакция на курсор

2.7.9. Кнопка с целевым действием только одна на странице или она очень явно выделена по сравнению с другими (т. н. call-to-action)

2.7.10. Текст на кнопке — призыв к действию: текст в инфинитивной форме глагола (пример: найти), а не другую часть речи либо форму глагола (пример: готово)

2.7.11. Активная область кнопки совпадает с ее видимым размером или больше

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

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

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

2.8. Формы

2.8.1. Формы максимально лаконичны

2.8.2. В целевых формах (таких как регистрация, оформление заказа) есть только обязательные поля

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

2.8.4. При открытии страницы с формой, курсор перемещается в первое поле

2.8.5. Поле, в котором находится фокус, визуально выделено

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

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

2.8.8. Обработка формы запускается не только по нажатию на результирующую кнопку, но и по нажатию клавиши [Enter]

2.8.9. Клавиша [Tab] перемещает курсор по полям в правильной последовательности (сверху вниз, слева направо)

2.8.10. Текст результирующей кнопки соответствует цели заполнения (например “Зарегистрироваться”, “Получить бонус” и пр.)

2.8.11. Поля, заполнение которых может вызвать вопросы, снабжены подсказками (например, даты, номера телефонов и пр.)

2.8.12. Обязательные поля явно отличаются от необязательных

2.8.13. Подписи полей соответствуют смыслу полей

2.8.14. Наиболее вероятные значения некоторых полей формы по умолчанию заполнены

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

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

2.8.17. Проверка на правильность введенных данных происходит без перезагрузки страницы, сразу после ввода данных

2.8.18. Сообщения об ошибках информативны (плохо: “Вы не заполнили все обязательные поля”; хорошо: “Укажите, пожалуйста, электронную почту”)

2.8.19. Сообщение об ошибке располагается рядом с полем, в котором совершена ошибка

2.8.20. Отсутствие капчи

2.9. Логотип является ссылкой на главную на всех страницах, кроме главной