Публикации

Юзабилити, или красота должна быть эффективной

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

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

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

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

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

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

Дизайн

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

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

Польза ссылок

Ссылки – это основа Интернета. Наверное, они и есть те самые элементы, за которые Сеть называют мировой паутиной. А потому каждый посетитель сайта должен сразу видеть, какие элементы навигации его куда-нибудь сошлют, а какие нет. Без этого сайт не сайт.

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

Изображение тоже может быть ссылкой. Если просто заключить его в рамку, это не всегда срабатывает. Тут можно предложить несколько различных вариантов:

– разместить рядом поясняющую текстовую ссылку;

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

– разместить на изображении стрелку и т.п.

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

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

Цветовая гамма

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

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

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

Регистрационная форма авторизации

Многие регистрационные формы требуют от посетителя ввод бесполезной личной информации (ФИО, адрес, дата рождения и др.). Несомненно, пользователи не желают оставлять кому-то все свои данные, особенно если им нужно всего лишь оставить комментарий на сайте или скачать определенный файл. В большинстве случаев в принципе вообще не нужна регистрация, особенно если без нее нельзя воспользоваться главными функциями сайта. Бывают случаи, когда для того, чтобы элементарно просмотреть цены в интернет — магазине необходимо сначала зарегистрироваться. Конечно, это излишество, и в данном случае большая часть потенциальных клиентов уйдет на сторону конкурентов. Заполнять форму регистрации нужно только для постоянных посетителей интернет – магазинов. В случае если без регистрации обойтись невозможно, нужно как можно больше сократить количество заполняемых в форме полей.

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

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

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

Капча

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

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

— название name в поле формы заменяют на нестандартное. В таком случае можно применить динамическую генерацию таких названий;

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

— использование в форме невидимых полей;

— проверка функциональности мыши (прокрутка, клики и др.);

— качественная модерация.

Реклама на сайте

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

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

— всплывающие окна в виде кликандер, попап, попандер и др.;

— видео — и аудио реклама;

— рекламные блоки, которые всплывают поверх контента сайта при наведении мыши на определенный элемент;

— скрытые iframe вставки, которые отображают другие сайты;

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

Если рекламы на сайте будет чересчур много, то поисковики могут принять его за простой дорвей и зафильтровать. Для пользователей контекстная реклама (Yandex Direct и Google Adsense) является самой оптимальной. Она не только отлично подчеркивает структуру сайта и вписывается в его дизайн, но и может дополнять содержимое сайта полезными для пользователей объявлениями.

Верстка контента на странице сайта

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

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

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

— текст должен быть разбит на короткие абзацы;

— между абзацами блоков, необходима вставка вроде «А знаете ли вы?», «Важно» и др.;

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

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

— не лишним будет использование в тексте списков;

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

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

Поиск и навигация

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

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

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

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

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

Официальная информация

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

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

Акции и скидки

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

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

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