Пример юзабилити сайта: Что такое юзабилити сайта — влияние юзабилити сайта на SEO


21.11.2020 Facebook Twitter LinkedIn Google+ Разное


Содержание

Что такое юзабилити сайта - влияние юзабилити сайта на SEO

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

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

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

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

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

Юзабилити сайта формы и содержания

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

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

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

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

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

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

Обучение продвижению сайтов

Подробно о том, как выводить сайты в ТОП 10 поисковых систем Яндекс и Google, я рассказываю на своих онлайн-уроках по SEO-оптимизации (смотри видео ниже). Все свои интернет-проекты я вывел на посещаемость более 1000 человек в сутки и могу научить этому Вас. Кому интересно обращайтесь!

На этом сегодня всё, всем удачи и до новых встреч!

Как улучшить UX сайта — 12 советов по юзабилити

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

1. Меню и навигация по сайту

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

1.1. Где использовать горизонтальное меню?

Такое меню органично смотрится на сайтах, посвященных одной определенной тематике, или корпоративных порталах.

Плюсы:

  • занимает меньше места, чем вертикальное;
  • не нужно скроллить.

Минусы:

  • расположенные слева пункты привлекают больше внимания;
  • воспринимается медленнее, чем вертикальное.

1.2. Где использовать вертикальное меню?

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

Плюсы:

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

Еще один вопрос, связанный с вертикальным меню: где именно его разместить?

1.2.1. Зачем размещать вертикальное меню слева?

В большинстве случаев при беглом просмотре страниц взгляд пользователей движется по F-образной траектории. Это так называемый F-Shaped Pattern.

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

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

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

1.2.2. Зачем размещать вертикальное меню справа?

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

Известный в среде интернет-маркетологов блог Devaka.ru

2. Какие шрифты использовать

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

Читайте по теме:

2.1. Семейство гарнитур

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

Распределение операционных систем в мире. Данные 2014 года

Пользователям Windows хорошо знакомы гарнитуры Arial, Tahoma, Verdana, Times New Roman, Georgia, Courier а также множество других, нестандартных шрифтов. Они установлены по умолчанию. На UNIX-платформах используются их аналоги. Правда, выглядят эти шрифты не совсем так, как в Windows, да и не для каждого нестандартного шрифта найдется соответствующий аналог.

Позвольте, спросите вы, но причем здесь сайты? Дело в том, что при загрузке сайта обычно никто не заливает на сервер файл со шрифтами. Из-за этого текст, набранный Arial, для пользователей Ubuntu, например, будет отображаться по-другому, чем для пользователей Windows.

Читайте по теме: Шрифты, общие для всех (актуальных) версий Windows, и их Mac-эквиваленты.

Самое простое решение вопроса — использовать шрифты из Google Fonts. Их легко подключать, кроме того, среди них нет некачественных гарнитур. Базовая рекомендация — сочетать для заголовка/основного текста шрифты с засечками/без засечек. Например, Antiqua для основного текста и Grotesque для заголовков. Еще несколько удачных, на мой взгляд, комбинаций из Google Fonts: Open Sans + Lora:

PT Sans + PT Serif:

PT Serif + Open Sans:

2.2. Вертикальный ритм текста

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

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

Высота элементов кратна высоте строки. Например, заголовок h2 — три высоты строки, h3 и h4 — две высоты строки. Пример соотношения размеров заголовков и текста в CSS:

h2 {font-size:36px; line-height:48px; margin:24px 0;}h3 {font-size:30px; line-height:48px; margin:24px 0;}h4 {font-size:24px; line-height:24px; margin:24px 0;}p {font-size:16px; line-height:24px; margin:24px 0;}

Здесь для простоты значения указаны в пикселях. На практике обычно используют относительные единицы «em» или «rem». Так будет выглядеть текст с данным оформлением:

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

Например:

2.3. Как выбрать нужный контраст шрифта и фона?

Хороший контраст:

Плохой контраст:

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

Рекомендую использовать цвет шрифта от #000 до #333.

2.4. Оптимальная длина строки

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

2.5. Оформление ссылок

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

3. Когда стоит использовать кнопки?

Рекомендую использовать кнопки, когда надо заставить пользователя выполнить важное действие (CTA) — зарегистрироваться, купить, скачать.

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

3.1. Где расположить кнопку?

Кнопки с важными CTA рекомендуется располагать справа. Это связано с тем, как пользователи просматривают страницу.

Диаграмма Гутенберга показывает ориентацию взгляда пользователя

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

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

