Удобство сайта: Юзабилити тестирование сайта: как сделать сайт удобным

Содержание

Юзабилити веб сайта — основные принципы usability web сайтов

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

Почему важно соблюдать принципы юзабилити сайтов?

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

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

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

Принципы юзабилити web-ресурса

Разработка юзабилити сайта базируется на главном правиле: «чем проще — тем лучше». Чем более привычную структуру и интерфейс видит пользователь — тем легче ему сориентироваться и тем меньше времени он потратит, чтобы найти нужный раздел, т. к. будет чувствовать себя более уверенно.

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

1. Дизайн — залог доверия к сайту

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

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

Пример сайта, перенасыщенного графикой. Дизайн пестрит рассеивающими внимание цветовыми сочетаниями, обилием картинок.

2. Логичный структурированный контент

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

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

3. Важная информация — в левом углу

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

4. Общение с пользователем

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

Попав на такую страницу 404, пользователь не растеряется и, скорее всего, не сразу покинет ресурс.

5. Отмена действия

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

6. Ненавязчивое предложение помощи

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

Лучше, чтобы изначально данная форма была в свернутом состоянии, но при этом заметной — к примеру, в виде яркой боковой вкладки. И при этом не перекрывала часть контента на странице. Последнее относится и к кнопкам социальных сетей.

7. Разговор на понятном языке

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

8. Отказ от резких перемен

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

То же самое относится к веб-дизайну: пользователь не только потратит больше времени, но и разочаруется, заметив, что вместо значка корзины теперь — «Добавить товар», вместо «Каталог» — «Продукция», а привычные объемные кнопки обтекаемой кнопки стали плоскими и рублеными. Потому задумав «перестановку», не шокируйте посетителя — изменения должны быть постепенными и не менять кардинально привычную структуру.

9. Все возможности — на виду

Удачное решение — когда пользователь видит все разделы, в которые может перейти, т.к. в любой момент может быстро сориентироваться, где находится и как вернуться обратно. Если на сайте планируется много контента — резонно предусмотреть горизонтальное верхнее, вертикальное меню (и то, и другое — возможно, с подразделами), а также «подвал». Если речь идет о минималистичной «визитке» или landing page — достаточно только верхнего горизонтального меню.

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

Пример удачной карты сайта

10.

Форма регистрации и заказа: чем лаконичнее — тем лучше

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

11. Заметное длинное поле поиска

Соответствующая кнопка — лучший помощник посетителя. Особенно если речь идет о крупном ресурсе. Строку поиска пользователь должен обнаружить без труда. Чтобы при первом знакомстве он не тратил на обнаружение соответствующей строки даже несколько секунд.

Еще один важный момент — длина поля поиска. Согласно исследованию Якоба Нильсена, в среднем туда вмещается 18 символов, а оптимальная длина — 27 символов. В 90% случаев сюда поместится даже длинный запрос, чтобы пользователь его полностью увидел и исправил при надобности. Для установки нужной ширины используйте относительную единицу «em», равную размеру используемого шрифта.

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

12. Больше свободного пространства

Сайт можно сравнить с жилой комнатой: если каждый квадратный метр чем-то занят — человек будет чувствовать себя неуютно. Аналогично и здесь: если страница будет переполнена полезными блоками, разделами, ремарками и прочей информацией — посетитель потеряется и не поймет, куда устремить внимание в первую очередь. Современный дизайн склонен к минимализму: на странице — только самое важное.

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

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

Тестирование юзабилити

Новый интерфейс оценивается с двух позиций:

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

Количественная. Здесь оценивается скорость загрузки страниц, время отклика, перехода между страницами, поиска нужного раздела или кнопки.

Тестирование проводится самостоятельно либо при помощи специальных сервисов — к примеру, Яндекс.Метрики. Чтобы оценить юзабилити своими силами, нужно набрать группу из 5-6 человек из категории целевых пользователей, подготовить для них задания и вопросы по работе ресурса, сделать выводы из полученных результатов, исправить найденные ошибки. После внесенных изменений следует заново собрать фокус-группу.

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

Статью подготовила Виктория Закирова.

Юзабилити — удобство пользования сайтом

Юзабилити (от англ. usability) — это условное понятие, которым в интернет-маркетинге определяют удобство пользования сайтом, приложением или любым другим веб-интерфейсом. От качества этого фактора во многом зависит успешность продвижения в интернете. На актуальном этапе развития алгоритмы ранжирования Google и Яндекс достаточно точно определяют то, насколько удобным и полезным для посетителя оказался сайт.

Как анализировать юзабилити

Оценка статистики

Если говорить об оптимизации сайтов, ориентированных на аудиторию Рунета, то основным инструментом для анализа считается Яндекс.Метрика. Он позволяет получать полную информацию по трафику и его источникам. Здесь доступен «Вебвизор», который отслеживает пользовательское поведение. Карта кликов даёт возможность видеть, какие области страницы пользуются популярностью, а какие зоны посетители просто не замечают. Карта ссылок показывает пути передвижения и глубину взаимодействия юзеров. Этого вполне достаточно, чтобы оптимизатор мог понять, насколько сайт понятен для пользователей.

Тесты на страницах

Тестирование — это основа тонкой оптимизации юзабилити сайта. Под этим направлением анализа подразумевается внесение различных изменений с последующим отслеживанием результатов. Для фиксации эффекта используются возможности сервиса Яндекс.Метрика. К примеру, можно изменить цвет CTA-элементов, расположение форм, тексты призывов, объём контента на странице и многое другое. Практика показывает, что иногда даже незначительная коррекция может кардинально улучшить качество пользовательских факторов. Нужно отметить, что результаты сплит-тестов будут точны и стабильны только при активном трафике.

Профессиональная экспертиза

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

Анализ конкурентного окружения

