Юзабилити сайтов – 10 важных моментов - 4.8 out of 5 based on 4 votes

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

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

Юзабилити сайтов – 10 важных моментов

Ошибка 1: Игнорирование тега label.

Игнорирование тега label

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

Ошибка 2: Логотип сайта, который не имеет ссылки на главную страницу.

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

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

Ошибка 3: Неизменяющиеся посещенные ссылки.

Не изменение внешнего вида посещенных ссылок

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

Ошибка 4: Неизменяющиеся активные поля формы.

Не указание активного поля формы

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

Узнайте как создать эффект свечения для полей HTML форм.

Ошибка 5: Использование изображений без указания описаний в теге Alt.

Использование изображений без указания описаний в теге Alt

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

Ошибка 6: Использование фонового изображения без цвета фона.

Использование фонового изображения без цвета фона

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

Ошибка 7: Использование длинных, не размеченных, отрывков текста на странице.

Использование длинных, не размеченных, отрывков текста на странице

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

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

Ошибка 8: Подчеркивание текста, который не является ссылкой.

Подчеркивание текста, который не является ссылкой

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

Ошибка 9: Использование в тексте сообщения «кликните здесь».

Использование в тексте сообщения «кликните здесь»

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

Ошибка 10: Использование текста выровненного по краям.

Использование текста выровненного по краям

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

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

Материал подготовлен проектом:  WebMasterMix.ru
Источник

1 1 1 1 1 1 1 1 1 1 Рейтинг 4.88 (4 Голосов)