Usability сайта

Usability сайта: вынь да положь или красота спасет мир?

Юзабилити веб сайта – тема, которую освящают достаточно высоко. И это не удивительно, ведь юзабилити определяет, насколько ваш сайт удобен в использовании, а также насколько он интересен пользователю. Грубо говоря, юзабилити сайта – это все то, чего от вашего ресурса пользователь ждет. Не имеет значения, продаете ли вы свои услуги или представляете собой информационное агентство. Без юзабилити вы не добьетесь ничего. Сейчас трудненько будет найти какой-нибудь по-настоящему тяжеловесный сайт, на котором тяжело находиться. Однако есть сайты, которые не вызывают ничего, кроме пренебрежения и вопроса «как». Как можно было додуматься до того, чтобы сотворить такое. Вопрос этот касается как usability сайта, который оформлен слишком блекло и нарочито просто (привет, начало нулевых), так и юзабилити веб сайта, который выглядит слишком ярко, что зачастую попросту не соответствует его тематике и предназначению. Да, у вашего сайта тоже есть предназначение, которое он должен выполнить, иначе жизнь его будет бессмысленной и грустной. В этой статье мы попробуем максимально подробно описать способы, которые помогут улучшить usability сайта, тем самым позволив ему осуществить свое предназначение и прожить долгую и счастливую жизнь. Итак, остановимся кратко на основных параметрах, из которых состоит usability сайта:

  1. Сайт представляет собой единое целое, контент вписывается органично, ничего не отвлекает.
  2. Сайт обладает грамотной структурой.
  3. Навигация по сайту не отягощена дополнительными действиями и предельно проста.
  4. Каждая страница сайта также обладает хорошей и понятной структурой.
  5. Поиск по сайту обоснован и производится достаточно легко.
  6. Текст правильно оформлен и сформирован.
  7. Ссылки и кнопки располагаются так, что у пользователя нет с ними никаких проблем.
  8. Формы действительно для заполнения, а не для увеличения уровня агрессии.
  9. Общий дизайн сайта адекватен.

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

Контент течет во мне, я един с контентом.

Конечно, речь здесь пойдет не только о контенте, однако этот заголовок был написан специально для того, чтобы у вас сложилось правильное впечатление о том, как должен выглядеть ваш сайт. Usability сайта подразумевает, что ваш ресурс будет единым целым, все части которого будут органично вписаны в четкую структуру. Не будет ничего, что резало бы глаз или отвлекало, а также не будет ничего, что было бы не оправдано. Это важно. Согласитесь, нет никакого желания пользоваться ресурсом, на котором налеплено множество фишек, которые попросту не работают. Именно из-за того, что налеплены бездумно, лишь бы было. Этого следует избегать. Вот список требований, соответствие которым подразумевает юзабилити веб сайта:

  1. Уже с главной страницы пользователь может почерпнуть всю необходимую информацию. Он понимает, где он оказался, что здесь предлагают, а чего не найти ни за что. Это – честность, открытость и соответствие требованиям.
  2. Не обязательно регистрироваться, чтобы прочитать статью, увидеть контакты и совершить дополнительные действия, воспринимающиеся как основные. Не стоит заставлять пользователя регистрироваться сразу же. Он только зашел, а вы его уже женить хотите.
  3. Новому пользователю легко ориентироваться. Юзабилити веб сайта, прежде всего, подразумевает простоту в использовании. Так что следует добиться того, чтобы человек, оказавшийся на вашем ресурсе впервые, не впал в ступор, пытаясь осознать, куда тыкать и что писать. Добавьте подсказки, дружелюбный интерфейс и форму обратной связи.
  4. Плюшки для старожилов. Этот пункт предусматривает наличие дополнительных фишек, которые повысят лояльность к вашему сайту в среде постоянных пользователей. Приветствуйте их, не заставляйте перелогиниваться по сто раз, добавьте сочетания клавиш, с помощью которых они смогут осуществить определенные действия. Акции и скидки к usability сайта не относятся.
  5. Следите за метрической системой. Мы в России живем. Если ваш контент изобилует фунтами и дюймами, перепишите его. Юзабилити веб сайта подразумевает легкость восприятия информации, которую вы подаете. Если каждый гость будет сидеть и в уме переводить одну меру длины в другую… Да не будет.
  6. Нет отвлекающим маневрам! Отвлечение в нашем случае приравнивается к отказу. Никаких сияющих текстов, никаких наезжающих баннеров, никаких… В общем, вы поняли: ярмарку оставляем в реальном мире, ваш ресурс не предназначен для этого.
  7. Если вы все-таки не можете отказаться от некоторых отвлекающих элементов, предполагая, что они являются вашей основной фишкой, дайте пользователю шанс их остановить. К таким фишкам относится музыка, анимация и прочие штучки, которые могут как придавать вашему ресурсу определенный шарм, так и бесить неимоверно. В том случае, если это нельзя остановить, конечно. Оставьте за вашим гостем право выбирать, слушать это все или нет.

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

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

Структура сайта проста и идеальна.

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

  1. Разделение контента. Мешанина из главного и второстепенного до добра не доводит. Разделите контент таким образом, чтобы гость в первую очередь видел основной, а дополнительный уберите в соответствующий раздел. Захочет – посмотрит. Навязывать не надо.
  2. Не усложняйте. В том случае, если ваш сайт существует для того, чтобы продавать, не перегружайте его ненужным контентом и не усложняйте его структуру: это подходит только для информационных сайтов, чье предназначение состоит лишь в том, чтобы давать наиболее полную информацию.
  3. Карта сайта – прямиком к сокровищам. Мало того, что юзабилити веб сайта подразумевает ее наличие, так она еще и должна быть доступна с любой страницы. Это облегчит навигацию в целом и понимание структуры вашего ресурса в частности. Не дайте гостю потеряться: это признак дурного тона.

Простая навигация.

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

  1. Все важные пути должны быть предельно простыми для того, чтобы гость проследовал по ним. К важным путям можно отнести либо покупку товара или услуги, либо подписку, все зависит от того, является ли ваш сайт коммерческим или информационным. Гость всегда должен видеть и понимать, что ему нужно сделать для того, чтобы совершить целевое действие.
  2. Со всех страниц легко найти важную информацию. Скрывать нужно бесполезный набор фраз, который до сих пор иногда называют контентом. Основа должна быть видна всегда, а также легко доступна.
  3. Заголовок статьи или категории дает возможность понять, что ждет гостя дальше. Это важно, так как несоответствие заголовка содержимому может быть воспринято как обман. Юзабилити веб сайта подразумевает полное соответствие требованиям пользователя. А в этом случае основным требованием будет соответствие заявленного реальному.
  4. Доступность главного меню со всех страниц. Тут даже не стоит особо расписывать значимость этого пункта. Меню включает в себя не только перечень основных информационных блоков, но также и подразумевает выполнение определенных действий. Таким образом, юзабилити веб сайта требует доступности меню с любой страницы. Никто не станет носиться по вашему ресурсу в поисках нужного раздела.
  5. Меню соответствует законам логики: сначала самое важное, затем незначительное.

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

Структура страниц.

Выше мы уже говорили о том, что у сайта в целом должна быть грамотная структура. Теперь же следует поговорить о том, что структура также должна быть и у каждой страницы вашего ресурса. Однако в этом случае пункты будут немного другими. Usability интернет сайтов предполагает соответствие следующим пунктам:

  1. Шапка идентична на любой странице. Логотип находится в одном и том же месте, а слоган отражает цель ресурса, а не представляет собой вашу любимую цитату. Согласны, соблазн велик, но все же.
  2. Основная область сайта содержит грамотно расположенные блоки. Каждый блок составлен таким образом, чтобы его можно было воспринять с первого взгляда. Заголовки заметны и понятны, цветовая гамма адекватна и соответствует случаю, соблюден баланс между блоками и свободным пространством.
  3. Дополнительные элементы страницы выполняют четкое предназначение и привлекают гостя. Так, все кликабельные элементы должны выглядеть таковыми: для этого можно использовать как их цветовое выделение, так и дополнительные фишечки в виде изменения внешнего вида курсора. Говоря о четком предназначении, следует отметить еще раз, что юзабилити веб сайта не подразумевает наличия отвлекающих элементов, не несущих в себе никакого очевидного смысла.

Поиск по сайту обоснован и осуществляется предельно просто.

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

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

Хорошо составленный и отформатированный текст.

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

  1. Изложение текста следует законам логики. Здесь работает то же правило, что мы применяли для оформления меню. Сначала вы описываете самое главное, а потом уже дополнительное. Кроме того, проверьте контент на своем сайте на бессмысленность. Чем больше воды, тем хуже. Никакой ценности такой текст не принесет.
  2. Текст должен содержать в себе заголовки и подзаголовки, это факт. Однако, помимо этого, usability сайта подразумевает также необходимость разбивать текст на абзацы, а также применение различных наглядных схем и списков, которые упрощают восприятие и помогают усвоить информацию. Просто представьте, что весь этот текст был бы написан одним абзацем, без списков, без разделения на подзаголовки. Ужас, правда?
  3. Также следует следить за тем, чтобы автор текста не ударялся в копирование светоча нашей литературы Льва Николаевича Толстого. Понимаете, о чем мы? Длинные предложения – плохо. Читатель путается. Он забывает, о чем шла речь. Кроме того, длинные предложения ломают ритм текста, делают его монотонным и скучным.
  4. Заголовки должны подчиняться правилам юзабилити веб сайта в части восприятия. Они должны быть выделены, они должны быть больше основного текста, они должны отражать основную мысль и идею текста.
  5. Текст, основанный на usability сайта, в целом отличается единообразием и читабельностью. Это основной параметр. Здесь речь идет об удобном шрифте, удобном размере, а также о том, какой цвет вы выбрали для оформления.

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