Оценка юзабилити лидирующих игроков ниши — это лучшее решение для новых сайтов. Такая стратегия позволяет не двигаться вслепую, а сразу использовать проверенные решения. Сегодня значение пользовательских факторов при ранжировании имеет одно из решающих значений. Следовательно, если конкуренты находятся в тематическом топе, то с usability сайта у них точно всё хорошо. Используя выявленные положительные качества, вы, по сути, бесплатно получаете результаты усердной работы других оптимизаторов. Но просто копировать лидера не стоит, ведь то, что работает у него, не обязательно принесёт результат при внедрении на другом ресурсе — только сплит-тесты и аналитика помогут найти удачные идеи.

Оптимизация юзабилити на практике

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

Структура и навигация

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

Проработка главного меню. В идеале структура сайта должна позволять пользователю в 4—5 шагов «добираться» до любой страницы. Ссылки на важные страницы должны быть вынесены в шапку и футер для «сквозного» доступа.

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

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

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

Функциональные элементы

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

Оформление дизайна

Сегодня уже сформировался определённый тренд — это спокойные цветовые решения и минимализм. Не стоит увлекаться слишком яркими цветами и радикальными контрастами. Пришло время забыть про назойливые вплывающие окна. Цвета фона не должны мешать легко воспринимать контент.

Можно выделить следующие рекомендации по использованию заголовков и шрифтов:

откажитесь от чрезмерно маленьких или больших букв;

не используйте слишком вычурные шрифты;

тексты должны гармонично контрастировать с фоном их размещения.

При выборе цветовых решений стоит ориентироваться на следующие моменты:

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

яркий желтый, оранжевый и другие «кислотные» цвета быстро утомляют глаза пользователей;

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

Качественное наполнение страниц

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

Грамотность и информационная ценность. Тексты нужно писать понятным для целевой аудитории языком. Следует отказаться от сложных и неоднозначных конструкций. Старые тексты нужно проверять на предмет их текущей актуальности. Конечно же, контент должен быть грамотным.

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

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

Увеличение скорости загрузки

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

оптимизируйте графические элементы;

выберите хостинг с запасом производительности;

удалите лишние Java-скрипты;

проверьте корректность редиректов и переадресаций.

Оценить результат проделанной работы можно с помощью сервиса Google Page Insights.

Оптимизация страницы 404

С помощью сервиса Яндекс.Вебмастер можно найти несуществующие адреса. Если полностью избавиться от них нельзя, то нужно сделать следующее:

внедрить поиск по сайту на страницу 404;

показать карту ресурса со ссылками для быстрого перехода;

создать забавное оформление «битой» страницы.

Мобильная и мультибраузерная адаптация

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

Подведём итоги

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

Удобство сайта — как сделать юзабилити сайта удобнее для использования

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

Показатели юзабилити

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

продуктивность;

эффективность;

удовлетворённость.

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

Базовые критерии удобства сайта

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

простота освоения: может ли посетитель интуитивно разобраться в структуре ресурса;

результативность: срабатывают ли триггеры для совершения целевого действия;

запоминаемость: отпечатывается ли дизайн в памяти так, чтобы посетитель захотел вернуться;

соответствие потребностям: отвечает ли сайт привычкам ЦА;

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

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

Элементы для проработки

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

дизайн интерфейса, позволяющий быстро освоиться на странице;

понятная структура и навигация, с помощью которой можно найти всё, что нужно, с минимальным количеством переходов;

читабельность текстов: это касается шрифтов и объёма информации;

кнопки, цель которых – привлечь внимание, побуждая к нажатию;

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

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

Что ещё влияет на юзабилити

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

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

Ненавязчивое предложение помощи – ещё один полезный инструмент, положительно влияющий на комфорт при использовании. Всплывающие окна «задай вопрос» с автоматически открывающимся чатом могут раздражать, но яркая кнопка на видном месте покажет, что вы готовы помочь.

Как обеспечить удобство сайта

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

Результат за 3 клика: это усреднённый максимум, который пользователь готов совершить для достижения цели.

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

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

Перевёрнутая пирамида: этот принцип подачи материала предполагает, что главная информация размещается на первом экране, чтобы посетитель сразу получил ответ на свой вопрос.

Зрительный паттерн: движение взгляда во время знакомства с новой площадкой происходит по траектории F или Z, поэтому триггеры должны располагаться сверху слева.

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

Тестирование

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

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

Важные рекомендации

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

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

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

Юзабилити сайта зависит от вас

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

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

Закажи юзабилити-тестирование прямо сейчас

Заказать

Как сделать сайт более удобным для пользователей – Google AdSense

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

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

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

Проанализируйте эффективность сайта

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

Воспользуйтесь Search Console, чтобы узнать, насколько ваш сайт заметен в Google Поиске. Этот инструмент покажет, как часто ваш сайт появляется в результатах поиска, а также его среднюю позицию, CTR и т. п.
Отчет об эффективности позволяет узнать, как со временем меняется ваш поисковый трафик, откуда приходят пользователи и по каким запросам чаще всего показывается ваш сайт. Также вы увидите, у каких ваших страниц самый высокий и самый низкий CTR в Google Поиске.
Откройте новые возможности для повышения эффективности сайта и сделайте страницы более качественными с помощью Lighthouse. Отчеты Lighthouse помогут вам выявить и исправить распространенные проблемы, связанные с эффективностью, удобством и доступностью сайта.
Проведите проверку оптимизации для мобильных устройств, чтобы узнать, насколько отдельные страницы вашего сайта удобны для пользователей смартфонов и планшетов. Для этого нужно просто ввести URL страницы. Большинство пользователей Интернета просматривают сайты на мобильных устройствах. Поэтому очень важно оптимизировать сайт для смартфонов и планшетов.
Наши данные показывают, что 53 % пользователей уходят с сайта, если загрузка занимает более трех секунд. Проверьте скорость мобильного сайта и сравните результат с данными по отрасли в целом.

Сделайте сайт максимально удобным

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

