Текст книги "Создание сайтов"

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

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

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

Только-только открывая свой первый интернет-бизнес, большинство предпринимателей задается сакраментальным вопросом: «Какая конверсия является нормальной?» Единого ответа нет. Все определяется суммой факторов. Допустим, для большинства российских интернет-магазинов нормальной, не хуже, чем в среднем по рынку, будет считаться конверсия 0,5–3,0 % (в зависимости от товарной категории). По большому счету показатель мизерный: он означает, что лишь сотые доли от числа зашедших на ваш сайт – в лучшем случае! – воспользовались им «по назначению». Так что не спешите с облегчением выдыхать, достигнув показателей такого порядка.

Зависит конверсия от следующих факторов:

• сам сайт (юзабилити);

• источники трафика (поисковая выдача, таргетированная реклама, партнерские программы, прямые заходы и пр.);

• уровень работы ваших сотрудников, качество смычки «онлайн – офлайн».

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

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

Отслеживается конверсия с помощью систем веб-аналитики, в первую очередь Google Analytics и «Яндекс. Метрики». Об обоих инструментах мы поговорим в следующей главе – «Веб-аналитика: иди и смотри, смотри и иди», в настоящей коснемся отдельных их функций.

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

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

• Используйте призывы к действию. Обычно здесь предпочтительны глаголы в форме инфинитива («Купить») или в повелительном наклонении («Купите»).

Как выбрать текст? Задайтесь вопросом, как бы посетитель сайта сформулировал для себя то свое желание, которое удовлетворяется по нажатии интерактивного элемента. Так, «Найдите дешевле, вернем разницу» вкупе с иконкой, на которой изображен столбик монет, на главной странице «онлайн торгового центра» Wikimart.ru – идеальный пример мотивирующего призыва: с одной стороны, он содержит внятное предложение, с другой – указание на выгоду для покупателя в любых обстоятельствах (не найдет нигде дешевле – купит здесь по самой выгодной цене, найдет дешевле – то же самое).

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

• Подстегивайте посетителей подарками. «Зарегистрируйтесь сейчас и получите в подарок книгу об интернет-маркетинге» привлекательнее, чем просто «Регистрация». Втягивайте аудиторию в конверсионную воронку.

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

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

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

• Видео прекрасно повышает конверсию. Особенно когда оно короткое, но притом в нем разложено по полочкам использование вашего продукта или сервиса. Если бы на главной странице сайта «Мегаплана» (системы управления бизнесом, www.megaplan.ru) на первом же экране не было надписи «Как все устроено?» с мини-кнопкой в виде окошка плеера, наверняка ни сном ни духом не знающие о проекте люди с большей степенью вероятности закрывали сайт секунд через десять. А так по нажатии на кнопку открывается YouTube-ролик, в котором действительно рассказывается, как все в «Мегаплане» устроено.

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

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

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

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

Самые явные признаки проблем с юзабилити таковы:

• посетители быстро закрывают в браузере вкладку с сайтом;

• конверсия гораздо меньше, чем в норме для вашей бизнес-ниши;

• пользователи проводят на страницах подозрительно мало времени;

• люди охотно просматривают страницы, но идут не теми маршрутами, которыми вам хотелось бы.

Обратите внимание

Начинайте заниматься юзабилити на стадии прототипа.

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

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

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

В ходе тестирования вы должны получить ответы на вопросы:

• на каких элементах пользователи спотыкаются чаще всего и почему;

• какие действия они совершают слишком быстро или слишком долго;

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

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

С помощью специального оборудования (особая камера, софт) выполняется более сложное тестирование по методу eye-tracking. Человек точно так же сажается за компьютер, и программно-аппаратный комплекс засекает направление его взгляда, куда и с какой скоростью тот смещается, насколько долго реципиент смотрит на тот или иной объект. Разумеется, все действия испытуемого записываются на видео. Такого рода «лабораторная работа» дает богатую пищу для размышлений, но, чтобы адекватно интерпретировать полученные данные, необходим опыт. Возможно, вы изыщете свободное время и силы, чтобы самостоятельно освоить ремесло юзабилиста-аналитика, но лучше, владея азами ремесла, делегировать выполнение столь деликатной задачи профессионалам, о чем мы расскажем в конце подраздела.

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

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

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

Другой инструмент сходного назначения – американский ClickTale (см. блок «Полезно знать»). В отличие от «Яндекс. Метрики» со встроенным «Вебвизором», он платный, хотя предусматривает некоммерческое использование – при лимите 400 записей в месяц.

^{Рис. 33. Раздел «Сходные посещения» в «Вебвизоре». Данные по Setup.ru}

^{Рис. 34. Тепловая карта кликов из «Яндекс. Метрики». Данные по Setup.ru}

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

Обратите внимание

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

Как и тестирование, аналитика – перманентный процесс. Высветили три проблемы с помощью фокус-групп? Отлично. Внесите на сайт исправления и… проведите испытания заново. Изучайте в «Яндекс. Метрике» и Google Analytics пути посетителей, оптимизируйте их – и снова углубляйтесь в анализ. В идеале – до тех пор, пока все не будет гладко. На практике – регулярно на протяжении всего жизненного цикла сайта.

Мало того что юзабилити – ремесло высокой сложности, задействовать его на сайте требуется с высокой периодичностью. Хорошо бы постоянно. Так что есть резон обратиться в компанию, для которой юзабилити – хлеб насущный. В России самой известной и авторитетной из них по праву считается UsabilityLab. Кроме нее упомянем Usethics.ru и Uidg.ru.

