Правила юзабилити сайта

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

Что такое usability, и почему это важно?

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

Круг, один из самых известных юзабилити-специалистов в мире, пишет:
«Ясность и простота веб-страницы – как хорошее освещение для витрины магазина, при них все кажется лучше».

Люди в целом и пользователи интернета в частности стали очень нетерпеливы. По данным Nielsen Norman Group, они проводят на одной странице в среднем 27 секунд и редко прокручивают страницу до конца. Якоб Нильсен объясняет это тем, что «в интернете огромное количество бесполезной информации. Поэтому если бы пользователи подробно изучали каждый из открытых сайтов, они никогда бы не отключались от сети и не жили бы реальной жизнью».

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

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

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

Юзабилити и веб-разработчики

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

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

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

Особенности восприятия информации в интернете

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

Правила и приемы юзабилити

Для юзабилити сайта характерен принцип «Чем проще, тем лучше»; наличие стандартных приемов в интерфейсе сайта также является преимуществом. Ведь если пользователь когда-то уже видел что-то подобное (в навигации, элементах страницы или чем-нибудь другом), он будет знать, как этим пользоваться.

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

Навигация

1. Рекомендуется делать одинаковую навигацию на всех страницах сайта
2. На всех страницах должен быть логотип или название сайта (обычно на него «вешают» также ссылку на главную страницу). Традиционное расположение логотипа – верхний левый угол
3. В шапке сайта и в «подвале» должна находиться контактная информация (хотя бы телефон)
4. На всех страницах сайта должно быть меню первого уровня (а желательно, и второго)
5. На странице должно содержаться название раздела
6. Желательно расположение указателя «Вы находитесь здесь» (выделение текущего раздела в меню, «хлебные крошки»)
7. На странице должно быть понятно, что является ссылкой, а что нет. Рекомендуется выделять ссылки одинаково на всех страницах, а также делать их подчеркнутыми.

Внутренний поиск

Как показывают исследования, пользователи нередко ищут информацию на сайте, сразу прибегая к внутреннему поиску, не пользуясь системой навигации. Как определить, когда нужен внутренний поиск по сайту, а когда нет? Якоб Нильсен приводит следующее правило: «На практике, если на сайте доступно меньше 100 страниц, посетитель вполне может обойтись и без применения функции «Поиск». Если сайт содержит от 100 до 1000 страниц, на нем желательно разместить простой поисковый механизм. Если же количество страниц превышает 1000, в таком случае самое время задуматься над созданием эффективной поисковой системы на сайте».

Чтобы поиск был удобным, следует придерживаться следующих правил:

1. В идеале форма поиска должна размещаться на всех страницах сайта в верхней области (традиционно, верхний правый угол).
2. Оптимальная длина поля для ввода запроса – 27-30 символов
3. Поиск на сайте должен быть только внутренним (по сайту). Не следует предлагать пользователям поиск на внешних ресурсах, в интернете, так как для этого существуют глобальные поисковые системы.
4. Оформление страницы с результатами поиска должно быть максимально приближенно к странице выдачи глобальных поисковых систем: содержать поле для ввода запроса с введенным посетителем запросом, список результатов должен содержать заголовок (со ссылкой), краткое описание, можно также добавить URL или раздел, к которому относится результат.
5. Используйте функцию проверки орфографии, как в глобальных поисковых системах. При вводе поискового запроса с ошибкой следует выводить строку «Возможно, Вы имели в виду [правильное написание запроса]?»

Главная страница

Главная страница – это лицо сайта, поэтому:

1. Главная страница должна объяснять, что это за сайт и для чего он был создан, обычно для выполнения этих функций используется слоган и текст приветствия.
2. На главной странице должен быть обзор содержимого сайта, например, выгодные предложения, последние статьи, а также обзор сервисов, например, авторизация, подписка на рассылку новостей
3. Также на главной странице желательно присутствие периодически обновляемой информации: анонсы новостей, корпоративного блога.
4. С. Круг упоминает об одной важной особенности главной страницы, которой очень часто пренебрегают: наличие ссылки или подсказки «Откуда мне начать». Как было сказано выше, пользователи часто выбирают наиболее очевидный или простой вариант дальнейшего перехода по сайту, поэтому при разработке сайта важно дать пользователю понять, откуда же ему следует начать, чтобы перейти к самому главному содержанию, чтобы что-то найти или просто побродить по сайту.

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