AMP (Accelerated Mobile Pages) – это фреймворк с веб-компонентами, который позволяет создавать эффективные сайты, быстро работающие на всех устройствах.
Адаптивный дизайн предполагает использование HTML и CSS для автоматического сжатия или увеличения ресурсов на сайте. При этом страницы хорошо выглядят не только на компьютерах, но и на смартфонах или планшетах.
Современные веб-приложения позволяют создавать сайты с возможностью установки как для компьютеров, так и для мобильных устройств. Такие веб-приложения создаются и загружаются через Интернет. Они быстры, надежны и поддерживаются во всех браузерах.

Не забывайте о пользователях мобильных устройств

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

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

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

Чтобы узнать, как сделать свой сайт максимально удобным для пользователей, ознакомьтесь с рекомендациями по дизайну мобильных сайтов.

что это такое – удобство пользования сайтом

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

Как анализируется юзабилити

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

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

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

Среди сервисов аналитики популярностью пользуется удобная, информативная и бесплатная «Яндекс.Метрика».

Тестирование.
Существуют тесты, позволяющие отследить юзабилити или, например,
понять, какой вариант дизайна и структуры удобнее пользователям.
Популярный метод – так называемое A/B-тестирование: пользователь,
зашедший на сайт, видит один из двух вариантов, который выбирается
случайно. После этого статистика «Яндекс.Метрики» по разным вариантам
сравнивается и анализируется. Правда, этот способ подходит только для
сайтов, на которых много посетителей, чтобы статистика была
репрезентативной и информативной. При оценке юзабилити используются и
другие методы. Например, тестирование скорости с помощью сервиса Google
Page Insights: скорость тоже имеет значение для удобства пользования
сайтом.

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

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

Как улучшить юзабилити: структура

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

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

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

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

Карта сайта. Речь не о sitemap.xml, которая
существует преимущественно для поисковиков. Речь о HTML-карте, по сути,
еще одной странице, на которой приведена структура сайта со ссылками на
каждый раздел и подраздел. Наличие такой карты позволяет пользователям
не запутаться, особенно если она понятная и продуманная.

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

Проработка функциональных элементов

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

Создание удобного дизайна

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

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

Формирование качественного контента

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

Ускорение страниц

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

Поддержка разных устройств

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

Отсутствие ошибок

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

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

как сделать ресурс удобным для пользователей

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

Что такое юзабилити сайта

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

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

Юзабилити сайта оценивают не только посетители ресурса, но и поисковые системы. Команда Яндекса еще в 2011 году сообщила, что научила поиск определять, насколько ресурсы удобны и полезны для пользователей. Вот уже 8 лет поисковая система при ранжировании сайтов учитывает логичность структуры, понятность системы навигации и удобство интерфейса, расположение и объем рекламных материалов. Например, если людям неудобно взаимодействовать с ресурсом, а реклама перекрывает основной контент или затрудняет доступ к нему, то такой сайт будет ранжироваться ниже.

Основные параметры и единицы измерения

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

Обучаемость — легко ли пользователям выполнить ряд основных задач при первом взаимодействии с незнакомым интерфейсом.

Эффективность — насколько быстро пользователи выполняют основные задачи при повторном взаимодействии с интерфейсом ресурса.

Запоминаемость — как быстро пользователь научиться взаимодействовать с интерфейсом снова, если на время перестанет посещать ресурс.

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

Удовлетворенность — приятно ли пользователю взаимодействовать с интерфейсом ресурса, удобен и понятен ли он ему.

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

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

Каким должен быть сайт: рекомендации от Якоба Нильсена

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

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

размещения на каждой странице ресурса логотипа с активной ссылкой на главную;

добавления контактной информации в хедере и футере;

создания меню первого уровня на всех страницах сайта;

реализации «хлебных крошек».

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

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

Корректный и удобный внутренний поиск поможет пользователям быстрее найти необходимую информацию. Сделать поиск удобным несложно. Для этого нужно:

разместить поисковую строку на видном месте — чаще это верхний правый угол каждой страницы сайта;

ограничить длину поля для ввода запроса — не больше 30 символов;

реализовать функцию проверки корректности запросов — поиск должен уметь распознавать запросы с ошибками и предлагать возможно искомые варианты;

сделать поиск внутренним — если пользователь будет видеть результаты глобального поиска, то, вполне возможно, он перейдет на другие ресурсы;

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

Якоб Нильсен считает, что поиск с искусственным интеллектом, который может распознавать любые запросы пользователей, целесообразнее использовать на сайтах, которые содержат более 1 000 страниц. Небольшие ресурсы — от 100 до 1 000 страниц — вполне могут обойтись простым поисковым механизмом. На сайтах, содержащих менее 100 страниц, функцию поиска может взять на себя грамотно продуманная навигация.

Дизайн сайта

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

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

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

Тексты

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

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

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

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

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

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

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

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

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

Как улучшить юзабилити сайта: план действий и пять основных правил

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

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

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

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

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

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

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

Правило № 1: 7 пунктов

Человеческий мозг не способен концентрировать внимание на более чем 5–9 объектах. Яркий тому пример — списки в текстах. Если в них больше 5–7 пунктов, вы начинаете забывать о том, что было в начале этого списка.

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

Правило № 2: две секунды

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

Правило № 3: три клика

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

Правило № 4: закон Фиттса

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

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

Правило № 5: перевернутая пирамида

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

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

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

Юзабилити (удобство сайта) | O’ES

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

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

Магомед Чербижев, генеральный директор O’Es Marketing Agency, будет в числе выступающих экспертов с темой: «SEO-трафик для новостных сайтов/проектов и статейных разделов на коммерческих сайтах».

Посыл вашего бренда не ограничивается выбором слов. Среда, которой окружен этот посыл, не менее важна (а, возможно, даже более). Оригинал статьи взят с сайта neilpatel.com: 5 Psychology-Based Design Tips to Improve Engagement on Your Website Тонкие аспекты, такие как цвет, линии, форма и шрифт, имеют значение. Я уже ранее писал о важности типографии, цвета…

