На прошлой неделе у нас прошел вебинар «Юзабилити-практики: как сделать ваш сайт удобным». Если вы его пропустили — не беда: как мы и обещали, посмотреть (или даже засмотреть до брешей) запись вы сможете прямо здесь и сейчас. Причем, не только посмотреть, но и почитать! Для тех, кто тексты любит больше, чем видео, мы подготовили подробную расшифровку вебинара. Приятного времяпрепровождения!
Посмотреть интерактивную версию вебинара, как он был (с чатиком, конкурсами и шутками) можно здесь.
Но перед тем, как оставить вас наедине с юзабилити-практиками, давайте подведем итоги конкурсов. Напомним, что у всех участников вебинара была возможность выиграть бесплатный аудит от наших юзабилити-специалистов:
- Андрей С, который выдвинул веб-представительство РЖД на титул «самого неудобного сайта»
- Андрей (под номером 52, сразу отмечу, что счастливчика мы выбирали при помощи сайта Random.org)
- Дмитрий, который самым первым справился с юзабилити-заданием от Юлии прямо во время вебинара
Со всеми победителями мы свяжемся в ближайшее время.
Скачать презентацию вы сможете здесь.
А если у вас есть вопросы по теме, можете оставлять их в комментариях к этому посту.
«Сегодня наша тема — юзабилити, т.е. удобство использование вашего сайта. Я расскажу, как оценить качество вашего сайта и как исправлять недочеты.
Есть несколько правил проектирования сайтов, которые полезно знать и соблюдать.
Во-первых, это фокус. Должно быть сразу понятно, о чем сайт, и что требуется от посетителя. Вот я не знаю немецкий, но сразу ясно, что этот сайт продает велосипеды, и купить можно с помощью вот этой большой кнопки справа.
Для поддержания фокуса часто используют кнопку действия. Расскажу подробней об этом приеме. В первую очередь, нужно понять, чего вы хотите от посетителя: чтобы он купил товар, оставил заявку, позвонил. Вы должны дать человеку простой и очевидный способ это сделать. Например, на вашем сайте может появиться большая зеленая кнопка «Купить». Это работает не только для интернет-магазинов. Вот например корпоративный сайт компании, которая производит этикетки. У них можно оставить заявку с помощью раздела верхнего меню. Они решили поэкспериментировать и добавили кнопку. Она большая и яркая, отличается от всего остального, что есть на странице, и расположена в заметном месте. Вот результат.
Другой способ поддержать фокус — это целевые страницы. Этот способ хорош, если у вас есть несколько направлений бизнеса или несколько разных групп клиентов. Например, у БК есть отчетность, бизнес и версия для бухгалтеров. Мы сделали целевую страницу для тех, кто ищет в поисковике «отчетность». На этой странице кроме отчетности ничего не упоминается, нет навигации, есть только большая кнопка «сдай отчетность». Фокус 100%.
Второй принцип проектирования сайтов — это доверие. Когда человек покупает что-то у вас лично, ваша внешность и обаяние больше повлияет на решение о покупке, чем то, что конкретно вы говорите. Так же и с сайтами — устанавливать доверие помогают косвенные признаки.
Основной способ — это социальное подтверждение, т.е. отзывы клиентов и демонстрация того, что многие люди пользуются вашими услугами. BASECAMP использует социальное подтверждение на главной странице. Тут большая фотография пользователя с отзывом, точное число фирм, зарегистрировавшихся на прошлой неделе. Очень здорово, что это число не круглое, такие числа кажутся более верными. Ну и еще одна цифра, 97% клиентов рекомендуют.
На доверие еще влияет эстетика и хороший дизайн, но про это я сегодня говорить не буду.
Следующий показатель хорошего сайта — качественные тексты. Тексты должны быть полезны читателям. Саморекламу лучше заменить примерами, объяснениями, советами. Вместо того, чтобы написать «Мы ремонтируем велосипеды лучше всех» напишите, сколько времени у вас занимает ремонт велосипеда, покажите фотографию вашей мастерской. Дайте полезный совет, например, напишите, почему нельзя мыть велосипеды в автомойке.
Пользователи на сайтах читают текст невнимательно. Скорее всего, они прочитают то, что написано вверху страницы, а также пробегут глазами заголовки и подписи к картинкам. Поэтому лучше, если заголовок передает основную мысль текста. Картинки помогают удерживать внимание, если текст длинный.
4-й принцип — удобные формы. В виде форм обычно делают отправку заявки, регистрацию, покупку. Фактически это самые важные действия на вашем сайте.
Формы должны быть короткими. Чем больше полей в форме, тем меньше пользователей дойдет до конца.
Даже если форма состоит из двух полей, ее можно улучшить. Подумайте, что вам нужно больше — дополнительное поле или +20% к переходам.
Всегда хорошо объяснять, зачем вам понадобилась та или иная информация. Вот Мегаплан рассказывает, как он будет использовать ваш телефон.
Хорошим тоном считается сразу показывать ошибки заполнения, а не после нажатия на кнопку отправки.
Но это все теория. Давайте поговорим о практических способах проверки юзабилити сайта, учитывающих вашу специфику.
Основной метод — это юзабилити-тестирование. ЮТ — эксперимент, в котором пользователь пытается работать с вашим сайтом, а вы за этим наблюдаете.
Проводить ЮТ несложно, это можно сделать самостоятельно.
В начале нужно определить основной сценарий использования вашего сайта. Для интернет-магазина это выбор и покупка товара, для сайта услуг — заказ услуги. Основной сценарий — тот, который приносит вам деньги. Пройдите сначала сами по этому маршруту. Возможно, не дожидаясь тестирования вы уже захотите что-то исправить.
После того как задание готово, нужно подумать о том, кто его будет выполнять. Можно приглашать ваших клиентов, но это не обязательно. Вы можете позвать кого-то из своих знакомых, не погруженных в специфику вашего бизнеса. Если вы продаете товары для бабушек, не стоит проверять сайт с помощью вашего знакомого веб-разработчика, лучше поищите бабушку.
Сколько человек приглашать? Если у вас на сайте есть очевидные проблемы, это будет понятно уже после двух-трех тестирований. В этом случае лучше сначала исправить самые крупные недостатки, и только потом продолжить исследование, т.к. на фоне крупных проблем мелкие будут незаметны. Вообще для понимания того, что нужно исправить, обычно хватает 5-ти человек.
Вот известная картинка на эту тему. Здесь по вертикали, по горизонтали. Видно, что после тестирования с 1 участником вы откроете, с 5 — 80%.
Немного про проведение тестирования. Лучше не сообщать участникам, что судьба сайта вам близка. Пользователи могут постесняться сказать вам всю правду, и будут стараться вас утешить. Так работает эффект социальной желательности. Можно сказать например, что вы оцениваете работу сторонней студии — принимать или отправить на доработку.
Перед тем, как давать задание, хорошо спросить у человека, что он вообще думает о вашей сфере бизнеса, пользуется ли аналогичными сайтами. Это поможет вам лучше понимать друг друга в дальнейшем.
Само задание можно немного видоизменять, чтобы оно лучше соответствовало жизни пользователя (если он не пьет кофе, пусть вместо кофеварки покупает чайник).
Обязательно попросите человека говорить вслух все мысли, которые приходят в голову во время выполнения задания, и не стесняться комментировать и критиковать все что угодно.
Ни в коем случае не подсказывайте, что делать дальше, если несчастный пользователь заблудился. Вместо этого нужно пересилить себя, и на просьбу о помощи отвечать «Сделайте то, что вам кажется самым подходящим».
4. На что обращать внимание во время ЮТ?
- Отмечайте каждый раз, когда человек отклоняется от оптимального маршрута (и записывайте, куда он пошел вместо этого).
- Обращайте внимание, когда пользователь нажимает кнопку «Назад», или возвращается на стартовую страницу, обнаружив себя в тупике;
- Когда повисает растерянная пауза, или человек задает вам вопрос
Страницы и шаги, на которых возникли проблемы у двух и более пользователей, стоит переделать. Я не хочу рассказывать, как результаты тестирования превратить в рекомендации по улучшению сайта, потому что обычно все проблемы становятся мучительно очевидны, как и способы их исправления.
Прелесть ЮТ в том, что результаты часто бывают неожиданными. Вот например мы тестировали отправку отчета в профи-версии БК. Задание заключалось в том: но его не так-то просто было выполнить.
5. Помимо классического ЮТ, очень весело проводить ЮТ сайтов ваших конкурентов, не говоря им об этом. Чтобы сравнить результаты с вашим сайтом, используйте аналогичные задания. Если вы хотите сделать все по науке, лучше подобрать количественные метрики для сравнения: сколько заданий было выполнено успешно, сколько времени было потрачено на выполнение каждого задания, сколько попыток предпринято.
6. Еще есть простая и познавательная методика — пятисекундный тест. Человеку, не знакомому с сайтом и с вашим бизнесом, на 5 секунд покажите главную страницу вашего сайта, потом закройте ее и спросите, что это за сайт, чем занимается, и какую информацию со страницы человек запомнил. Результат вам о многом скажет.
После ЮТ вы сможете выделить и устранить основные проблемы, и в целом, можно ожидать, что ваш сайт будет выполнять работать хорошо. Теперь можно попробовать сделать его еще лучше. В попытке улучшить что-то работающее, главное — не навредить. Поэтому все свои гениальные идеи лучше проверять. Расскажу, как это сделать с помощью статистики использования сайта, например, Google Analytics и Яндекс Метрики.
Допустим, вы думаете, что размещение щеночка рядом с кнопкой основного действия увеличит количество кликов на кнопку. Но есть и опасения — вдруг ваши пользователи не любят собак. Чтобы проверить это, можно провести т.н. А/В тест. Смысл А/В теста в том, чтобы одной части посетителей показать один вариант страницы, вариант без изменений, а другой части — вариант со щеночком. И спустя какое-то время сравнить количество кликов на кнопку в этих двух вариантах.
АБ тесты можно проводить с помощью Гугл аналитики, это находится в левом меню в разделе эксперименты.
Экспериментировать можно с чем угодно, но лучше, если эксперименты поддерживают бизнес-цель вашей фирмы.
Подумайте о том, что нужно вашему бизнесу в конкретный момент времени: привлечь новых клиентов, удержать текущих или увеличить количество денег с каждого клиента.
Теперь определите, в чем вы будете измерять успех.
Теперь можно с помощью экспериментов и АБ тестов работать с конкретным показателем, стараясь его улучшить. Вот один из наших экспериментов с допродажами: мы предлагаем покупать тариф на год, а не на квартал.
Надеюсь, у вас появились идеи о том, как сделать ваш сайт удобнее.
Статья актуальна на