Если вы читаете эту статью, то, пожалуй, не стоит объяснять, что означает термин «юзабилити».
Мне хотелось написать немного о том, что можно легко позабыть, но быстро вспомнить после прочтения данного поста.
Каждый из нас понимает, что посещаемость сайта может быть высокой, например, если это интернет-магазин. В умных книжках сказано, что если конверсия у таких сайтов в день достигает до 3%, то сайт работает как надо. Но есть способ достичь более высоких результатов?
Удобство сайта в использовании имеет важную роль. Теперь предположим, что у вас есть сайт и туда могут зайти разные пользователи от «горячих», что очень хорошо, до ледянных «холодных». Так вот, как не разочаровать ни тех, ни других посетителей? Как не спровоцировать их уйти к конкурентам? Трудно привести точное количество ошибок в юзабилити, просто постараюсь донести самые важные моменты. Перед этим предварительно разобью на 3 раздела:
I. Доступность сайта
II. Идентичность и Навигация
III. Содержание
I. Доступность информации сайта
- То, что видит пользователь при загрузке страницы важно! Но не заставляйте ждать эту информацию. Ожидание отклика более чем на 2 секунды может снизить интерес пользователя к сайту. Вы ведь тоже не любите ждать? Используйте CSS спрайты и различные инструменты для тестирования веб-страниц, тем самым вы выявите узкие места для проведения работ по оптимизации кода. На начальных этапах разработки сайта отнеситесь ответственно к выбору быстрого движка и мощного хостинга.
- Выделиться хочет каждый, но не стоит портить зрение пользователей. Как, например, уникальное предложение на баннере, которое трудно разобрать:Глаза устают от контрастности. В таком случае лучше придерживаться старомодного способа: темное на белом:
- Следующий пример:Вы, наверняка, захотите отнести его к предыдущему разряду, но нет. Здесь, помимо контраста между текстом и фоном, очень мелкий текст. Чтобы сделать его читабельным, я увеличила его с помощью Firebug на 3 пикселя, сравните:Нужно всячески облегчать текст для чтения. Выделять ключевые слова, использовать списки, заголовки, публиковать короткие параграфы, разбавлять контент изображениями и т.д.
- Умеренно используйте Flash другие дополнения. Можно добавить про платформу Microsoft Silverlight, который еще не так применяем и известен, но постепенно набирает обороты. Новые технологии хороши только тогда, когда это действительно приближает к вашим целям. Иногда стоит придерживаться стандартных HTML/CSS шаблонов, тем более это большой плюс для поисковых систем.
- Уже не новость, что следует указывать альтернативный текст – ALT для ваших изображений. В них нуждаются и поисковые системы, и пользователи, если страница не отображает картинки по какой-то либо причине. Крайне важно (и удобно) прописывать ALT изображений для ключевого содержания, например, пункты меню. Сравните сайт с загруженными изображениями: И он же только без загрузки изображений, но с альтернативным текстом:А теперь посмотрите на еще одну страницу другого сайта:И на ту же самую страницу, но без изображений и альтернативного текста:Вся информация теряется и выглядит бессмысленно, особенно это касается раздела «Наши сотрудники».
- На сайте обязательно должна быть оформлена страница Not-found/Ошибка 404. Даже если пользователь не нашел то чего искал, вы с помощью этой страницы ошибки можете перенаправить его на нужный раздел:Не забывайте, что страница ошибки должна соответствовать по дизайну всего сайта. Даже использовать в ней капельку юмора никогда не помешает:Примеры приведены с сайта Рейтинг 404. Если пользователь в результате наткнется на такое: Он, вероятнее, покинет сайт сразу.
II. Идентичность и Навигация
Знакомство с сайтом равносильно деловой встрече, когда вы впервые знакомитесь со своим партнером вживую и видите его, кто он и кого из себя представляет. Это не вызывает лишних вопросов.
- Всего за несколько секунд пользователь должен понять, какая перед ним компания, оценить ее деятельность, преимущества и полезность для себя. Как здесь:
- Часто на главной странице сайта стараются разместить всю информацию о компании. Не стоит «пичкать» главную страницу всем подряд, для пользователей важнее доверие к вам.
Подробную информацию разместите отдельно в разделе «О нас», «О Компании», «Новости» и сделайте удобное навигационное меню:
III. Содержание
Вы слышали такую фразу, что «Content is king»?
- Готовьте для пользователей интересную и легко воспринимаемую информацию, тогда ваш контент будет выполнять требуемую функцию на сайте, а не являться просто мусором для заполнения места (про место, кстати, мы скоро поговорим).
- Для SEO и для визуального восприятия не забывайте использовать четкие заголовки контента в <h1>,<h2> и т.д., также уникальные заголовки страниц в <title>, <description>.
- Миф о «первом экране» или о том, что люди не хотят читать длинные страницы. Если у вас уже возник вопрос насчет «первого экрана» (да кто же их считает?), поясняю – это та часть веб-страницы, которая видна пользователю в первую очередь при загрузке сайта, то есть без дополнительной прокрутки. При аналитике мы часто сталкивались с тем, что пользователи не видят главный элемент сайта, потому что он находился не в «первом экране». Такая проблема при ее решении может только усугубить ситуацию, например, когда разработчики «напихивают» начало сайта всем, чем попало. Достаточно много места отнесено для «первого экрана», если опереться на интернет статистику со значениями стандартного монитора:На первую страницу не обязательно помещать все, что вы считаете важным для сайта. Опубликуйте только самое необходимое для правильного понимания деятельности вашей компании. Пользователь, скорее всего не станет прокручивать вниз, если вами не заинтересуется и это касается в первую очередь «холодных» посетителей (об этом немного выше – Идентичность и Навигация).Есть еще один интересный факт, давно выявленный при исследовании Джо Личен, которое объясняет, что малое (но скорее всего заинтересовывающее!) количество контента сверху сайта побуждает искать пользователя продолжение внизу.И если вы планируете следовать доказательствам Джо Личена , то используйте в конце страницы “лестницу” на верх:
- Какой бы дизайн не присутствовал у вас на сайте, не стоит делать яркие, громоздкие ссылки и кнопки! Не выделяйте много слов жирным шрифтом, от этого текст потеряет свою значимость и будет просто бес-по-лез-ным, останется не прочитанным, да и просто не таким красивым:
- Осторожно используйте всплывающие окна, иногда пользователь может уйти из-за «навязчивого окошка». Многие браузеры блокируют подобные окна самостоятельно, чтобы не загромождался экран.
Конечно, это может выглядеть очень удобно и красиво, но если вы протестируете и увидите, что пользователи пытаются закрыть всплывающее меню, то подобную информацию следует подавать по-другому:
Сайты, содержащие всплывающие рекламные окна и сомнительный контент, понижены в основной выдаче поисковых систем.
И в завершении можно сделать вывод, что каждый из нас становится экспертом в юзабилити, когда приходится пользоваться услугами через интернет – сайты.