Оценка юзабилити сайта или как проверить юзабилити своими руками + Бонус 5 лучших книг
Юзабилити анализ сайта
Доброго времени суток! Если ты здесь, значит уже озадачился вопросом, как улучшить свой распрекрасный сайт (лендинг, интернет-магазин, бложичек и т.д.) и повысить эффективность его производительности. Что ж, попроси кота плеснуть тебе коньячку в кружечку, устройся поудобнее, и вникай (ну или, если лень, то сразу отмотай вниз до выводов в заключении).
В последние года два под понятием «улучшить» сайт скрывается заморское красивишное слово «оптимизировать». Поэтому за отправную точку улучшения сайта возьмем два параметра: SEO-оптимизированности и юзабилити сайта. Я хочу остановиться более подробно на последнем.
Итак, мы знаем: для того, чтобы что-то улучшить, мы должны сначала это «что-то» оценить по определенным параметрам, составить отчет о характеристиках этого «чего-то» и далее – тестировать, изменять, творить ахалай-махалай и получать результаты (которые тоже надо будет анализировать, но это уже будет другая история).
Именно поэтому глаголить в этой статье я буду про аудит юзабилити лендинга (не пугайся, к сайтам эти правила тоже вполне применимы). Погнали!
Аудит юзабилити – зачем мне это нужно?
Коротко о главном: согласно авторитетному источнику, Стандарту ISO 9241-11, например, «Юзабилити – степень эффективности, продуктивности и удовлетворенности определенным продуктом при использовании его определенным пользователем в определенном контексте для достижения определенных задач.».
О как умно! А в двух словах, юзабилити – это степень ошуршенности вашего сайта в глазах ваших юзеров, базирующаяся на трёх китах: эффективности сайта, продуктивности и способности удовлетворить запросам юзера.
С точки зрения SEO проводить аудит юзабилити необходимо, так как улучшение показателей поведенческих факторов (информативность текстов, процент конверсии, время пребывания на сайте и прочие 127 факторов SEO-оптимизации) помогает поднять сайт в позициях поисковых систем.
Для развития идеи, с которой был создан тот или иной интернет-ресурс, аудит юзабилити так же полезен потому, что он позволяет не только откорректировать сам ресурс, но и докрутить саму цель, ради которой создавался сайт.
Задача аудита юзабилити: найти проблемные места сайта, докрутить их, упростить навигацию юзера, предоставить информацию, максимально соответствующую запросам посетителя – ни шага влево/вправо, и повысить конверсию сайта.
И пока ты, читатель, не втянулся в этот головокружительный мир юзабилити, предупрежу тебя: аудит юзабилити – это всего лишь самый первый шаг для оптимизации твоего ресурса. Далее на основе данных аудита будут проводиться тестирования, установки инструментов аналитики, правки, прикручивания скриптов и кодов в индекс, тестирования и опять тестирования…пока совершенный результат, которому нет предела, не будет достигнут. Интересно? Тогда более не смею тянуть кота за причиндалы, читай и пробуй провести аудит, не отрываясь от статьи.
Лучшие помощники аудита юзабилити
Если ты жмешься отдать n-ную сумму тысяч за аудит своего сайта, тогда следующие пара строк для тебя.
Во-первых, аудит юзабилити базируется на двух составляющих: на анализе статистических данных и визуальном наблюдении за пользователями ресурса.
Во-вторых, как сказал бы С.Круг – лучше больше и чаще тестить на соседских кошках, чем не тестить вообще. Поэтому вот тебе несколько подсказок для проведения аудита самостоятельно:
Анализировать статистические данные можно через такие ресурсы как Яндекс.Метрика или Google.Analytics. ЯМ однозначно проще, чем ГА, но всё же потребует минут 40, чтобы разобраться в нем.
Спросить самих посетителей сайта, что им не понравилось. Именно «НЕ понравилось», так как люди склонны более охотно давать критику, нежели похвалу чему-либо/кому-либо. Для этого тоже существует ряд скриптов и приложений. Один из них находится на сайте Visual Web Optimizer (да, мы молимся на этот ресурс всем агентством, потому что он реально удобный!).
Наблюдать за действиями посетителей сайта можно не только втихаря из-за спинки стула подопытного, но и с помощью тех же инструментов Яндекс.Метрика и Google.Analytics.
Аудит юзабилити сайта, по бОльшей своей части, основывается на человеческих факторах, на принципах эргономики в том числе. Так вот, я к чему веду: зная эти стандарты, вполне реально и логично разделить направления аудита юзабилити на 3 жирных категории: оценка технической части сайта, дизайна и контента.
Разумеется, параметры аудита юзабилити могут меняться в зависимости от ниши, структуры сайта (многостраничник, сайт-визитка, лендинг, подписная/продуктовая страницы, блог), географического расположения пользователей. Но я всё же хочу затронуть самые актуальные пункты, на которые стоит обратить внимание, проводя аудит юзабилити лендинга.
Контент лендинга
1. Текст, понятный твоей бабушке или всё идеальное – просто
Слова на лендинге должны быть максимально просты для восприятия (как говорил С.Круг, «понятны даже твоей бабушке»), т.е. никакой переоптимизации ключевиками семантического ядра. Тем более – для лендинга SEO-оптимизация ваще не имеет смысла. Текст любого сайта создается для того, чтобы пользователи читали именно то, что хотят найти в интернете, а не наоборот. Несомненно, нужно проследить, чтобы пользователям было доступно необходимое количество информации для ответа на их поисковые запросы.
2. Привлекай внимание посетителя визуально (Структурируй текст)
Используй болд, италик, маркеры, блочное разделение и прочие прелести текстового форматирования для выделения ключевой информации, которая будет доступна вашему юзеру за полторы секунды. Ты никогда не угадаешь, сколько юзер отвел у себя в голове времени на изучение твоего ленда – поэтому нам с тобой нужно успеть донести наш посыл в кратчайшие сроки.
Текст обязательно должен быть структурирован по смысловым блокам. И, естественно, разделяться не только границами таблиц, но и дизайнерскими финтифлюшками. Именно для этого и были придуманы такие структуры блоков как буллиты, триггеры, формы Call-To-Action, счетчики, калькуляторы и проч.
3.Контактная информация или «Разрешите представиться»
Обязательно указывай контактную информацию на ленде – это повышает уровень социального доверия среди твоих посетителей и предоставляет им возможность если и не совершить целевое действие, то хотя бы дать шанс твоему продажнику привлечь их царственное внимание.
До сих пор самым простым и оперативным способом наладить контакт остается телефонный звонок. И именно поэтому здравствуют и процветают такие сервисы, как «назойливая зеленая трубка справа» Callback Hunter, сервис прослушки звонков клиентов Callcontrol, аппетитный облачный сервис Mango Office и так далее. Но не стоит забывать о необходимости самого последнего блока на каждом уважающем себя ленде «Остались вопросы?» и наличия назойливого онлайн-консультанта JivoSite «Здравствуйте, чем я могу Вам помочь?».
У меня есть подруга – человек с ученой степенью из Лондона – так вот она боится телефонных разговоров с незнакомыми голосами, в том числе и с сервисом. Именно поэтому помни: нам нужно повысить юзабилити лендинга даже для таких застенчивых социальных калек, потому что ни один юзер не должен себя ограничивать на нашем ленде.
4. Статика лучше динамики или не пичкай ленд динамичными сервисами
Реклама рекламе рознь. Баннеры, ссылки, сервисы желтая реклама – все эти источники дополнительного профита бизнеса могут превратиться в убийц сайта при неправильном расположении. Что касаемо лендинга, надо быть очень аккуратными с сервисами – в этом случае, как коса на камень: надо ставить максимум один (два?) сервиса, но ни в коем случае не винегрет из них. Оптимизировать, оптимизировать, да не выоптимизировать, как говорилось в одной статье, или краткость – сестра конверсии.
5. Чем короче якорь, тем надежнее стоит корабль
Анкоры (текст гиперссылок) должны быть понятны. То есть, если я сейчас упомяну о триггерах и правилах их оформления, но объяснять более детально мне будет лень, тогда дальше я дам ссылку – и тебе уже будет понятно, какую информацию ты получишь, перейдя по ссылке. Не надо писать изъезженные фразочки «узнать тут», «продолжение следует…», «читать далее». Пропиши пользователю мини-заголовок того контента, который ему предоставит эта подчеркнутая гиперссылка. Количество слов в анкоре не должно превышать 3х.
6. Количество полей ввода данных
Не заставляй юзера заполнять лишние поля ввода и информации о себе. Данные мобильного твоего юзера всегда приоритетнее его почты. И шансов закрыть клиента на покупку гораздо больше при личном контексте, чем через безголосые письма. Но есть ниши, в которых почтовый адрес важнее номера телефона.
А вообще – лучше меняй в каждой форме заявки поля ввода данных. Так же обращу твоё внимание на такой тонкий момент как поля расчетов калькулятора на ленде – максимум 5 полей. Не терроризируй юзера полями ввода. Лучше меньше, да лучше. Да и вообще, как говаривал сэр С.Круг: «Не заставляй меня думать».
7. Призыв к действию или Текст кнопки заявки
Текст кнопки заявки должен соответствовать результату, который мы предлагаем нашим пользователям в заголовке СТА. То есть если в заголовке СТА стоит «Внимание акция! Оставь заявку и получи скидку 100500%», то в кнопке должна быть надпись «Получить скидку».
И, разумеется, не стоит переоптимизировать ленд формами заявки – их должно быть максимум 4: первая на главном экране, вторая или третья (в зависимости от длины посадочной страницы) в «теле» ленда и последняя – четвертая – перед футером.
8. Грамматические ошибки
Лол штаа?! – вот этого не должно быть. Именно поэтому и придумали профессию копирайтера – человека, отвечающего за смысловую структуру текста, его логическое расположение в блоках, за употребление речевых оборотов и правописание/пунктуацию/орфографию/какой-то-ещё-раздел-науки-русского-языка.
Но что касаемо написания – тут тебе может помочь отличнейший сервис Яндекс.Спеллер или, если хочешь проверить уже готовый сайт, то Яндекс Вебмастер. Можешь сделать это самостоятельно, но, как правило, велика вероятность того, что твои глаза уже замылены прочими пунктами аудита. Поэтому будь добр, не поленись заплати хорошему копирайтеру или попроси какого-либо гуманитария проверить текст.
Техническая часть
1. Отображение лендинга
Внимательно отследи, как видят твой сайт пользователи, заходящие с различных устройств и с различных браузеров. За счет «резинового» макета элементы ленда могут наезжать друг на друга, перекрывать необходимую информацию да и просто неэстетично выглядеть. Помни: пользователю должен нравится твой ленд.
2. Динамическая навигация
Навигация по странице должна подсказывать посетителю его следующее действие. К примеру, все мы привыкли, что при наведении указателя на элемент с видео, стрелочка меняется на указательный палец. Или при наведении курсора на текст, стрелка меняется на курсор-выделение. Используйте эти привычные автозамены-якори для упрощения навигации между элементами лендига.
3. Выпадающее меню
Здесь важно одно простое правило: выпадающий список должен умещаться в рамках 2/3 экрана. Делается это для удобства выбора необходимого пункта из списка и более наглядного восприятия информации в выпадающем меню.
4. Хлебные крошки
Посетитель любого сайта всегда должен четко понимать, где он находится. Отражением этого служит два ориентира: адресная строка с доменным именем и указатели в хэдере (прим. «Меню-Дорожный багаж-Чемоданы»).
5. Логотип компании
Логотип компании должен располагаться в верхнем левом углу и вести на главную страницу сайта. Это негласное правило, которое существует ещё с бородатой даты запуска сайтов в интернете. В случае с лендингами – логотип не должен никуда уводить посетителя, т.к. это всё равно, что купить домик в Тайланде и переехать жить в коммуналку в Тамбове.
6. Всплывающие окна
Любая динамика на сайте или ленде моментально приковывает внимание пользователя. Особенно – если всплывающее окно мешает просмотру содержания сайта/ленда. Поэтому настоятельно рекомендуется ни в коем случае не размещать автоматически всплывающие окна, а привязывать всплывающий блок только к определенному действию пользователя на сайте.
7. Содержание главной страницы/первого экрана
Пользователь должен в течение 5 секунд понять, где он находится, перейдя на тот или иной ресурс. Поэтому крайне важно, чтобы графический и текстовый контент на главной странице сайта или на первом экране лендинга давали максимально понятную, ёмкую, а главное – целевую информацию о ресурсе, которому принадлежит этот сайт.
8. Перегруженность опциями
Общее количество функциональных элементов на странице не должно рассеивать внимание посетителя. Человеку сложно ориентироваться, когда ему мешает слишком большое количество элементов, и тем более нелегко удержать во внимании все элементы, требующие совершить действие с ними (например форма заявки, фильтр товаров, поиск по сайту). По большей части этот пункт относится к интернет-магазинам и сайтам-многостраничникам, но к ленду этот пункт так же подходит.
9. Работоспособность технических элементов
Необходимо проверить работоспособность всех элементов на сайте. Всегда перепроверяйте дважды! Одни из самых важных элементов, которые кровь из носа необходимо проверять:
кнопки «Оставьте заявку» (в принципе, любой элемент в форме кнопки должен повлечь какое-то изменение на сайте);
поле «Поиск»;
кнопка «Корзина», «Добавить в корзину»;
номер телефона (желательно, чтобы транслировался в скайп);
форма захвата данных (в особенности – на лендах и интернет-магазинах);
поля для рассчета введенных данных (калькуляторы, выплывающие списки и т.д.);
слайдеры с фотографиями;
блоки с видео-контентом.
Что же полезного в этой статье?
1. Зачем проводить аудит юзабилити:
откорректировать (улучшить) функционал сайта/ленда;
поднять сайт в позициях поисковых систем.
2. Как провести аудит юзабилити бесплатно:
проанализировать имеющиеся статистические показатели и данные (через Яндекс.Метрику или Google.Analytics);
спросить посетителей сайта о том, что не понравилось (через сервис Visual Web Optimizer);
собрать несколько человек и понаблюдать за тем, как они пользуются сайтом;
понаблюдать за тем, как юзеры интернета пользуются сайтом (через те же сервисы Яндекс.Метрики и Google.Analytics).
3. Аудита юзабилити проводится по 3 направлениям:
Контент;
Техническая часть;
Дизайн.
4. Аудит юзабилити контента проводится по следующим пунктам:
понятность смысла текста;
структурированность текста;
контактная информация;
статичность/динамика элементов сайта;
текст гиперссылок;
поля ввода данных;
текст кнопок;
грамматический АшиПки.
5. Аудит юзабилити технической частьи проводится по следующим критериям:
отображение сайта в браузерах;
динамическая навигация;
выпадающее меню;
хлебные крошки;
логотип компании;
всплывающие окна;
содержание главной страницы/первого экрана;
перегруз сайта дополнительными опциями;
работоспособность технических элементов.
6. Аудит юзабилити дизайна сайта базируется на следующих моментах:
расположение элементов на странице;
отступы;
пространство страницы;
визуальный шум;
шрифт;
автозаполнение полей ввода данных;
выделение ссылок;
подпись изображений в тегах alt и title.
Приведенный список пунктов оценки юзабилити, связанный с технической стороной сайта, дизайном и содержимым ресурса, является неполным, в нем указаны лишь основные направления, в которых стоит искать недочеты. Каждый сайт индивидуален, и то, что на одном является ошибкой, на другом воспринимается как фишка.
Анализируй поведение посетителей на своем сайте, изучай их потребности, делай правильные выводы и реализуй свежие решения!
Также можно подглядеть что происходит в в Элитной Группе онлайн Предпринимателей Топ уровня http://vk.cc/4ZN27V