Представляем вашему вниманию перевод статьи о методах повышения конверсии от Нила Пателя. Оригинал взят с сайта www. quicksprout.com: 5 Ways Your Fans Can Help Optimize Your Site for Conversions Я внимательно изучаю Facebook уже некоторое время. Я испробовал сотни программ для создания рекламы. Я упорно трудился, чтобы добиться органического охвата для себя и своих…

Как разработать оптимальную страницу цен, учитывая психологические особенности человека? Перевод статьи Нила Пателя. Оригинал взят с сайта www.quicksprout.com: 9 Psychological Insights I Use When Designing a Pricing Page Я буду с вами честным. Я не веб-дизайнер. Но я работаю с удивительными веб-дизайнерами. И я знаю кое-что о веб-дизайне. Но когда доходит до дела, то я…

Представляем вам перевод статьи Волтера Чена, основателя и главного директора компании iDoneThis. Оригинал статьи взят из www.inc.com: Pokemon Go Is Driving Insane Amounts of Sales at Small, Local Businesses. Here’s How It Works Всего лишь за $ 1,19 в час можно заполучить больше клиентов, чем когда-либо до этого. Скорость распространения игры Pokemon Go –…

Ниже представлен перевод статьи, посвященной повышению конверсии, авторства известного американского маркетолога и блогера – Нила Пателя. Оригинал статьи взят c сайта neilpatel.com – 9 A/B Tests That You Can Run Tomorrow to Double Your Conversions Трафик – это один из наиболее важных компонентов, влияющих на рост вашего бизнеса. Но, как только вы закончили работу…

Введение в тестирование удобства использования веб-сайтов

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

Что такое

Юзабилити ?

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

Удобство использования включает в себя обучаемость, запоминаемость, эффективность, удовлетворенность и ошибки. Обучаемость — это то, насколько легко новому пользователю выполнять задачи при первом посещении вашего веб-сайта. Запоминаемость — это то, насколько легко кому-то вернуться к использованию вашего веб-сайта после того, как они не использовали его в течение определенного периода времени. Эффективность — это то, насколько быстро пользователи могут выполнять задачи на вашем сайте после того, как они ознакомятся с его использованием. Удовлетворение — это то, нравится ли пользователям дизайн вашего сайта, а под ошибками понимается количество ошибок, которые пользователи совершают при использовании вашего сайта, серьезность ошибок и то, насколько легко их исправить.

Почему веб-сайт

Удобство использования важно?

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

Тестирование удобства использования используется для тестирования всех форм взаимодействия людей с устройствами (Изображение предоставлено — Mediamatic)

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

Что такое

Тестирование юзабилити ?

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

Результат тестирования удобства использования с использованием устройства отслеживания взгляда показывает, куда смотрел пользователь и сколько времени он / она смотрел (Изображение предоставлено — зрение пользователя)

Существует 3 основных категории проверки удобства использования :

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

Типы

Юзабилити-тестирования Методы

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

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

Тестирование в коридоре: Использование случайных людей для тестирования веб-сайта, а не людей, которые обучены и имеют опыт тестирования веб-сайтов. Этот метод особенно эффективен при первом тестировании нового веб-сайта во время разработки.
Удаленный Юзабилити Тестирование: Тестирование юзабилити веб-сайта с использованием людей, которые находятся в нескольких странах и часовых поясах. Иногда удаленное тестирование выполняется с помощью видеоконференцсвязи, а иногда пользователь работает отдельно от оценщика. В настоящее время существует различное программное обеспечение, доступное по относительно низкой цене, которое позволяет проводить удаленное тестирование юзабилити даже наблюдателями, которые не являются экспертами юзабилити .Как правило, местоположения кликов и потоки пользователей записываются автоматически, и любые критические инциденты, произошедшие во время использования сайта, также записываются вместе с любыми отзывами, отправленными пользователем. Удаленное тестирование удобства использования позволяет регистрировать время, необходимое каждому тестировщику для выполнения различных задач. Это хороший метод тестирования, поскольку тесты проводятся в обычной среде пользователя, а не в контролируемой лаборатории.
Существует широкий спектр программного обеспечения для проведения удаленного тестирования юзабилити .На этом скриншоте показано одно из таких программ — Usabilla

Обзор эксперта: Эксперту в данной области предлагается оценить юзабилити веб-сайта. Иногда эксперта доставляют в испытательную лабораторию для тестирования на месте, в то время как в других случаях тесты проводятся удаленно, а автоматические результаты отправляются обратно для проверки. Автоматические экспертные тесты обычно не так подробны, как другие типы тестов юзабилити , но их преимущество в том, что они могут быть выполнены быстро.
Paper Prototype Testing: Проще говоря, метод проверки юзабилити включает создание грубых, даже набросков вручную, чертежей интерфейса для использования в качестве прототипов или моделей дизайна. Наблюдение за пользователем, выполняющим задачу с использованием таких прототипов, позволяет тестировать дизайнерские идеи с чрезвычайно низкими затратами и до того, как будет выполнено какое-либо кодирование. Дополнительные сведения о тестировании бумажных прототипов см. В статье « Paper Prototyping As A Usability Testing Technique»
Paper prototyping of an iPhone application (image credit — Golem.de)
Анкеты и интервью: Благодаря своему индивидуальному характеру, интервью позволяют наблюдателю задавать прямые вопросы пользователям (помимо двойной проверки того, что они на самом деле делают). Точно так же наблюдатель может задавать вопросы с помощью анкет. Преимущество анкет в том, что они позволяют собирать более структурированные данные . Однако они по своей природе жесткие, в отличие от интервью.
Юзабилити-тестирование анкет обычно передаются нам после того, как пользователь попытался выполнить данную задачу (Изображение предоставлено — Docstoc)
Пошаговое руководство «Сделай сам»: Как следует из названия, в этом методе наблюдатель настраивает юзабилити тест ситуацию, создавая реалистичные сценарии. Затем он или она проходит через работу, как пользователь. Разновидностью этого метода является групповое прохождение, когда у наблюдателя есть несколько участников, выполняющих прохождение.
Контролируемые эксперименты: Подход, аналогичный научным экспериментам, обычно включающий сравнение двух продуктов с тщательной статистической балансировкой в лаборатории. Это может быть самый сложный метод «в реальном мире», но из-за его научного характера он дает очень точные результаты, которые в конечном итоге могут быть опубликованы. U-Sentric)
Automated Usability Оценка: Вероятно, Святой Грааль тестирования usability .Были разработаны различные научные статьи и прототипы, чтобы попытаться автоматизировать тестирование юзабилити веб-сайта , все с разной степенью успеха. В этом блоге обсуждался один интересный подход — USEFul Framework Джастина Мифсуда. Вы можете прочитать об этом в статье «USEFul: платформа для автоматизации веб-сайта Usability Evaluation».

