Не заставляйте меня думать! Часть 1

Эта статья — первая из серии, посвященной книге Стива Круга (Steve Krug) «Веб-дизайн, или Не заставляйте меня думать!» издательства Символ-Плюс (оригинал — «Don’t make me think! A common sense approach to web usability» издательства Que/New Riders).

Стив Круг — не очень известный, но весьма уважаемый консультант по юзабилити. В этой книге сконцентрирован его более чем десятилетний опыт защиты интересов пользователей. В ней описываются тонкие эмпирические наблюдения, которые сопровождаются конкретными рекомендациями по решению проблем веб-дизайна.
Юзабилити (от английского usability) — простота и удобство использования веб-сайта. В более широком смысле юзабилити означает, что некая вещь, будь то сайт или вращающаяся дверь, приспособлена к использованию настолько хорошо, что человек со средними способностями и обычным жизненным опытом сможет легко применять ее по назначению. Эксперт по юзабилити помогает разработчикам сайта сделать его простым и удобным, дабы обеспечить ему приток посетителей. Если с самого начала привлечь к проекту хорошего эксперта, то можно избежать множества ошибок, которые обычно делаются в информационной структуре сайтов.
Однако в условиях нашего рынка нанимать отдельного специалиста по оценке юзабилити — непозволительная роскошь для большинства компаний, поэтому его функции возлагаются на дизайнеров, программистов, администраторов. Посмотрите: так выглядит идеальная страница с точки зрения директора (рис. 1), программиста (рис. 2), дизайнера (рис. 3), отдела маркетинга (рис. 4). Специалист по юзабилити обычно должен разрешить противоречия между этими взглядами и показать, что удобно для пользователей. Книга, о которой идет речь, содержит большую часть ценного опыта одного из таких специалистов и призвана помочь разработчикам избежать бесконечных споров относительно веб-дизайна.

pix

1. Первый закон Круга: Не заставляйте меня думать!
Веб-страница должна быть максимально простой, понятной и самоочевидной. Другими словами, пользователь должен сразу “схватить” ее — понять, что на ней и как ей пользоваться, без затраты каких-либо усилий.
Когда я смотрю на страницу, не тре­бующую особого размышления, в голове возникает что-то вроде “Так, понятно, это вот это… а это вот то… а вот это то, что мне нужно”.
Но когда я смотрю на страницу, которая заставляет меня думать, все мои мысли принимают форму вопросительных знаков: “Хм, как много здесь всего… А откуда мне начать?.. Где разделы сайта — это или вон то?.. Это одна ссылка или их здесь две?” Когда вы создаете сайт, ваша основная задача состоит в том, чтобы избавиться от вопросительных знаков.
Это может быть неважно для компьютерщика, который знает, как устроен интернет, но становится актуально, когда ­клиент вашего сайта — бизнесмен, не заинтересованный в предмете вашей работы, но которому срочно нужно получить некоторую информацию.
Например, ему нужен раздел о найме на работу. При этом его действия могут варьироваться в зависимости от того, как ссылка на раздел выглядит на сайте: “Работа” (“Работа!” — щелк), “Вакансии” (“Хм! Работа!” — щелк) или “Предложения о найме” (“Хм! Это о работе, хотя, кажется, не только о ней. Щелкнуть или еще посмотреть?”).
При выборе того или иного варианта из этого диапазона следует стремиться к форме, понятной каждому.
Каждый лишний вопрос создает нагрузку для нашего восприятия и отвлекает внимание от текущей задачи. Хотя такие моменты могут быть незначительными, но они накапливаются и, в конце концов, сбивают нас с толку. Легко использовать сайт, который не заставляет задумываться о несущественном.