Суммируем все рекомендации:

  1. Используйте горизонтальное меню на сайтах, посвященных одной определенной тематике, или корпоративных порталах.
  2. В горизонтальном меню более важные пункты размещайте слева.
  3. Используйте вертикальное меню для крупных интернет-магазинов или порталов с большим количеством разделов.
  4. Если аудитория сайта постоянна и растет незначительно, меню стоит расположить справа, так как большинство пользователей уже знакомы с разделами сайта.
  5. Используйте шрифты из Google Fonts для обеспечения единообразного отображения на разных платформах (Windows, Mac, UNIX).
  6. Сочетайте для заголовка/основного текста шрифты с засечками/без засечек.
  7. При верстке сайта рекомендуется задавать такой размер шрифтов и междустрочный интервал, чтобы все элементы текста вписывались в горизонтальную сетку. Таким образом соблюдается вертикальный ритм текста.
  8. Для проверки контраста шрифта/фона сделайте скриншот страницы и переведите картинку в оттенки серого в любом редакторе. Если текст по-прежнему легко прочитать, то контраст достаточный.
  9. Чтобы читатель не уставал, рекомендуется задавать длину строки на десктопе в 60-75 символов.
  10. Используйте выравнивание текста по левой стороне экрана, чтобы избежать появления слишком больших пробелов между словами при отображении на мобильных устройствах.
  11. Никогда не используйте нижнее подчеркивание для выделения текста.
  12. Кнопки с важными CTA рекомендуется располагать справа, в четвертом квадрате по диаграмме Гутенберга.

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

что это такое, принципы и рекоменации улучшения

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

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

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

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

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

к оглавлению ↑

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

Удобство сайта для пользователя можно оценить по следующим составляющим:

  • наличие формы поиска на сайте. Обычно размещается в самом заметном месте – в шапке или вверху в сайбаре;
  • навигация. Очень хорошо себя зарекомендовали «хлебные крошки». Они позволяют перейти пользователю, как на главную, так и в раздел или под раздел, где находится статья или товар;
  • контактные данные в шапке сайта для коммерческих проектов (телефоны, электронная почта, адрес офиса). Желательно наличие отдельной страницы «О компании» (с адресом офиса, сертификатами), где бы пользователь увидел, что компания надежная и ей можно доверять.
  • удобство и простота использования сайта, переходов по нему и поиск информации – это основа юзабилити. Например, «Правило трех кликов» - согласно которому посетитель должен сделать на более 3 кликов, чтобы найти интересующую его информацию.
  • корректное отображение сайта и всех элементов на нем. Подразумевается не только кроссбраузерность, но и наличие мобильной версии. Элементы не должны наезжать друг на друга, закрывать просмотр текста на странице;
  • дизайн. В этом вопросе, не редко происходит конфликт дизайна и юзабилити. Рекомендации юзабилити сайта предполагают минималистичный дизайн, с минимумом графических элементов, влияющих на восприятие контента, но и на скорость загрузки ресурса в целом.
  • контент. Материалы на сайте не только должны быть полезными для посетителя, но и удобны для восприятия посетителями. Юзабилити статьи включает: логическую структуру подачи текста, оформление заголовков внутри статьи, содержание страницы для быстрой навигации, наличие иллюстраций и видео, выделение ключевых мыслей. Подробнее по ссылке https://inetsovety.ru/struktura-i-oformlenie-statyi-na-sayte/
к оглавлению ↑

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

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

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

Человек закроет сайт в течение первых 15 секунд, если:

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

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

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

к оглавлению ↑

Рекомендации для улучшения юзабилити сайта

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

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

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

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

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

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

к оглавлению ↑

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

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

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

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

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

Подытожим, какие параметры улучшают юзабилити сайта:

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

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

С уважением, Виктория – блог inetsovety.ru

Как провести аудит юзабилити сайта бесплатно

Есть проблемы с ранжированием, проект не растет, хотите проверить работу своих специалистов по продвижению? Закажите профессиональный аудит в Семантике

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

Подпишись на рассылку и получи книгу в подарок!

 

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

Аудит юзабилити сайта: общая информация

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


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

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

 

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

 

Как сделать юзабилити анализ: пример юзабилити аудита сайта

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

Здесь мы видим, что «Каталог товаров» и «Производство фланцев» — не совсем корректно смотрятся, с учетом того, что производство фланцев это скорее деятельность.

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

Справа нам бросается в глаза недоработанный блок новостей. Последняя новость датирована аж 2012 годом. Новость дублируется. Цель создания блока «новости» не совсем ясна.

Идем далее. Страница каталога:

 

 


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

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

 

 


И главное, нигде нет кнопки «Заказать оборудование»! Клиент, придя на сайт, может просто не найти прайс и форму заказа и перейти на другой сайт.

 

Анализ юзабилити страницы «Форма заказа». Форма заказа выглядит следующим образом:


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

Сайту необходимо добавить изображения, т.к. страница «Фотогалерея» пустует:

 

 


По результатам:

 

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

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

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

ТОП-35 ошибок юзабилити и дизайна сайта · Блог PromoPult

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

Внешний вид

1. Много рекламы

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

2. Всплывающие окна

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

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

3. Отсутствие единой дизайнерской концепции

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

4. Ошибки верстки

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

5. Отсутствие логотипа

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

6. Реклама на коммерческом сайте

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

7. Автоматический запуск видео или музыки

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

8. Неудачная цветовая гамма и контрастность

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

9. Неудобное и нелогичное расположение элементов

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

10. Избыточная анимация

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

Навигация

11. Лишнее меню

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

12. Битые ссылки

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

13. Не оформлена страница 404

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

Расположите здесь интересные записи, форму поиска, рубрики, объясните, почему возникла ошибка 404. Можно также поместить интересную картинку или видео — это привлечет внимание. Подробнее о работе с такими страницами мы писали в этой статье.

14. Нет «хлебных крошек»

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

15. Малый размер кликабельных элементов

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

16. Горизонтальная прокрутка

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

17. Отсутствие внутреннего поиска на сайте

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

18. Нет страниц «Контакты» и «О нас»

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

19. Тупиковый сценарий

Не создавайте случаев на сайте, когда у посетителей возникает вопрос: «А что дальше?» Часто такая тупиковая ситуация возникает после оформления и отправки заказа (нет уведомления о том, что заказ принят), после проведения оплаты и так далее. После каждого действия информируйте пользователя о том, что происходит и что ему делать дальше.

Функциональность

20. Медленная загрузка страниц

Увеличение времени загрузки страницы до 7 секунд повышает показатель отказов на 30%. Если страница грузится еще дольше, то показатель отказов стремится к 100%. Медленные сайты хуже индексируются и ниже ранжируются поисковиками. Именно поэтому надо работать над увеличением скорости загрузки страниц и времени ответа сервера. Для проверки отклика страниц используйте этот бесплатный сервис от Google.

21. Мгновенный запрос регистрации

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

22. Проблемы с формами регистрации

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

23. Скрытые поля ввода паролей

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

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

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

25. Нет поддержки мониторов с высоким разрешением

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

26. Нет «социальных» кнопок

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

Контент

27. Непонятно, о чем сайт

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

Сайт о строительстве и ремонте? Не угадали

28. «Полотна» текста

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

29. Нечитабельный шрифт

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

30. «Растягивание» статьи на несколько страниц

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

31. Отсутствие навигации внутри статьи

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

32. Неактуальная информация

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

33. Узкая или широкая колонка текста

Ширина поля для текста должна составлять 60-70% ширины страницы. Очень узкие колонки вытягивают текст, и их неудобно читать. Широкие колонки усложняют чтение, ведь можно потерять строку (как на рисунке ниже).

34. Переизбыток (или недостаток) изображений

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

35. «Многотекстаибукв»

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

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

Юзабилити сайта: рекомендации от специалистов

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

  • Про юзабилити.
  • Что такое юзабилити.
  • Каким сайтам необходим анализ юзабилити.
  • Как можно узнать о стабильности фирмы и каким фирмам нынче нужен сайт.
  • Кто обращает внимание на сайт и какие выгоды можно извлечь со своего ресурса?

Юзабилити сайта — раскрытие понятия

Прежде всего, нужно выяснить самый главный факт – что такое юзабилити сайта?

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

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

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

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

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

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

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

Важность юзабилити

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

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

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

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

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

Первый вариант: Прочитать много книг, из которых узнать:

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

Второй вариант: Заказать анализ юзабилити и получить отчет.

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

Пример анализа юзабилити

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

Пример 1. Анализируется сайт студии интернет-услуг (юзабилити-анализом проверяется удобство восприятия и понимания информации).

Создается сайт рекламного интернет-агентства (студия дизайна, предлагающая комплекс интернет-услуг).

Цель сайта – продавать услуги по созданию, продвижению, раскрутке (контекстной рекламе), анализу юзабилити, тестированию эффективности и обслуживанию сайтов.

Покупатели услуги – бизнесмены. Люди богатые или с достатком выше среднего. Интересует в первую очередь момент осведомленности предметом.

Что имеется ввиду в данном конкретном случае?

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

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

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

Точнее он прекратит поиски, но на той студии, которая всё расскажет доступным и понятным человеческим языком.

Пример 2. Анализируется сайт автосалона дорогих машин (юзабилити-анализом проверяется удобство использования сайта).

Создается сайт автосалона дорогих машин. Цель сайта – показывать и продавать дорогие машины.

Целевые посетители – богатые люди. У богатых людей быстрый интернет и большой монитор.

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

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

Как исправить свой сайт и сделать его лучшим

Что сделать, чтобы ваш сайт стал лучшим в своём роде? На самом деле, в этом нет ничего сложного. Самое главное – проработать каждую деталь, каждую мелочь. Тогда вы получите максимальную отдачу.

Вот рекомендации от специалистов:

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

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

Юзабилити сайта | Распространенные проблемы юзабилити | Примеры

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

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

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

5 принципов удобства использования веб-сайта: как повысить удобство использования веб-сайта?

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

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

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

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

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

  • Быстро загружающиеся веб-страницы .«Я люблю ждать», - сказал никто никогда. Как показали исследования, чем быстрее сайт, тем счастливее пользователь. По этой причине даже Google представил алгоритм, основанный на скорости.

Преимущества: почему юзабилити-тестирование важно для веб-сайтов?

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

Лояльность : пользователи, которым понравился ваш интерфейс, с большей вероятностью вернутся.

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

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

Почему удобство использования веб-сайта важно для дизайна пользовательского интерфейса?

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

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

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

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

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

Наиболее частые проблемы юзабилити

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

  1. Несоответствие : макет, дизайн, кнопки и заголовки должны быть размещены в правильном месте.
  2. Остановить пользователя от перехода назад
  3. Слишком большое количество подменю
  4. Ссылки открытие в новых окнах
  5. Неструктурированный Карта сайта

Примеры хорошего юзабилити сайта

Чтобы пролить свет на то, что мы понимаем под хорошим юзабилити веб-сайта, мы выбрали несколько особенно хороших примеров:

Целевая страница

Airbnb предлагает интуитивно понятный и сверхбыстрый способ бронирования жилья.

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

Примеры плохого интерфейса и UX-дизайна

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

Lingscars.com с его запутанной домашней страницей является классическим примером ужасного (или, по крайней мере, сомнительного) пользовательского интерфейса. Просто нажмите на ссылку и получайте удовольствие.

Можете ли вы правильно прочитать все подменю на этой веб-странице Zara? Спорим, вы не можете.

Юзабилити дизайн сайта

Глядя на приведенные выше примеры, естественно также задаться вопросом: какую роль design играет в удобстве использования? Очевидно, что дизайн веб-сайта важен в некоторых областях (например, в электронной коммерции) больше, чем в других. Но учтите: есть несколько сайтов с действительно красивым внешним видом, но трудных в использовании. Вместо этого существует множество веб-сайтов, на которые действительно некрасиво смотреть, но которые чрезвычайно функциональны.Что это значит? Веб-сайт должен в первую очередь работать, поэтому дизайн должен учитывать удобство использования. Это может быть красиво, это может быть даже произведение искусства, но оно ДОЛЖНО использоваться.

Удобство использования и крутой дизайн - идеальные составляющие успеха веб-сайта, и не нужно быть гением, чтобы понять это. Дизайн, ориентированный на пользователя , другими словами, жизненно важен для веб-сайтов. Каждая функция, страница и контент должны быть простыми в использовании, интуитивно понятными и красиво оформленными. Для получения дополнительной информации по этой теме мы предлагаем прочитать Альберта Бадре «Формирование дизайна веб-взаимодействия с юзабилити в контексте.Несмотря на то, что он был опубликован в 2002 году, он предлагает некоторые базовые знания о лучших практиках использования веб-дизайна и принципах удобства использования веб-дизайна.

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

Мы написали эту статью не только для того, чтобы объяснить нашим клиентам, что такое удобство использования веб-сайта, но также для того, чтобы дать практические советы и уловки, КАК УЛУЧШИТЬ удобство использования веб-сайта. В связи с этим проверка юзабилити веб-сайта должна быть главным приоритетом для всех, кто хочет иметь эффективный веб-сайт.Лучший способ найти проблемы - протестировать свой сайт на реальных пользователях.

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

Как провести тестирование юзабилити сайта?

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

  1. Тепловые карты (также называемые методом отслеживания кликов) - это визуальная презентация, которая позволяет вам видеть, где пользователи нажимают на определенные страницы вашего веб-сайта, каков их «образец кликов».
  2. Eye-tracking Технология позволяет владельцам веб-сайтов изучать, как глаза пользователей перемещаются по экрану и какие области привлекают наибольшее внимание.
  3. Опросы , особенно опросы на местах, являются эффективным способом быстрой и точной проверки взаимодействия с пользователем.
  4. A / B тестирование также является хорошим методом. Создавая разные версии (версия A и версия B) веб-сайта и внимательно сравнивая поведение пользователей, вы можете прийти к интересным выводам.
  5. Модерируемое и немодерируемое тестирование - дорогое удовольствие, но, вероятно, наиболее эффективный метод юзабилити. Если вы хотите узнать больше о вопросах фокус-группы по удобству использования этого веб-сайта, мы рекомендуем вам прочитать эту статью: https://www.userreport.com/blog/website-usability-testing/.

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

Опросы

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

  • Нравится ли вам визуальный дизайн сайта?
  • Удалось ли вам легко найти всю информацию , которую вы искали?
  • Является ли веб-сайт профессиональным и заслуживающим доверия ?
  • Содержимое веб-сайта ясное, и написано ли простым языком?
  • В целом, как бы вы, , оценили этот сайт?

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

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

  • Схема , которая аспектов вашего веб-сайта, который вы хотите исследовать
  • Дизайн ваше удобство использования тест
  • Определите количество участников, которых вы хотите достичь
  • Установить крайний срок
  • Проведение пилотного исследования
  • Разверните тест на удобство использования
  • Анализировать результаты

Удобство использования, дизайн и показатели производительности веб-сайта

Метрики - всегда объективный и эффективный способ измерения успеха.Также в юзабилити веб-сайта можно использовать показателей.

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

Стандарты юзабилити для сайтов

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

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

  • The findabilit y информации
  • Доступность и удобство использования услуг
  • Согласованность веб-сайта
  • Логика веб-сайта Структура
  • Наличие поиск особенности

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

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

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

Работая как составная часть вашего веб-сайта или приложения, опрос UserReport позволяет:

  • Изучите тепловых карт ваших пользователей
  • A / B тест ваш сайт
  • Задайте конкретных вопросов пользователям
  • Объединить данные об удобстве использования с демографическими данными

Начать

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

Начать

155 Тактики улучшения UX в 2020 году

Глава 4

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

Разработка веб-сайта с учетом намерений пользователей - ключ к успеху.

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

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

Давайте посмотрим на статистику веб-дизайна.

Есть несколько интересных идей веб-дизайна, которые вы не должны игнорировать.

  • Веб-страницы, которые загружаются более 2,5 секунд, увеличивают показатель отказов.
  • Не отвечающий сайт - это магнит кнопки возврата.
  • 38% людей покидают веб-сайт, если он не может предоставить привлекательный контент / макет.
  • 94% посетителей закрывали веб-сайты и перестали доверять сайту, если на нем был ухудшенный веб-дизайн.
  • 95% посетителей согласились с тем, что хорошее взаимодействие с пользователем - это все, что имеет значение.

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

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

Планировка

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

Источник: Nest - Grid Design

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

Навигация

Навигация пользователей по вашему веб-сайту помогает им просматривать больше.

Источник: Etsy - Breadcrumbs

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

Пользовательский интерфейс (UI)

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

Источник: Lyft

Имейте в виду, что чрезмерно форматированный дизайн затрудняет выполнение.

Визуальный дизайн

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

Источник: Slack - Пользовательская графика

Обязательно используйте высокий уровень контрастности с цветами фона и текстом.

Содержание

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

Источник: Pixar - Страница 404

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

Ссылки

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

Источник: 24h Fitness - Link Contrast

Якорные тексты полезны, когда вы ссылаетесь на другие страницы или веб-сайты.

30 Тактики юзабилити веб-дизайна и верстки страниц

  • Ваш веб-дизайн создает единообразный и узнаваемый внешний вид.
  • Макет побуждает пользователей сосредоточить внимание на том, что делать дальше.
  • Каждая страница имеет согласованный макет.
  • Стандартные элементы, такие как навигация и политика конфиденциальности, легко найти.
  • На каждой странице ваш логотип доступен для нажатия в верхнем левом углу.
  • Ваш логотип ведет на вашу домашнюю страницу.
  • Цвет фона группирует элементы.
  • Если вы используете несколько цветов, убедитесь, что они хорошо сочетаются друг с другом.
  • Ваш сайт избегает сложных фонов.
  • Самая важная информация находится в первом просмотре.
  • Ваш веб-сайт максимально избегает долгой прокрутки вниз.
  • Пользователи могут использовать сайт без горизонтальной прокрутки.
  • Кликабельные элементы выглядят нажимаемыми.
  • Гипертекстовые ссылки легко распознать.
  • На вашем веб-сайте не используется синий текст или подчеркивание для несвязанных элементов на сайтах.
  • Подчеркивание только для гипертекстовых ссылок.
  • Функциональность кнопок очевидна по их этикеткам и дизайну.
  • Изображения, которые можно нажимать, содержат замещающий текст.
  • Кнопки и ссылки отображаются по-другому после того, как пользователь щелкнул их.
  • Ссылка, по которой щелкнули пользователи, станет другим цветом.
  • На вашем сайте используются поля, особенно возле кнопок.
  • Компоненты графического интерфейса пользователя используются надлежащим образом.
  • Шрифты согласованы и читабельны.
  • На вашем веб-сайте по возможности избегайте прописных букв и курсивов.
  • Текст, выделенный жирным шрифтом, предназначен для выделения важных категорий тем.
  • Вся графика стандартная и интуитивно понятная.
  • Графика не путает пользователей с рекламными баннерами.
  • Существует правильный баланс между плотностью информации и использованием белого пространства.
  • Ярлыки, цвета фона, границы и интервалы позволяют легко идентифицировать группируемые элементы.
  • Каждая иконка имеет индивидуальный вид, но хорошо гармонирует.

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

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

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

1. Добавьте карту сайта

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

Карта сайта также является отличным способом удовлетворить требования доступности Консорциума World Wide Web Руководства по доступности Руководства по доступности (WCAG 2.0, критерии успеха 2.4.5).

В WordPress существует множество плагинов для создания страницы карты сайта из сообщений и страниц, включая Simple Sitemap и WP WordPress Sitemap.

Пользователи Drupal могут автоматически создавать карту сайта пунктов меню или категорий, используя модуль Site Map.

2.Используйте четкую и последовательную навигацию Системы

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

3. Подтвердите свои страницы и таблицы стилей

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

4. Проверьте свой веб-сайт с помощью автоматизированных инструментов оценки доступности

Автоматизированный Доступность Инструменты оценки - отличный способ начать всестороннюю проверку доступности и могут помочь вам определить критические проблемы доступности на вашем веб-сайте. Эти инструменты могут помочь вам определить распространенные проблемы доступности , такие как отсутствие атрибутов alt, низкая контрастность элементов , недопустимая разметка HTML / CSS и многое другое.Некоторые из этих автоматизированных инструментов также включают предупреждения о разметке и ручные проверки для дальнейшего тестирования. Ознакомьтесь с еще одним важным инструментом оценки accessibility Evaluation здесь.

5. Используйте разметку HTML для предоставления семантической информации

Одна из самых мощных функций HTML - это возможность структурировать контент. Структурированное содержимое позволяет браузерам (и пользователям) понимать контекст информации в документе HTML. Правильно структурированные страницы используют упорядоченные и неупорядоченные списки, заголовки (h2, h3… h6), абзацы, разделы, статьи и многое другое.Включение семантической информации и структуры в ваши страницы важно для обеспечения того, чтобы браузеры и устройства со вспомогательными технологиями могли анализировать и интерпретировать содержимое ваших страниц. Ознакомьтесь с отличными статьями о семантической разметке и HTML.

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

Включение альтернативного (Alt) текста - один из рекомендуемых методов для повышения удобства использования изображений на веб-сайте. Он также позволяет программам чтения с экрана и другим вспомогательным технологиям предоставлять информацию об изображениях, встроенных в страницы HTML.Альтернативный текст должен быть достаточно информативным и кратким, чтобы дать пользователям точное представление о контекстном значении изображения. Альтернативные описания, состоящие более чем из 5-7 слов, могут быть представлены как длинные описания, используя атрибут longdesc или ссылку на новую страницу с полным описанием. Для изображений, которые являются чисто декоративными (например, границы, разделители и т. Д.), Вы можете указать устройствам со вспомогательными технологиями игнорировать изображение, установив для атрибута alt значение NULL.

7. Проверьте Ваши страницы с помощью клавиатуры

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

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

  • Избегайте использования «display: none» или «display: 0» в ваших таблицах стилей.Для таблиц стилей, которые используют эти свойства, не забудьте включить другой индикатор фокуса клавиатуры (например, стили: focus {}).
  • Убедитесь, что порядок табуляции для элементов управления страницей и ссылок соответствует естественному порядку чтения документа.
  • Включите ссылки или кнопки для реализации специальных возможностей интерактивных элементов.
  • Предоставьте пользователям возможность пропускать большие блоки ссылок.

Дополнительную информацию можно найти в статье WebAim о клавиатуре Специальные возможности .

8. Предоставление титров для встроенного видео

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

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

Популярные инструменты для создания субтитров: MAGpie, Subtitle Workshop и ccPlayer. Обратите внимание, что инструменты транскрипции не на 100% точны, поэтому все титры, созданные с помощью этих программ, следует проверять на точность.

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

9. Предоставьте стенограммы для временных СМИ

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

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

10. Проверьте Ваши страницы на мобильном устройстве

Все большее количество пользователей выходят в Интернет через мобильные устройства. Чтобы гарантировать максимальное удобство для ваших посетителей, рекомендуется протестировать ваших страниц на одном или нескольких мобильных устройствах (включая телефоны и планшеты). Помимо ручного тестирования, есть несколько автоматизированных инструментов для оценки юзабилити вашего сайта на мобильных устройствах. Google Analytics включает анализ скорости страницы и пользовательского опыта для мобильных устройств (в разделе «Поведение»).Вы также можете использовать W3Cs MobileOK Checker для определения синтаксиса и других ошибок, которые могут повлиять на производительность сайта на мобильных устройствах.

Заключение

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

Вдохновение для этой статьи: Интернет Консорциума World Wide Web Доступность и Удобство использования Совместная работа.

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

Если хотите…

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

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

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

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

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

Проверка слепых зон

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

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

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

Юзабилити-тестирование: узнайте мнение пользователя

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

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

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

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

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

С удаленными немодерируемыми платформами тестирования юзабилити, такими как TryMyUI, получить такую ​​обратную связь можно быстро и легко:

  • Напишите свои задачи: Создайте список из 5-10 задач, которые пользователи должны выполнять на вашем веб-сайте. Направляйте их к проблемным местам, чтобы увидеть, что их смущает.
  • Выберите целевого пользователя: Выберите один из различных демографических фильтров, таких как возраст, пол, доход и т. Д., Чтобы привлечь релевантных пользователей для вашего сайта.
  • Разошлите свой тест: Просто нажмите «Заказать» - вам не нужно беспокоиться о наборе пользователей или модерации сеансов тестирования.
  • Просмотрите свои результаты: Посмотрите видео, прочтите письменные ответы пользователей и используйте количественные показатели, чтобы сосредоточиться на ключевых моментах.
Хотите узнать больше о ведущих в отрасли решениях для тестирования удобства использования TryMyUI?
Запросить демо

Поиск скрытых камней преткновения

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

Ниже приведен видеоролик с примером юзабилити-тестирования из Domino’s Pizza, где пользователь 15 секунд пытается выбрать кнопку, чтобы нажать на простое всплывающее окно.

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

Юзабилити-тестирование и пользовательский опыт

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

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

Настройте свой первый пользовательский тест бесплатно и начните получать представление пользователей сегодня:


Попробуй бесплатно!

Если вам нужна помощь, кто-нибудь всегда доступен. Позвоните нам по телефону (415) 234-5687.

Ссылки по теме:

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

«Людям нужно меньше информации, им не нужно больше информации. Они хотят, чтобы им было проще пользоваться. Им было легче получать то, что они хотят.Им легче делать то, что они хотят. Следующий большой прорыв произойдет с точки зрения удобства использования ". ~ Генеральный директор и основатель Gateway, Inc., Тед Уэйтт.


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

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

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

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

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

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

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

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

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

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

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

  • Доступность : Доступность в Интернете означает, что люди с ограниченными возможностями могут воспринимать, понимать, перемещаться и взаимодействовать с веб-сайтом. Это включает в себя использование его информации, ресурсов и т. Д.
    • Могут ли все использовать веб-сайт одинаково?
  • Отзывчивость : Отзывчивый веб-дизайн (RWD) - это «подход к веб-дизайну.Он стремится обеспечить оптимальный просмотр и взаимодействие с широким спектром устройств »(Википедия).
    • Работает ли веб-сайт на устройствах, которые предпочитают использовать клиенты?
  • Поисковая оптимизация (SEO) : «Процесс влияния на видимость веб-сайта или веб-страницы с помощью бесплатных (например, естественных, органических) результатов поисковой системы» (Как заказать SEO и маркетинг).
    • Могут ли клиенты найти сайт в результатах поиска?
  • Контент и обмен сообщениями : Пользователи часто заходят на сайты в поисках ответов на определенный вопрос.Поэтому его текст должен быть оформлен так, чтобы быть заметным, легко читаемым и понятным.
    • Если у пользователей есть конкретные вопросы, предлагает ли сайт четкие ответы?
  • Макет и навигация : насколько быстро и легко посетитель может найти то, что он ищет, с помощью таких инструментов, как панель навигации, хлебные крошки, меню, кнопки и т. Д., Которые предназначены для того, чтобы помочь им достичь их целей или ответить на конкретные вопросы. вопросов.
    • Могут ли люди найти на сайте то, что они ищут?
  • Ошибки и эффективность : Это может быть мерой того, сколько ошибок пользователи сталкиваются при использовании веб-сайта, сколько ошибок они делают, преследуя цели или ответы, и сколько из них покидают сайт, не достигнув своей цели, по сравнению с тем, кто это делает успешно.
    • Насколько эффективен сайт для посетителей?
  • Время выполнения задачи и ожидания : Измерение количества времени, которое требуется посетителю для достижения своих целей через веб-сайт по сравнению с его ожиданиями (например, слишком долго, быстрее, чем ожидалось) от этого времени.
    • Насколько эффективно люди могут пользоваться сайтом?

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

USF Health Information Systems - это комплексная технологическая группа, обслуживающая потребности академических исследований и клинических миссий. Мы сотрудничаем с нашими клиентами, чтобы предоставлять гибкие и гибкие технологические решения, которые повышают ценность бизнеса и улучшают жизнь наших студентов и пациентов. Будьте всегда в курсе, посетив сайт health.usf.edu/is/. Вы можете связаться напрямую по телефону, позвонив по телефону (813) 974-6288 или отправив нам электронное письмо через support @ health.usf.edu, в нерабочее время.

#USFHealthIS

Информация о Bekah Witten

Бека - автор материалов факультета информационных технологий Университета Южной Флориды.

10 надежных способов повысить удобство использования сайта для увеличения конверсии

Последнее обновление: 13 декабря 2019 г.

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

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

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

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

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

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

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

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

a) Mouseflow - Записывает поведение посетителей
b) Clicktale - Записывает поведение пользователей на вашем веб-сайте
c) Crazy Egg- Получите карту прокрутки и карту прокрутки сайта
d) Визуальный оптимизатор веб-сайтов - Он подходит для A / B-тестирования, тепловых карт, анализа целевой страницы и тестирования разделенных URL-адресов
e) Снимки браузера - Просматривайте дизайн своего веб-сайта в нескольких браузерах
f) Откройте веб-аналитику - Отслеживайте и анализируйте, как люди используют ваш сайт и приложение
g) Pingdom - Проверьте скорость вашего сайта
h) Five Second Test - Измерьте первое впечатление людей о вашем сайте.Он показывает сайт в течение пяти секунд, а затем просит зрителей записать свое впечатление.
i) Usabilla - Получайте отзывы пользователей в реальном времени и знайте, почему люди уходят с вашего веб-сайта
j) Qualaroo - Задавайте целевые вопросы посетителям в режиме реального времени, чтобы повысить удобство использования вашего веб-сайта
k) Пользовательский ввод Получите полезные отзывы от реальных людей из вашей ниши.

Как только вы определите ошибки удобства использования, вы можете решить проблему.

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

01.Дайте меньше выбора

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

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

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

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

Ищете графический дизайн?

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

02. Соблюдайте правило третей

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

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

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

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

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

03. Простота - ключ к успеху

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

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

Большинство домашних страниц глобальных бизнес-сайтов просты.Посмотрите на главную страницу Google. Посередине только название компании и строка поиска. На странице больше ничего нет.

04. Обратите внимание на пустое пространство

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

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

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

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

05. Проверьте макет страницы

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

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

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

06. Выбирайте цветовую схему с умом

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

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

07. Проверьте скорость загрузки страницы

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

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

08. Привлекайте внимание за секунды

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

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

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

09. Соблюдайте закон подобия

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

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

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

10. Используйте лица

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

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

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

Ищете нового графического дизайнера? Если да, позвоните нам по телефону + 1-855-699-2851 [время для звонка с 9:00 до 18:00 EST (США)] или зарегистрируйтесь на бесплатную консультацию по дизайну

Заключение

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

Comments