Что делать после веб-сайта

Юзабилити-тестирование завершено

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

Хотите узнать больше?

Если хотите…

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

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

Если, с другой стороны, вы хотите освежить в памяти основы UX и юзабилити, подумайте о том, чтобы пройти онлайн-курс по пользовательскому опыту. Удачи в вашем познавательном путешествии!

(Изображение: Depositphotos)

принципов удобства использования веб-сайтов | 5 ключевых принципов удобства использования веб-сайта

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

За последние несколько лет мы привыкли к определенным стандартам в веб-дизайне.

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

Это не означает, что удобство использования стало менее важным.

Он просто берет на себя другую роль в веб-дизайне, формируя основу для удобного взаимодействия с пользователем.

Удобство использования означает дизайн, ориентированный на пользователя.

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

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

1. Наличие и доступность

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

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

Вот несколько основных принципов доступности и доступности,

Время работы сервера — Важно, чтобы посетители не получали ошибку при загрузке вашего сайта.Вкладывайтесь в хороший хостинг. Вкладывайтесь в хороший хостинг. Мы никогда не срезаем углы, получаем хороший веб-хостинг, на который вы можете положиться.
Неработающие ссылки — Убедитесь, что на вашем сайте нет мертвых ссылок. Инструменты SEO, такие как Ahrefs и Screaming Frog, просканируют ваш сайт и найдут все неработающие ссылки.
Скорость отклика мобильных устройств — Убедитесь, что ваш сайт поддерживает работу с экранами разных размеров и медленными соединениями. Google также перешел на индекс, ориентированный на мобильные устройства, что означает, что они индексируют мобильные версии сайтов.Таким образом, отличный мобильный сайт поможет вам улучшить результаты поиска.

Amazon.com

Amazon.com — прекрасный пример доступного веб-сайта по нескольким причинам.

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

Во-вторых, у Amazon.com почти нет простоев. Очевидно, это то, что вы ожидаете от компании такого размера. Тем не менее, история постоянной доступности делает Amazon надежной и заслуживающей доверия сервисной платформой.

И последнее, но не менее важное: Amazon активно заботится о своей доступности. На своем веб-сайте они заявляют: «Мы всегда ищем способы повысить удобство использования сайта для наших клиентов, в том числе с ограниченными возможностями.Для программ чтения с экрана они специально рекомендуют свой мобильный сайт с более четким представлением содержания.

2. Ясность

Можно сказать, что в основе удобства использования лежит ясность.

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

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

Ясный и практичный дизайн может быть достигнут с помощью:

Простота — Сосредоточьтесь на главном. Если вы не будете отвлекать посетителей, они с большей вероятностью будут делать то, что вы от них хотите.
Знакомство — Придерживайтесь того, что люди уже знают.Нет ничего плохого в том, чтобы искать вдохновение на других сайтах.
Последовательность — Не будьте милыми. Создайте единообразное впечатление на всем своем веб-сайте, чтобы ваши посетители чувствовали себя непринужденно.
Руководство — Возьмите посетителей за руку. Не ждите, что посетители будут изучать ваш сайт в одиночку. Вместо этого проведите их по своему сайту и покажите им, что вы предлагаете.
Прямая обратная связь — обратная связь важна для любого взаимодействия.В тот момент, когда люди взаимодействуют с вашим сайтом, не забудьте указать на успех или неудачу их действий.
Хорошая информационная архитектура — Поймите ментальные модели посетителей и то, как они ожидают, что вы структурируете контент на своем сайте.

Яблоко

Apple известна своей компактной и удобной продукцией. Исключительную простоту бренда и акцент на то, что действительно важно, также можно найти на их веб-сайте.

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

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

3. Обучаемость

Обучаемость — еще один важный аспект удобства использования.

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

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

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

Microsoft

В прошлом году Microsoft изменила дизайн своего веб-сайта.

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

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

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

4. Доверие

Доверие — важнейший аспект любого веб-сайта.

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

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

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

L’ORÉAL

Бренд L’ORÉAL отлично справляется с задачей создания доверия в Интернете.

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

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

Помимо фактических исследований, бренд также использует отзывы экспертов и фотографии знаменитостей, таких как Джулия Робертс, чтобы убедить людей в качестве и популярности своей продукции. Еще один показатель доверия — связаться с L’ORÉAL очень просто.Бренд доступен не только в социальных сетях, но также легко найти физический адрес и номер телефона.

5. Соответствие

И последнее, но не менее важное: релевантность способствует удобству использования веб-сайта.

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

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

Nike

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

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

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

Удобство использования означает тестирование, тестирование и еще раз тестирование

Хорошее удобство использования не достигается в одночасье.

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

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

Введение в удобство использования и взаимодействие с пользователем в веб-дизайне

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

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

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

Почему удобство использования и удобство для пользователя так важны

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

User Experience (UX) — это то, как посетители думают о взаимодействии с вашим сайтом. Юзабилити — это функциональность, а UX (как следует из названия) — это опыт.

Давайте разберемся, почему оба эти элемента так важны:

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