Ссылки и кнопки: вижу цель – иду к ней.

Здесь следует понимать следующее: ссылка – это путь, кнопка – это цель. Понимая это, проще будет составить текст и оформить внешний вид ссылок и кнопок в соответствии с требованиями usability сайта.

  1. Текст ссылки должен подталкивать гостя к переходу. Например, «посмотреть можно здесь».
  2. Ссылки выделены и явно отличаются от основного текста.
  3. Те ссылки, по которым гость уже перешел, должны отличаться по цвету от незатронутых ссылок.
  4. Ссылки для скачивания должны отличаться от ссылок для перехода. Как визуально, так и в текстовой своей составляющей.
  5. Кнопки, которые вы используете, должны привлекать к себе внимание, но при этом не быть слишком ярким пятном, отвлекающим внимание от основного контента.
  6. Для каждой страницы должна быть только одна кнопка с явно выраженным действием: подписаться, заказать, купить. Это как побуждает пользователя к совершению этого действия, так и облегчает восприятие всей информации, предоставленной на вашем ресурсе.
  7. Не лишним будет добиться того, чтобы при наведении курсора на кнопку менялся ее внешний вид. Это дополнительный пункт, побуждающий пользователя совершить действие.

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

Адекватно оформленные формы.

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

  1. Формы должны быть лаконичны и понятны. Гость не должен прилагать дополнительных усилий для того, чтобы определить предназначение форм, расположенных на сайте.
  2. В формах, предназначенных для определенных действий, дополнительных полей быть не должно. Таким образом, форма для регистрации должна содержать в себе только поля, необходимые для проведения этой процедуры. Никаких дополнительных «ваше любимое блюдо» или «ваше любимое время года»: эта информация никому не нужна и никак не влияет на регистрацию пользователя. Конечно, ему будет приятно, что вы хотите узнать его получше. Но… Вы ведь не хотите на самом деле, правда?
  3. При открытии страницы с формой курсор должен перемещаться в первое поле. Это облегчает процесс заполнения и ускоряет его. Юзабилити веб сайта подразумевает отсутствие лишних действий.
  4. Также юзабилити web сайта подразумевает то, что работают основные кнопки. Так, кнопка Enter позволяет перейти к оформлению и обработке заполненной формы, а кнопка Tab перемещает курсор в другое поле сообразно последовательности заполнения.
  5. Следует позаботиться о том, чтобы текст кнопки, подводящей итог заполнению формы, соответствовал цели. Так, правильным будет заполнение этой кнопки как «подписаться», «завершить регистрацию» и так далее.
  6. Во всех случаях, где у пользователя могут возникнуть вопросы, должны быть использованы подсказки. Юзабилити веб сайта ратует за оказание пользователю помощи везде, где только можно. Так что наличие подсказок хорошо сказывается на восприятии вашего ресурса, а также улучшает отношение к нему.
  7. Следует дать пользователю шанс все исправить. Речь идет о возможности вернуться на шаг назад, чтобы скорректировать данные.
  8. Также необходимо проследить за тем, чтобы проверка правильности введенных данных проводилась автоматически.
  9. Сообщения об ошибках должны быть оформлены правильно. Usability интернет сайтов подразумевает не только легкость восприятия информации, но и корректность оформления различных информационных блоков. Так, «вы заполнили не все поля» - плохой вариант. Хороший – «укажите, пожалуйста, такую-то информацию».

Подведем краткий итог этому разделу. Формы для заполнения всегда вызывали раздражение, и будут его вызывать еще долго, потому что складывается ощущение, что при их создании люди руководствовались какими-то инфернальными законами и требованиями. Очень часто формы тяжеловесны сами по себе и долго грузятся. Информация не сохраняется. Формат ввода телефона неясен. И так далее, и так далее, и так далее. Лично у автора этой статьи глаз дергается каждый раз, как необходимо заполнить какую-нибудь форму на сайте, потому что никто не знает, что ждет в процессе. Мы вам уверяем: у ваших гостей реакция точно такая же. Поэтому юзабилити web сайта требует облегчения всех возможных процедур, а также обеспечения их автоматизации. Автоматическая регистрация при заказе, возможность залогиниться через социальную сеть с автоматической регистрацией на ресурсе. Это ведь намного проще и не отнимает много времени. Для того, чтобы улучшить юзабилити web сайта, требуется взглянуть на некоторые проблемы глазами вашего гостя и ответить самому себе, что вас в своем ресурсе как гостя бесит. Многое станет намного яснее.

