Самые распространенные ошибки web-usability

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

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

Навигация не помогает пользователю определить «место» дислокации. Навигация должна помочь посетителю идентифицировать свое место расположения на сайте.

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

Внешний вид объектов не передает их иерархию. Известно, что для того, чтобы сделать страницу простой для быстрого "схватывания", нужна такая организация внешнего вида элементов страницы, чтобы они ясно показывали, какие элементы являются частью других. Но этот принцип иногда нарушается. Часто это происходит при проектировке вертикальной панели навигации. Иногда этот факт бывает не очевиден - где разделы, а где подразделы. Выделяйте разделы визуально (больше шрифт, например). То же самое относится и к заголовкам. Естественно, заголовок должен быть больше подзаголовков, подзаголовки — больше подзаголовков и т.д. А вот на выравнивание разработчики часто не обращают внимание. Заголовок делают по правому краю, подзаголовки по центру. Лучше всего выровнять их все по левой стороне. Такое выравнивание сильно повышает эффективность передачи визуальной иерархии.

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

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

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

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


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: