50 ошибок, ухудшающих юзабилити лендинга. Проверьте юзабилити по чек-листу

50 ошибок, ухудшающих юзабилити лендинга. Проверьте юзабилити по чек-листу
Want create site? Find Free WordPress Themes and plugins.

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

Общие ошибки в юзабилити лендинга

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

  • Отсутствие адаптивного дизайна или мобильной версии лендинга. Учитывая рост мобильной аудитории многих лендингов, дизайн проекта должен адаптироваться к экранам мобильных устройств. Иначе посетителям будет неудобно просматривать лендинг с планшетов и смартфонов.
  • В первом экране (область лендинга, доступная на ПК без прокрутки) отсутствует меню и полезный контент. Это ошибка, особенно отсутствие меню. Если посетитель сразу не увидит навигацию, он может подумать, что ее нет совсем.
  • Сокрытие меню в «гамбургер» на обычной версии лендинга для ПК. Прятать меню в «гамбургер» необходимо только на версиях лендинга для мобильных устройств. При просмотре лендинга на ПК меню должно выводиться полностью, иначе посетитель может не понять, где находится навигация.
  • В дизайне лендинга отсутствуют специальные места для размещения информации об акциях и спецпредложениях. Это может вызвать трудности при необходимости анонсировать на лендинге акции, поэтому необходимо заранее предусмотреть в шаблоне места для размещения баннеров.
  • Недостаточная контрастность фона и текста. Исследования показывают, что посетителям проще всего читать черный текст на белом фоне. Однако не всегда лендинг имеет белый фон и черный шрифт. Проверьте, что читать текст на вашем лендинге удобно и он не сливается с фоном, не режет глаза.
  • Мелкий шрифт. Частая проблема, которая ухудшает юзабилити лендинга. Размер шрифта должен быть таким, чтобы посетитель мог легко воспринимать текст с экрана.
  • Использование шрифта с засечками. Такой шрифт сложнее читать с экрана. Предпочтительнее использовать шрифт без засечек.
  • Выравнивание текста по ширине. Оптимально использовать выравнивание по левому краю.
  • Реклама на лендинге занимает более трети площади. Большая площадь рекламных мест может вызвать санкции со стороны поисковых систем.
  • На лендинге имеются всплывающие окна. Использовать их нежелательно, поскольку такие окна сильно раздражают посетителей.
  • Наличие горизонтальной полосы прокрутки. Создает неудобство для посетителей.
  • В шаблоне дизайна используются неоптимизированные для web изображения. Это типичная ошибка, ухудшающая юзабилити лендинга. Мне приходилось встречать в шаблонах картинки, вес который был более 1 Мб. Они замедляли загрузку лендинга, особенно на мобильных устройствах с медленным Интернетом.

Ошибки в шапке лендинга

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

  • Шапка занимает более 50% площади экрана, в результате полезный контент смещается вниз и для его просмотра необходимо прокручивать экран.
  • На логотипе нет ссылки на главную страницу лендинга. Пользователи привыкли нажимать на логотип в шапке, чтобы перейти к главной странице.
  • В шапке корпоративного лендинга отсутствуют номера телефонов. Посетителям приходится прилагать усилия для поиска контактной информации.
  • Номера телефонов в шапке лендинга прописаны картинкой, а не текстом. Посетитель не может скопировать номер телефона.
  • У номеров телефонов не указан код страны и города, из-за чего иногородние посетители не могут связаться с компанией без знания кода города.
  • Номера телефонов скрываются в версии дизайна, адаптированной для мобильных устройств. Также мне встречалась проблема, когда в определенном браузере или при открытии лендинга на определенном устройстве номер телефона в шапке «исчезал» и клиенты не могли позвонить в компанию.
  • Элементы шапки или меню сделаны на Flash, из-за чего они не выводятся на мобильных устройствах.

Ошибки в навигации лендинга, ухудшающие юзабилити

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

  • Цвет ссылок на лендинге не отличается от цвета основного шрифта, из-за чего ссылки мало заметны посетителям.
  • Цвет ссылок не синий. Пользователи привыкли, что текст ссылок – синий. Иной цвет может ухудшить юзабилити лендинга.
  • Ссылки в меню прописаны картинкой, а не текстом. Не столько ошибка в юзабилити, сколько во внутренней оптимизации лендинга. Рекомендуется все ссылки в меню делать текстовыми.
  • В меню не выделяется раздел, в котором находится посетитель. Таким образом, посетитель не видит, в каком разделе он находится.
  • Боковое меню размещено в правой колонке. Сомнительное решение с точки зрения юзабилити, поскольку пользователи привыкли видеть боковое меню справа.
  • Меню не дублируется в «подвале» лендинга. Системы аналитики показывают, что пользователи активно взаимодействуют с навигацией в «подвале» лендинга. Поэтому имеет смысл дублировать ссылки на важные разделы лендинга в «подвале», а не только размещать там ссылки на юридические документы.
  • В меню лендинга отсутствуют ссылки на важные разделы. Например, на лендинге компании в меню обязательно должны быть ссылки на разделы «О компании», «Контакты», ссылки на услуги или каталог товаров.
  • Ссылки не реагируют на наведение курсора мыши. Желательно, чтобы ссылки изменяли оформление при наведении курсора. Например, у ссылок менялся цвет.

Ошибки юзабилити в оформлении текстов на лендинге

  • Заголовки и подзаголовки имеют такой же размер, как основной текст. Они не выделяются и не привлекают к себе внимание.
  • В текстах не используются подзаголовки. Рекомендуется добавлять один подзаголовок на каждые 2000 знаков текста с пробелами.
  • В текстах не используются таблицы, нумерованные и ненумерованные списки. Тексты набраны «сплошной стеной» – их неудобно читать.
  • Отсутствие фотографий и других иллюстративных материалов. Фотографии делают текст привлекательнее и способствуют удержанию внимания посетителей.
  • Фотографии не подписаны. Проверьте, что каждая фотография имеет описание в атрибутах ALT или TITLE.
  • Кнопки социальных сетей находятся далеко от контента, из-за чего посетители реже делятся контентом в социальных сетях.
  • В статьях на лендинге не выводится дата публикации, из-за чего сложно понять актуальность представленной информации.

Ошибки, ухудшающие юзабилити интернет-магазинов

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

Ошибки на странице «Контакты»

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

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

Как проверить и оценить юзабилити лендинга?

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

Сравнивать имеет смысл такие показатели, как:

  • Глубина просмотра.
  • Среднее время визита.
  • Показатель отказов.
  • Уровень конверсии по важным для вас целям.

Резюме

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

Did you find apk for android? You can find new Free Android Games and apps.