4 Основы юзабилити в веб-дизайне

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

1. Очистить навигацию

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

Однако нет причин, по которым вы не можете съесть свой торт и съесть его. Для примера взгляните на веб-сайт Moller:

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

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

2.Производительность

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

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

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

3. Читаемость

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

Есть несколько способов улучшить читаемость вашего контента.Однако в большинстве случаев все сводится к выбору шрифтов и использованию контраста. Взгляните на домашнюю страницу WordPress.org, например:

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

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

4. Скорость отклика

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

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

Адаптация вашего сайта для мобильных устройств в наши дни не такая уж сложная задача. Фактически, большинство современных тем WordPress адаптивны «из коробки». Однако даже адаптивные веб-сайты могут не предлагать четкие схемы навигации или правильно масштабировать контент.Ваша работа — следить за этими потенциальными проблемами и решать их.

Заключение

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

Когда дело доходит до удобства использования, следует помнить о четырех основных принципах, чтобы получить наилучшие возможные результаты:

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

Если вам нужна дополнительная помощь в дизайне, обязательно посетите DesignRush.com!

Связанные ресурсы

Изображение предоставлено: Startup Stock Photos.

7-шаговое руководство по удобству использования веб-сайта

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

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

Удобство использования имеет далеко идущие последствия для бизнеса, чем достижение цели — он улучшает цель конвертируемости посетителей. Например, когда веб-сайт использует рекламу с оплатой за клик (PPC), удобство использования помогает улучшить показатель качества и конверсию, тем самым улучшая общую стоимость привлечения клиентов.Это также помогает повысить количество действий, поскольку клиент понимает веб-сайт, продукт, услугу или контент. По дополнительным причинам относительно того, почему удобство использования веб-сайта важно для любой компании, я советую прочитать статью под названием «Почему удобство использования веб-сайта важно для компании», которая была опубликована в этом блоге.

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

1.Хороший пользовательский интерфейс