Текст и его оформление

При написании текста для сайта можно сформулировать два основных правила:

1. Старайтесь писать короткие тексты
2. Писать тексты следует по так называемому правилу «пирамиды», начиная с основных выводов и далее приводя обоснование и более подробно рассматривая тему. Старайтесь, чтобы самая интересная и полезная часть информации находилась в верхней части контентной области и была доступна без прокрутки страницы.

По оформлению текста можно дать следующие рекомендации:

1. Размер основного шрифта должен быть не меньше 12 px (что примерно соответствует привычным 10 pt в MS Word) пунктов.
2. При подборе шрифтов следует пользоваться относительными величинами (а не фиксированным размером).
3. При выборе типа шрифта следует ориентироваться на то, что на мониторе (в отличие от бумаги) более удобно читается текст, набранный шрифтом «без засечек». Для справки, шрифты «без засечек»: Arial, Arial Black, Verdana, Tahoma, шрифты «с засечками»: Times New Roman, Georgia.
4. На сайте не следует использовать более четырех разных цветов текста. Не следует также забывать, что пользователи придают одинаковое значение элементам, которые визуально выглядят одинаково.
5. Не следует использовать только прописные буквы, так как при этом снижается скорость чтения и затрудняется восприятие.
6. Текст и фон должны быть достаточно контрастны, лучший вариант – черный текст на белом фоне. Следует избегать таких сочетаний цветов как красный текст на синем фоне, оранжевый – на темно-зеленом и другие, так как подобные сочетания цветов порождают «эффект дрожания» и создают сильную нагрузку на зрение.
7. Пользователи негативно относятся к мигающему тексту и бегущим строкам, поэтому следует избегать подобных приемов.

Дизайн для людей с ограниченными возможностями

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

Приемы, которые помогут сделать сайт общедоступным:

1. Разрабатывайте навигацию таким образом, чтобы управлять сайтом было возможно только с помощью клавиатуры (без использования мыши).
2. Ставьте в начало каждой страницы ссылку на главную страницу, чтобы это было первое, что произносит экранный диктор
3. Научите формы взаимодействовать с экранными дикторами, это реализуется с помощью тэга label, связывающего поля формы с текстом подсказок.
4. Снабдите каждое изображение описанием, так как изображения игнорируются экранными дикторами
5. Для людей с ослабленным зрением, если таковые входят в основную аудиторию сайта, предусмотрите разные варианты размера шрифта, сделайте функцию переключения между размерами текста на странице, не полагаясь на возможности браузера.
6. Постарайтесь использовать технологию javascript по минимуму, так как она пока воспринимается хорошо не всеми адаптационными технологиями.

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

Что делать, если сайт уже существует?

Как быть, если сайт уже создан, а дизайн утверждался долго и болезненно? Неужели все переделывать?

Иногда сайты действительно находятся в таком состоянии, что проще брать и все переделывать с нуля, однако чаще всего они нуждаются лишь в «небольшом косметическом ремонте». В любом случае, чтобы не повторить собственные ошибки, следует обратиться к квалифицированным специалистам. Беда часто состоит в том, что лицо, принимающее решение о дизайне/интерфейсе сайта, делает выводы об удобстве использования, основываясь только на своем опыте и предположениях; часто бывает, что на протяжении утверждения дизайна «глаз замыливается», и теряются цели, которые ставились изначально. Конечно, практикующие юзабилисты не знают лучше вас вашу предметную отрасль, но они знают лучше интернет, пользователей интернета и их потребности. Что можно сделать? Самый первый и простой шаг – обратиться за консультацией к профессиональному юзабилити-специалисту. Второй, более серьезный шаг - провести исследования сайта: классическое юзабилити-тестирование и ай-трэкинг исследование, причем в фокус-группу можно привлечь респондентов, совпадающих с целевой аудиторией сайта. Этот вариант дает полную картину недостатков текущего сайта, а при правильном взаимодействии на данном этапе с проектировщиком или дизайнером можно значительно улучшить удобство использования сайта.

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

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