Дизайн в целом.

Наша любимая рубрика. Почему-то многие считают, что лучшим будет тот сайт, который раскрашен ярче. На котором играет музыка, проигрывается анимация, бабочки разлетаются от вашего курсора… Да, такой сайт при правильном подходе способен поразить воображение. Но разве именно это является целью ресурса? Заказчики как маленькие детки обращаются к специалистам, чтобы реализовать свои старые мечты. Сайт – не способ самоудовлетворения. Сайт – инструмент, с помощью которого вы извлекаете прибыль. Чем выше юзабилити веб сайта, тем выше процент довольных гостей, тем выше прибыль. Основные моменты в дизайне, которые влияют на usability интернет сайтов:

  1. Качество. Да-да. Это основополагающий элемент. Не важно, простым или сложным будет дизайн вашего сайта. Он должен быть сделан качественно. Этот параметр, чаще всего, видно с первого взгляда. Сейчас существует огромное количество легких и ярких макетов, которые можно использовать либо как пример, либо как основу для вашего ресурса. В том случае, если дизайнер из вас так себе, не следует ими пренебрегать. Иначе качество вашего сайта будет автоматически перенесено потенциальным клиентом на качество вашего продукта. И вы ни за что не докажете, что ваши услуги на самом деле намного креативнее, чем ваш сайт.
  2. Легкость. Здесь usability интернет сайтов подразумевает как легкость в использовании, так и легкость по весу. Если сайт долго грузится, ведет себя неадекватно и вообще как-то не располагает к проявлению интереса, пользователь уйдет. Если ваш сайт заполнен всем, чем только можно, лишь бы было, пользователь утонет в потоке ненужной, навязанной вами информации. И снова уйдет. Сайт должен быть легким как перышко, а еще таким же утонченным и красивым.
  3. Цветовая гамма. Можно сколько угодно играть в психологов и утверждать, что фиолетовый воспринимается как «лакшери», смеем вас уверить – это не так. Фиолетовый угнетает. Фиолетовый – старушечий цвет. Фиолетовый… Просто не подходит для сайта. Смиритесь. Цветовая гамма вашего сайта должна быть органичной и легкой. Цвета должны поддерживать друг друга и дополнять, а не бросаться в глаза и отвлекать от изучения основы. Ваш сайт не должен быть слишком пустым, но не должен быть также и слишком ярким. Наймите дизайнера, если не можете сформулировать свой запрос или посмотрите на сайты успешных конкурентов. Впрочем, не усердствуйте особо: вполне возможно, их положение в поисковой выдаче основано не на дизайне, а на убойной внешней оптимизации. Таким образом, гости их сайта вынуждены страдать. Идите другим путем.
  4. Шрифты. Юзабилити веб сайта подразумевает наличие такого фактора, как читабельность. Нечитабельные шрифты следует исключить вовсе, какими бы красивыми они ни казались лично вам. Вы можете использовать необычные шрифты для оформления, однако делать это следует с умом.
  5. Стиль. Сайт должен соответствовать вашему бренду, подчеркивать вашу уникальность, а также вызывать у потенциального клиента общее доверие к вам. В том случае, если вы не уверены в своем чувстве стиля, обратитесь к дизайнеру. Однако прежде посмотрите, удалось ли его проектам достичь определенных высот.

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

Так для чего юзабилити?

Само название нашей статьи затрагивает непростой вопрос. Юзабилити веб сайта – это «вынь да положь»? Требование аудитории, которой нужно все больше и больше, и останавливаться она не собирается? Или это «красота спасет мир»? Требование, которое обосновано самим духом времени, в которое мы живем? Ответим вам так: usability сайта – это и то, и другое. Если бы целевая аудитория, для которой мы работаем, оставалась бы неприхотливой и терпела бы все нагромождения на сайте, мы сами не смогли бы расцвести. Мы не стали бы лучше, не стали бы интереснее. Не было бы никакого прогресса. С одной стороны, usability сайта олицетворяет всю лень человеческую. С другой стороны, юзабилити web сайта позволяет достичь большего, используя малое количество приспособлений. Это хорошая иллюстрация прогресса как явления.

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

About the Author

I'm a freelance designer with satisfied clients worldwide. I design simple, clean websites and develop easy-to-use applications. Web Design is not just my job it's my passion. You need professional web designer you are welcome.

Консоль отладки Joomla!

Сессия

Результаты профилирования

Использование памяти

Запросы к базе данных