Для того чтобы освоить азы, а затем углублять свои знания в юзабилити, прежде всего стоит смотреть семинары и вебинары Дмитрия Сатина, основателя UsabilityLab, ныне советника министра связи и массовых коммуникаций РФ: www.youtube.com/user/usabilitylab. Также советуем изучить архив программы «Фактор человека» на SeoPult.TV (см. блок «Полезно знать»), которую также вел Дмитрий вместе со своими коллегами. Эти передачи особенно ценны для представителей малого и среднего бизнеса, поскольку в большинстве случаев именно сайты таких компаний рассматривались в ток-шоу.

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

• «Веб-дизайн, или Не заставляйте меня думать!» Стива Круга.

• «UX-дизайн. Практическое руководство по проектированию опыта взаимодействия» Расса Унгера и Кэролайн Чендлер.

• «Интуитивный веб-дизайн» и «100 главных принципов презентации. Что должен знать оратор о людях» Сьюзан Уэйншенк.

• «Разработка пользовательских интерфейсов» Дженифер Тидвелл.

Цикл передач «Фактор человека» на SeoPult.TV: http://seopult.tv/programs/?format=factor_human

«Рассылка Setup.ru. Выпуск № 23: проведение юзабилити-тестирований на нестандартных респондентах»: http://www.setup.ru/client/subscription/23

Юзабилити сайта (советы специалистов «Яндекса»): http://help.yandex.ru/webmaster/?id=1122958

«Проектирование [интерфейсов] с помощью сторибордов»: http://habrahabr.ru/post/152375/

«Правило “трех кликов”: миф или реальность?»: http://usabilitylab.ru/blog/webinar-169/

«Когда стоит нарушить закон Фиттса»: http://www.cmsmagazine.ru/library/items/usability/fittss-law-and-user-experience/

«Блог и библиотека» на сайте компании Usethics.ru: http://usethics.ru/lib/

Набор книг о юзабилити на Ozon.ru: http://www.ozon.ru/context/detail/id/6846424/

247 руководств по проверке юзабилити (на английском): http://www.userfocus.co.uk/resources/guidelines.html

«Сам себе аналитик с Google Website Optimizer»: http://usabilitylab.ru/blog/webinar-42/

«Хороший призыв к действию»: http://www.uxfox.ru/good-call-to-action-buttons/

«РИФ+КИБ 2012: Обзор инструментов повышения конверсии сайта и вопросы их внедрения» (слайд-шоу к докладу Сергея Котырева, генерального директора Umisoft): http://www.slideshare.net/UniWeb/19apr32-kotirev

«Повышение конверсии эффектом бабочки»: http://myshlaev.ru/2013/01/29/conversion-rate-rase-butterfly-effect/

«30 простых советов для увеличения конверсии»: http://growthhacks.ru/2013/06/30-prostyh-sovetov-dlja-uvelichenija-konversii/

О регистрации на сайтах: http://habrahabr.ru/post/134595/

«Clicktale. Давайте знакомиться!»: http://www.adlabs.ru/posts/394/

«Полное руководство по созданию успешных посадочных страниц»: http://blog.seopult.ru/infographics/rukovodstvo-posadochnih-stranic.html

Глава 17. Веб-аналитика: иди и смотри, смотри и иди

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

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

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

• источники трафика;

• количество просмотров страниц за тот или иной период;

• число уникальных посетителей сайта в указанный временной интервал;

• географическое распределение аудитории;

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

• точки входа и точки выхода посетителей;

• маршруты людей на сайте;

• длительность и глубина просмотра сайта;

• посещаемые наиболее часто разделы и страницы;

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

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

Две главнейшие (мы говорим, конечно же, о Рунете) системы веб-аналитики поддерживаются лидирующими на местном рынке поисковиками – «Яндексом» и Google. Базовая функциональность у них сопоставимая, однако отдельные возможности и «суперспособности» различаются. Спорить о том, какой продукт лучше, бессмысленно: легче ответить, кто сильнее – Бэтмен, Человек-паук или Капитан Америка.

Предвосхитим собственные выводы: на сайт имеет смысл устанавливать и Google Analytics (GA), и «Яндекс. Метрику» (ЯМ). Благо и та и другая бесплатны. Мы не будем вдаваться в мельчайшие подробности их работы: в конце концов, и по той и по другой в Интернете доступна обширная справочная документация, да и краткое ее изложение заняло бы полторы таких книги, как наша. Не претендуя на всеохватность, попытаемся выделить некоторые сильные стороны каждого решения, а дополнительную информацию об обеих вы найдете в материалах, ссылки на которые приведены в блоке «Полезно знать».

Оговоримся, что, помимо GA и ЯМ, существует немало продуктов, предназначенных для веб-аналитики. Однако по преимуществу они платны. Вдобавок у большинства сайтов нет острой необходимости использовать серьезные коммерческие решения такого рода, включая Adobe Site Catalyst и KISSMetrics. Впрочем, не будем отговаривать вас, например, от экспериментов с системой OpenStat (www.openstat.ru): проконсультируйтесь с экспертами, возможно, у вас в достаточной мере нетривиальный веб-проект для того, чтобы ему была нужна кастомизация (иными словами, индивидуальная подгонка) по части веб-аналитики.