И вот тут многие предприниматели задаются вопросом, а можно ли управлять таким меняющимся фактором, как внимание посетителя сайта? Можно или «зацепить» это внимание, с помощью которого достигаются цели, поставленные перед компанией.

Помогает добиться этой поставленной цели, так называемое юзабилити сайта.

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

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

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

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

На что обратить внимание или критерии юзабилити

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

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

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

Исходя из этого, нужно понять, что за такое короткое время, Ваш сайт должен донести до пользователя как можно больше нужной ему информации, объяснить, что за сайт, заинтересовать его и самое главное, удержать.

6 ОСНОВНЫХ КРИТЕРИЕВ ПОВЫШЕНИЯ ЮЗАБИЛИТИ ВЕБ-РЕСУРСА:

1. Предоставление информации, которая является для посетителя гарантом надежности.

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

2. Быстрый и удобный внутренний поиск по сайту с помощью кнопки «поиск».
Если посетитель зашел на сайт и не может быстро найти на нем, то что ему нужно, он, вероятнее, всего покинет страничку. Но если в первые секунды он увидит кнопку «поиск», то это даст «второй шанс» Вашему сайту.

3. Адаптивность сайта.

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

4. Эффектный, но при этом удобный дизайн сайта. Дизайн не должен быть отвлекающим, оформление должно быть выполнено в стиле «минимализм», то есть нужно отказаться от лишней информации и структурных элементов. Чем проще, тем лучше – таково основное правило юзабилити. Если на сайте присутствует большое количество ненужной информации, то это увеличит степени дискомфорта посетителя на Вашем сайте, ему будет сложно сориентироваться и разобраться, что и где искать. Кроме того, максимально простая и понятная структура и дизайн позволяют пользователю интуитивно запомнить ресурс и удобство работы с ним, что сыграет на руку компании при последующих посещениях юзером сайта.

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

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

Юзабилити сайта – это наиболее важный критерий эффективности веб-ресурса. Очень важно, чтобы пользователь, попавший на ваш сайт, не тратил время на понимание структуры и навигации по сайту, не искал на сайте вспомогательные функции, а элементы дизайна не мешали просмотру сайта.

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

Почему Вам следует уделять особое внимание удобству (юзабилити) Вашего сайта?

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

Ключевыми параметрами эффективности юзабилити интернет-магазина являются:

• Простая навигация — это возможность быстро понять функции сайта, значение и расположение кнопок меню и т.д.;
• Быстрое запоминание — легко ли посетитель сайта сможет вспомнить алгоритм пользования интерфейсом сайта, после долгого не посещения сайта;
• Минимум ошибок — количество сбоев, происходящих в процессе работы с Вашим сайтом, должно быть минимальным, а в идеале, полностью отсутствовать;
• Быстрый результат — быстрота выполнения целевого действия пользователем после ознакомления с функционалом сайта;
• Практичность сайта — определяется уровнем полезности для Вашей целевой аудитории контента на сайте;
• Эстетичность сайта — соответствует ли ожиданиям Вашей целевой аудитории график, дизайн, цветовые решения сайта и не возникнет ли от этого отторжение пользователя;
• Удовлетворенность пользованием Вашим Интернет-ресурсом;
• Целостность — это комплексное объединение всех параметров эффективности юзабилити Веб-сайта.

При работе над юзабилити сайта рекомендации могут быть следующими.

Улучшение юзабилити сайта интернет-магазина невозможно без юзабилити интерфейса сайта под девизом – чем проще, тем лучше! Главный принцип, это использование унифицированных моделей оформления Веб-страниц при юзабилити веб-сайта. Согласитесь, что если посетителю уже знакомы пункты меню и расположение кнопок, то ему не нужно тратить время на изучение алгоритма пользования Вашим сайтом. Он будет сразу знать, что делать, чтобы совершить любое действие.

Хорошим инструментом для улучшения юзабилити сайта будет установка так же и онлайн-консультанта на сайт.

Если у посетителя вашего сайта появятся дополнительные вопросы, либо он не найдёт нужной информации на странице сайта, он всегда сможет обратится к вам с вопросом.

При юзабилити сайта конверсия интерфейса основывается на следующих основных принципах:

1. Понятная и удобная навигация. Основные разделы размещаются в горизонтальном меню, а дополнительные разделы в вертикальном меню. Хорошо продублировать в футере главное меню. На сайтах со сложной структурой, желательно вывести перечень всех категорий и подкатегорий на отдельную страницу в виде интуитивно понятного списка.
2. От отсутствия ошибок Вас защитит только ежедневное тестирование. Некорректная работа сайта, неправильные ссылки или неработающие кнопки выливается в потерю посетителей и возможных клиентов. Нерабочий сайт никому не интересен, но от ошибок никто не застрахован, а для этого случая оформите свою страницу 404, стилизованную под Ваш сайт.
3. Максимально информативное оформление шапки сайта (хэдера), на которой большинство посетителей дольше всего задерживают свой взгляд, даже не прокручивая вниз веб-страницу. Если в шапке нет такой информации как меню или контактных данных, то вряд ли посетитель будет тратить время на поиски нужной ему информации. В хэдере (шапке) размещаются данные, на которые, в первую очередь, нужно обратить внимание посетителей.
4. Чтобы информация легко воспринималась на сайте должно быть довольно просторно, а текст нужно оформить с большим шрифтом и нормальным междустрочным интервалом. Чем меньше на странице баннеров, иконок, различных кнопок, анимации и всякой ненужной информации, тем комфортнее на сайте посетителю.
5. Качество текста обеспечивает доверие посетителя к Вашему сайту. Грамотно написанный текст, передающий смысл раздела сайта и исчерпывающую информацию, написанный без ошибок и красиво отформатированный, привлечет внимание потенциального покупателя. Посетителю самому захочется прочитать Ваш текст, если в тексте будут заголовки и подзаголовки, важная информация и ключевые слова выделены жирным шрифтом или маркерами, текст будет разбит на абзацы из 3-4 предложений, а также будут использованы нумерованные или маркированные списки
6. На сайте обязательно должен быть фильтр и поисковая строка, ведь большинство посетителей посещает данный сайт с целью побыстрей найти какую-либо информацию.
7. Львиная доля посетителей очень нетерпеливы (особенно молодежь) и они хотят «мгновенно» получить искомую информацию. Удовлетворить это требование посетителя может только быстрая скорость загрузки сайта. Вы должны за десяток секунд информировать о себе посетителя, заинтриговать его и заставить совершить дальнейшие действия, так как посетитель, в среднем, проводит на странице сайта 27 секунд и если за это время он не найдет нужную ему информацию, а будет ждать пока все это время сайт будет загружаться, то он уйдет с сайта.
8. Правило трех кликов – посетитель должен получить всю искомую информацию в три клика мышью. Если Ваш сайт сложен по структуре, то лучше уделить больше внимания на интуитивность и упорядоченность информации на сайте. Если посетитель будет прекрасно понимать о его местонахождении на сайте и как он может попасть на другие страницы или на главную страницу, то даже двадцать кликов его не остановят.
9. F- и Z-паттерны. Среднестатистический посетитель сайта разглядывает информацию на сайте по определенной траектории, выглядящие в форме букв F и Z. Вся важная информация располагается по траектории этих букв.

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

Юзабилити аудит сайта заключается в улучшении 127 поведенческих факторов SEO-оптимизации, таких как процент конверсии, время пребывания посетителя на сайте, информативность текстов, и остальных факторов. Юзабилити анализ сайта интернет-магазина поможет поднять его в позициях поисковых систем и увеличивает количество потенциальных клиентов.

Этот процесс можно назвать конверсией. Конверсия юзабилити своей конечной целью имеет превращение посетителя сайта в Вашего клиента.