Веб-сайты-портфолио обычно имеют очень креативный пользовательский интерфейс, чтобы продемонстрировать целевой аудитории их возможности дизайна и разработки (Источник: http://aylis.com/).

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

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

2.

Навигация Удобство использования

Пользователи обычно читают содержимое веб-страницы по F-образному шаблону.На этом изображении показаны тепловые карты из исследований пользовательского отслеживания взгляда. (Источник: Useit.com)

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

Research показало, что обычно пользователи читают веб-страницы по f-образному шаблону.Таким образом, имеет смысл разместить всю важную информацию, такую как логотип сайта и основной навигации с левой стороны. Для более крупных веб-сайтов хорошей техникой будет отображение внутренних страниц / категорий на левой боковой панели. Для некоторых примеров того, что хорошо, а что плохо navigation , можно начать с этой статьи в Smashing Magazine. Тем не менее, можно найти различные хорошие ресурсы даже с помощью простого поиска в Google

3. Функции поиска

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

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

Фактически, для крупных веб-сайтов электронной коммерции рекомендуется, чтобы помимо традиционного механизма поиска также была доступна опция расширенного поиска, чтобы посетители могли уточнить свои поисковые запросы путем выбора таких параметров, как цена, торговые марки. и обзоры.Полный набор рекомендаций по созданию интерфейса поиска можно найти в статье «10 Usability Guidelines for Designing the Search Interface».

4. Содержание

Удобство использования

Загроможденный контент сделает ваш сайт кошмаром юзабилити (и да, этот снимок экрана сделан с сайта 2012 года!)

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

5. Изображения для поддержки контента

Веб-страница без изображений очень скучна и трудна для чтения (Источник: Chrisguitars.com)

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

6. Видео для улучшения содержания

Такие сайты, как YouTube, позволяют очень легко встраивать видео в ваши веб-сайты или презентации

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

7. Быстрая загрузка веб-страниц

Как упоминалось выше, пользователи быстро покидают страницы, если их не привлекает их содержание. А теперь представьте, как быстро пользователи покидают веб-страницу, если этот контент загружается очень долго! Важность быстрой загрузки веб-страниц настолько велика, что Google включил скорость сайта в свой алгоритм ранжирования поиска.Это связано с тем, что их исследования подтвердили, что «более быстрые сайты создают счастливых пользователей» и «когда сайт медленно реагирует, посетители проводят на нем меньше времени». Чтобы оценить скорость вашего веб-сайта, вы можете использовать такие инструменты, как Google PageSpeed, Yahoo! YSlow и WebPageTest.

Заключительные слова

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

Хотите узнать больше?

Если хотите…

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

… тогда рассмотрите возможность пройти онлайн-курс Проведение
Юзабилити-тестирование.

Если, с другой стороны, вы хотите освежить в памяти основы UX и юзабилити, подумайте о том, чтобы пройти онлайн-курс по пользовательскому опыту.Удачи в вашем познавательном путешествии!

(Ведущее изображение: Адрианна Кальво через Pexels)

Юзабилити | Определение | Элементы | Руководство

Юзабилити — это термин, который в настоящее время очень распространен, особенно в дизайне веб-сайтов. Мы стремимся дать нашим клиентам простое, но полезное введение в то, что такое юзабилити и как вы можете его протестировать.

Удобство использования

Определение: что такое удобство использования?

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

Это индикатор, показывающий, является ли веб-сайт эффективным, легким в навигации и эффективным с точки зрения пользователей.

Юзабилити: часть пользовательского опыта

Удобство использования часто связано с пользовательским опытом. Но почему так?

Пользовательский опыт определяется ISO (Международным стандартом по стандартизации) как «восприятие и реакция человека в результате использования и / или ожидаемого использования продукта, системы или услуги».Понятно, что общее ощущение и восприятие веб-сайта / приложения зависит от удобства использования. Если на веб-сайте у меня возникают трудности при поиске информации или при попытке купить продукт, я считаю, что мой пользовательский опыт плохой. Если вместо этого веб-сайт будет работать безупречно, и я смогу найти и купить что угодно без каких-либо трудностей, то я останусь доволен своим пользовательским опытом. Допустим, юзабилити — важная часть пользовательского опыта.

Элементы удобства использования

Якоб Нильсен, защитник пользователей и основатель группы Nielsen Norman, считается гуру юзабилити.

Он известен своими «Юзабилити 5 компонентов», давайте рассмотрим их поближе.

Обучаемость : насколько легко для начинающих пользователей выполнять основные задачи на веб-сайте?
Эффективность : как быстро пользователи смогут выполнять задачи, узнав дизайн веб-сайта?
Запоминаемость : когда пользователи возвращаются на веб-сайт после периода бездействия, насколько легко они запоминают, как им пользоваться?
Ошибки : как часто пользователи делают ошибки? Насколько серьезны такие ошибки? Могут ли пользователи легко исправить эти ошибки?
Удовлетворенность : какова общая удовлетворенность пользователей дизайном веб-сайта?

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

Руководство по удобству использования

Принципы юзабилити в дизайне сайтов

Очевидно, что функции веб-сайтов различаются от сайта к сайту. Есть несколько общих для большинства случаев принципов юзабилити.

Пользователи сканируют веб-страницы, они часто бегло читают текст. Старайтесь давать только важную информацию, используйте изображения и эффективное письмо.
Мгновенное удовлетворение . Чем меньше пользователи ждут, тем лучше. Убедитесь, что навигация отличная.
Правило 3 щелчков . Пользователи должны иметь возможность находить интересующую их информацию на веб-сайте за 3 или менее клика.
Пользователям нравится, когда контролирует : дайте им возможность вернуться назад.Это означает: избегать открытия ссылок на новых страницах.
Чем больше вы протестируете , тем лучше. Тестирование юзабилити — лучший способ повысить эффективность веб-сайтов.
Эстетика имеет значение. Всегда.

Какие вопросы лучше всего подходят для юзабилити-тестирования веб-сайтов?

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

По шкале от 1 до 10, насколько легко было найти информацию ?
Насколько вероятно, что вы порекомендуете наш сайт друзьям / коллегам
Насколько легко вам было перемещаться по сайту по шкале от 1 до 10?
Что бы вы, , изменили в своем опыте?
Было ли содержимое чистым, а информация полной?

Примеры: каковы наиболее типичные проблемы с удобством использования?

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

Медленная загрузка страниц.Если людям придется ждать больше, чем ожидалось, они, вероятно, найдут другой веб-сайт.
Слишком много подменю и Перегрузка информацией может вызвать путаницу и стресс.
Отсутствие структуры сайта : хорошая практика — иметь четкую карту сайта, которую пользователи могут легко понять и использовать.
Несоответствие в дизайне. Также имеет значение внешний вид в Интернете: каждая страница и каждая функция веб-сайта должны выглядеть одинаково (например,грамм. такие же цвета, шрифт, стиль).

Бесплатный онлайн-инструмент для удобства использования веб-сайта

UserReport — это онлайн-программа, которая позволяет вам тестировать ваш сайт на реальных пользователях.

Он основан на двух простых инструментах — опросе и форуме обратной связи. Работает как

интегрированная часть вашего веб-сайта или приложения, она позволяет вам напрямую взаимодействовать с вашими пользователями

и выучить

Если они найдут ваш веб-сайт можно использовать
Каковы их ожидания
Что они думают вы можете улучшить

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

Начните тестирование своего сайта!

НАЧАТЬ

Что такое удобство использования в веб-дизайне?

Удобство использования. Пользовательский интерфейс. Пользовательский опыт. Я уверен, что в последнее время вы довольно часто сталкивались с этими терминами в веб-дизайне. Что они означают и чем они отличаются друг от друга?

«Удобство использования» — это удобство использования веб-сайта, определяемое тем, насколько легко посетители могут взаимодействовать с ним или выполнять то, что они намеревались сделать.«Пользовательский интерфейс» — это пространство, в котором посетители взаимодействуют с веб-сайтом. С другой стороны, «пользовательский опыт» относится к качеству взаимодействия, которое получают посетители при навигации по сайту. Этот термин был придуман Доном Норманом в 1993 году для его группы в Apple Computer. Эти три элемента идут рука об руку, чтобы удовлетворить потребности пользователей. Хорошо продуманный пользовательский интерфейс обеспечивает превосходное удобство использования и, в конечном итоге, приводит к положительному опыту пользователей.

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

Юзабилити на протяжении многих лет

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

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

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

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

Подробнее: Что такое пользовательское тестирование в веб-дизайне?

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

Элементы юзабилити и их приложения в веб-дизайне

Очистить навигацию

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

Веб-навигация — это процесс изучения веб-сайта: как вы прокручиваете экран, взаимодействуете с различными элементами и кнопками сайта или перемещаетесь с одной страницы на другую.

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

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

Подробнее: Почему главное меню вверху страницы?

Разборчивость, побуждающая к взаимодействию

«Контент — король», — написал Билл Гейтс в своем эссе 1996 года о том, как он предвидел Интернет как рынок контента.В наше время люди пошли еще дальше в этой концепции, сказав: «Контент — король, а вовлеченность — королева».

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

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

Производительность

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

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

Отзывчивость

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

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

Доверие

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

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

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

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

Повышение удобства использования

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

Обеспокоены удобством использования вашего веб-сайта? Поболтайте с нашей командой веб-дизайнеров в Брисбене.

Принципы юзабилити сайта

Взгляните на главную страницу своего веб-сайта. Сколько там элементов? Двадцать? Тридцать? У вас есть несколько несовместимых ссылок на разные части вашего сайта? У вас есть всплывающее окно, закрывающее страницу? У вас есть — ужас ужасов — счетчик посетителей? Если ответ на любой из этих вопросов утвердительный, ваш веб-сайт, вероятно, слишком сложен, и вы, возможно, упускаете преимущества хорошего удобства использования.

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

Иллюстрация OrangeCrush

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

Что такое удобство использования веб-сайта?

–

Давайте начнем с основ: что такое удобство использования веб-сайта?

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

Ясность и полезность — две цели удобства использования веб-сайта. Дизайн от akorn.creative Простота — ключ к удобству использования. Дизайн Bluesjay

Однако за этим основным определением скрывается множество сложностей. Фактически, вы быстро поймете, что сделать ваш сайт удобным для использования (сделав его простым!) — одна из самых сложных задач в веб-дизайне.

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

5 принципов удобства использования Интернета

—

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

Наличие . Доступность — это просто, насколько легко получить доступ к вашему сайту. Доступность вашего веб-сайта может зависеть от используемой вами платформы веб-хостинга и от того, насколько она совместима с устройствами, с которых пользователи получают к ней доступ.
Ясность .Ясность — это основа удобства использования веб-сайта. Посетители приходят на ваш сайт с конкретными целями, и мы обещаем, что эти цели не включают проверку ваших навыков веб-дизайна! Если дизайн вашего веб-сайта отвлекает или сбивает посетителей с толку, им либо потребуется больше времени, чтобы найти то, за чем они пришли, либо они могут вообще забыть о своей первоначальной цели и уйти. В любом случае они уходят недовольными и вряд ли вернутся.
Признание . Распознавание — это способ описания процесса обучения, который предпринимают пользователи, когда они посещают новый сайт.Возможно, вы не почувствуете, что ваш веб-сайт нужно изучать для использования, но на самом деле всем сайтам требуется как минимум несколько секунд оценки, прежде чем пользователь сможет с ними взаимодействовать. Подавляющему большинству пользователей, например, в какой-то момент потребуется вернуться на вашу домашнюю страницу, и большинство будет искать для этого логотип в верхнем левом углу экрана. Если ваш веб-сайт работает иначе, им придется потратить несколько секунд на то, чтобы узнать, как вернуться на главную страницу. Когда вы проектируете для удобства использования, старайтесь, чтобы эта кривая обучения была как можно короче.
Доверие . Даже если клиенты могут легко найти контент или функции, которые они ищут, если они им не доверяют, веб-сайт для них хуже, чем бесполезен. Есть много способов продемонстрировать свою надежность с помощью дизайна веб-сайта, например, открыто рассказать о своем бизнесе и целях.
Актуальность . Релевантность — это, пожалуй, самая сложная проблема юзабилити, потому что она описывает, привлекает ли контент, который ваши клиенты видят на вашем сайте.Создание привлекательного контента включает в себя тщательное определение вашей целевой аудитории, определение того, чего она хочет, и максимально четкое удовлетворение ее потребностей.

Эти пять принципов являются наиболее важными аспектами удобства использования веб-сайта. Но бывает сложно увидеть, как эти элементы реализованы в реальном мире, поэтому давайте рассмотрим пример. Пожалуй, лучший пример юзабилити сайта: Amazon.com.

Через Amazon

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

Такое удобство использования не случайно. На своем веб-сайте Amazon прямо заявляет о своей приверженности удобству использования: «Мы всегда ищем способы улучшить удобство использования сайта для наших клиентов, в том числе с ограниченными возможностями.«Читателям с экрана они специально рекомендуют свой мобильный сайт из-за его более четкого представления содержания.

Сравнение удобства использования веб-сайта и доступности и UX

—

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

Новаторское сочетание изображения и текста может улучшить доступность и удобство использования.Дизайн ложкой lancer

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

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

Юзабилити веб-сайта также часто путают с другим подходом, связанным с веб-дизайном: пользовательским интерфейсом (UX). Удобство использования веб-сайта лучше всего рассматривать как подмножество UX, поскольку UX обычно обозначает более широкую область изучения и дизайна, чем просто веб-взаимодействия. UX включает в себя все, от взаимодействия человека с машиной до антропологии искусственного интеллекта.Большинство учебных курсов по пользовательскому опыту подчеркивают, что идеи, на которые они опираются, применимы к невероятно широкому спектру контекстов и устройств, а не только к веб-сайтам.

UX означает обеспечение согласованных интерфейсов на нескольких устройствах. Дизайн Майка Барнса

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

Дизайн для удобства использования веб-сайта

—

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

Четкая структура навигации — ключ к удобству использования в Интернете. Дизайн MercClass

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

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

1. Исследование пользователей

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

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

Например, пользователи, которым нужна подписка на доставку торта, должны знать, как работает подписка. Дизайн веб-сайта DSKY

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

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

По сути, домашняя страница Microsoft имеет очень простую структуру. Via Microsoft.com

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

2. Структура

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

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

Что ищут посетители моего сайта?
Какой контент наиболее важен для посетителей?
Какая информация нужна каждому посетителю, и какая информация актуальна только для некоторых посетителей?

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

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

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

Как и веб-сайт Microsoft, навигация Nike очевидна. Via Nike.com

Бренд предлагает спортивную одежду и инвентарь для разных видов спорта, а также для разных категорий людей. Когда вы впервые заходите на сайт, вы можете выбрать, как вы хотите перемещаться по нему: вы можете выбрать просмотр их магазина мужчинами, женщинами или детьми, или вы можете просматривать их по видам спорта. Например, если вы ищете новые кроссовки, вас даже не заботят все туфли для тенниса или домашнего спорта, которые у них есть.На веб-сайте Nike очень легко найти именно то, что вы ищете, а — всего лишь , что вы ищете.

3. Нанять веб-дизайнера

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

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

Тестирование юзабилити сайта

—

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

Дайте пользователю то, что он хочет. Дизайн Mila Jones Cann

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

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

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

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

Юзабилити — важная часть хорошего дизайна веб-сайта

—

Использование веб-сайта не является обязательным. Это показатель, который можно применить к любому веб-сайту, и он описывает, насколько он эффективен и является ли он эффективным вложением средств.

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