converlab

Дизайн. Юзабилити. Конверсия.

Written by: Дмитрий Наумов on 16.09.2010 @ 4:09 пп

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

1. Доступность (Accessibility)

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

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

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

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

2. Читабельность (Readability)

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

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

3. Идентификация

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

- Наличие логотипа (или заголовка)
Объясняет посетителю что это за сайт и (в оптимальном случае) о чем он.

- Релевантность заголовков
Заголовки должны быть «говорящими»

- Существует ли страница «О Нас» («About», «О компании», «Об авторе» и так далее)
Такая страница — неотъемлемая часть функциональной и имиджевой составляющей сайта.

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

- Есть ли контактная информация
Контактная информация может находится на странице «О нас» или отдельно, но быть должна обязательно.

4. Навигация

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

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

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

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

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

- Поиск по сайту работает правильно
Работает ли поиск по сайту. Часто форма поиска есть, но как таковой он не работает.

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

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

5. Контент

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

- Размер текстового поля
Не должен быть очень маленьким и слишком большим (чтобы появлялись полосы горизонтальной прокрутки). И то и другое неудобно. Думаю, ориентироваться все еще можно на разрешение 1024х768. Точно не прогадаете.

- Количество контента
Малое количество контента обесценивает страницу, большое – может сделать ее трудной для восприятие. Оптимально объем каждой отдельной страницы лежит в пределах 1000-5000 знаков. Исключения, конечно, имеют место быть.

- Все ссылки работают
Необходимо проверить все ссылки на работоспособность.

- Структурированность текста
Текст должен имеет структуру — заголовки/подзаголовки, абзацы, списки, цитаты и так далее.

Хотелось бы с вами обсудить список, дополнить или что-то убрать.

Update 16 сентября 2010: Добавлен раздел Readability, в соответствии с комментарием Scriptin.

Popularity: 31% [?]

Поделиться в соц. сетях

0

Tags: , , , , , , ,

Catogories: Юзабилити
  • Анонимно

    спасибо
    просто сделал ctrl+s на рабочий стол, ибо много мыслей для проработки:)

  • http://www.maxibiz.blogspot.com/ Дмитрий Наумов

    Это хорошо -)

  • http://dmitry-scriptin.blogspot.com/ Scriptin

    1. Навигация

    Навигация на Flash (если сайт на HTML) – решение или идиота, или школьника. Я всего один раз в жизни видел такой сайт. Меню недоступно по первому клику, который только активирует плагин (школьники не умеют JavaScript).

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

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

    2. Accessibility / Readability

    Это разные вещи. Доступность – это когда добавляются всякие ARIA и т.п. дополнения для невизуальных устройств, соблюдается логичный порядок следование элементов в разметке и т.п.

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

    2. Идентификация

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

    В общем, в списке есть лишние и неправильно классифицированные элементы. С содержанием согласен.

  • http://twitter.com/IgrOK Роман Настенко

    Вот мой старый чек-лист:
    http://ux.perfectomania.com/usehour.png

  • http://www.maxibiz.blogspot.com/ Дмитрий Наумов

    1. Еще не то делают -).

    2. Согласен я начал с Accessibility, потом зачем то в кучу подмешал и Readability. Не туда понесло, написал ерунду. Поправлю.

    3. А вот с идентификацией не знаю, смотря что идентифицировать. Хотя конечно, заголовки обычно с идентификацией и не ассоциируют. В свою очередь копирайт, Privacy Policy, Contact Us и прочие вещи которые обычно обитают в «подвале», напрямую к юзабилити не относятся. С другой стороны являются неотъемлемой частью правильного дизайна. Человеку вполне может понадобиться узнать условия использования материала и пр. Скорее всего за этим он в первую очередь «полезет» в подвал. То есть оно с одной стороны не юзабилитил, с другой что как не юзабилити.

  • http://www.maxibiz.blogspot.com/ Дмитрий Наумов

    Очень всесторонне, думаю это намного больше чем юзабилити -).

  • http://twitter.com/IgrOK Роман Настенко

    На самом деле почти все относится, даже SEO :) Например, чем тебе не юзабилити написание понятного текста для представления сайта в выдаче поисковиков?

  • http://www.facebook.com/people/Igor-Agurtsoff/100001524289142 Igor Agurtsoff

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

  • http://www.maxibiz.blogspot.com/ Дмитрий Наумов

    С этой стороны да -). Просто я обычно подхожу с обратной – например, думаю о SEO, в голове держу и юзабилити тоже -).

  • http://www.maxibiz.blogspot.com/ Дмитрий Наумов

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