2. Как мы в действительности используем интернет
Создавая сайты, мы почему-то думаем, что пользователи будут скрупулезно проходить по каждой странице, внимательно прочитывать все тексты, разбираться в структуре сайта и тщательно взвешивать все плюсы и минусы перед тем, как щелкнуть мышью по той или иной ссылке. Мы стараемся создать рекламный буклет, в то время как пользователь воспринимает сайт как рекламный щит, проносящийся мимо со скоростью 60 км/ч.
Факт 1: мы не читаем веб-страницы, мы их просматриваем. Мы как бы сканируем текст, ища слова и выражения, которые привлекли бы наше внимание. Мы всю жизнь просматриваем газеты, журналы, книги, чтобы найти то, что нам интересно. И мы знаем, что этот способ всегда работает.
Факт 2: наш выбор не всегда оптимален, но мы довольствуемся тем, что есть. При разработке веб-страниц мы исходим из того, что пользователи просмотрят страницу, оценят все возможные опции и выберут наиболее подходящую. В действительности, чаще всего мы выбираем не оптимальный вариант, а тот, который первым показался нам подходящим. Неправильный выбор при использовании веб-сайта приводит всего лишь к тому, что нужно один или два раза нажать кнопку “Назад”.
Факт 3: мы не задумываемся над тем, как “оно” работает. Мы просто делаем “как получится”. Очень часто люди используют “что-то”, совершенно не имея представления о том, как это “что-то” работает. Очень немногие находят время для чтения руководств и инструкций. Наоборот, мы без оглядки проры­ваемся вперед и выдумываем свои неясные теории о том, как нужно поступать и как “оно” работает. Пользователи успешно применяют способы, совершенно отличные от тех, которые разрабатывали для них веб-дизайнеры.
Понятно, что в действительности все складывается несколько сложнее, чем здесь показано: нужно учитывать и вид веб-страницы, и то, что пытается сделать пользователь, насколько он ограничен во времени и многое другое. Но эта упрощенная картинка намного ближе к реальному использованию интернета, чем то, как мы это себе обычно представляем.
Теперь, получив нерадостное представление, что такое веб-аудитория и как она использует интернет, вы, возможно, думаете: “А почему бы мне просто не найти место уборщика в ближайшем магазине? Может, хотя бы там мою работу оценят по достоинству?..” Ответ прост: если аудитория склонна воспринимать ваш труд как рекламный щит — делайте хорошие щиты.
Если сайт построен так, что пользователи “сразу схватывают” его, то:
• это повышает вероятность того, что пользователь найдет то, что ему нужно, а это выгодно как для него, так и для вас;
• это повышает вероятность того, что пользователь сможет охватить весь диапазон возможностей сайта, а не только тех его частей, на которые он случайно натолкнулся;
• это повышает вероятность того, что пользователь направится именно на те разделы сайта, на которые вы хотите;
• пользователь будет чувствовать себя увереннее и комфортнее при осмотре такого сайта и, скорее всего, захочет зайти на него еще раз. Сайт, через который посетителям приходится “продираться”, может существовать только до тех пор, пока рядом не возникнет другой, более удобный и понятный в использовании.

3. Начальный курс по созданию рекламных щитов
Вы можете сделать пять важных шагов, чтобы добиться лучшего понимания вашего сайта и приспособить его для просмотра, а не для чтения:
1. Создайте ясную визуальную иерархию на каждой странице. Организуйте внешний вид элементов страницы таким образом, чтобы они ясно и четко показывали отношения между этими элементами.
Чем более важен элемент, тем более он заметен на странице. Например, важные заголовки делаются крупнее и жирнее и размещаются ближе к верхней части страницы.
Элементы, логически связанные между собой, должны быть связаны и ви­зуально. Вы можете показать, что какие-то элементы равнозначны, сгруппировав их под одним заголовком, либо применив к ним одинаковый стиль, либо поместив их в одну четко отделенную область страницы.
Элементы представляются в виде вложений, если являются частями друг друга. Название раздела “Книги по программированию” будет находиться над заголовком какой-то конкретной книги по этой теме, включая в себя все содержимое части страницы. Под заголовком этой книги, в свою очередь, будет включено ее описание.
В каждой газете используются те же методы выделения, группирования и компоновки содержания для того, чтобы подчеркнуть еще до чтения наиболее важную информацию полосы. Хорошая ви­зуальная иерархия всегда экономит наши усилия по начальному восприятию страницы и помогает организовать и систематизировать содержание таким образом, чтобы мы могли почти мгновенно понять его в целом.
2. Обычаи и условности — ваши друзья. Как правило, условности становятся общепринятыми, только если они рабо­тают. Когда они правильно и к месту применяются, то помогают пользователям легко переходить от одного сайта к другому, не задумываясь о том, как все работает.
Если вы не хотите использовать некую общепринятую веб-условность, то убедитесь сначала, что то, чем вы собираетесь ее заменить, либо является достаточно ясным, понятным и не требующим усилий для изучения, либо настолько полезным, что это компенсирует необходимость некоторого усилия.
3. Разбейте страницы на четко разделенные области. Взглянув на страницу, пользователь должен сразу видеть: “вот здесь то, что можно делать на этом сайте”, “вот здесь список того, что продается”, “вот здесь самые популярные товары”, “а вот здесь переходы к другим разделам сайта”.
Разделение страницы на области позволяет пользователям быстро понять, какие области их интересуют больше, а какие они могут пропустить.
4. Покажите ясно, по чему можно щелкать мышью. Когда вы заставляете пользователей раздумывать о чем-то, что вообще не должно вызывать никаких вопросов, в частности о том, где же можно щелкать, вы расточаете тот запас терпения и благоприятного расположения, который имеет каждый пользователь при знакомстве с новым сайтом.
5. Уменьшите визуальный шум. Ви­зуальный шум является одним из препятствий для получения легко воспринимаемых веб-страниц. Можно выделить два типа визуального шума.
Перегруженность. Если на странице находится огромное количество всевозможных призывов, приглашений к покупкам, бесчисленное множество восклицательных знаков и яркоцветных выделений, то все это вызывает эффект давления.
Фоновый шум. Некоторые страницы напоминают обстановку какой-то вечеринки — нет громкого источника, отвлекающего внимание, но есть множество элементов визуального шума, которые в совокупности вызывают ощутимое раздражение.
Пользователи по-разному восприни­мают страницы со сложной версткой и большим числом компонентов. Некоторые легко переносят перегруженные страницы и фоновый шум, но для многих это создает проблемы. При разработке веб-страниц разумно исходить из того, что все является визуальным шумом до тех пор, пока не доказано обратное.



Рекомендуем почитать: