Элементы разработки веб-сайтов

Elements of User Experience. User-Centered Design for the Web
автор: 2003 Джесси Джеймс Гарретт (Jesse James Garrett)
перевод: Александр Качанов

Copyright notice от переводчика: данная статья - перевод второй главы книги Джесси Гарретта Elements of User Experience. Данный перевод не является официальным. Он не может быть использован в коммерческих целях, а только для ознакомления с содержанием книги, которую можно приобрести на Amazon.

1. Пять уровней
2. От фундамента к крыше
3. Модель сайта

От фундамента к крыше

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

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

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

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


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

Если вы собираетесь принимать решения на верхнем уровне лишь после того, как будут приняты решения на нижнем уровне, вы как минимум подвергаете опасности сроки выполнения проекта - а может быть и успех самого проекта. Вместо этого вам следует планировать проект так, чтобы работа на данном уровне не заканчивалась раньше, чем работа на предыдущем. Самое главное, чтобы крыша дома не была закончена раньше, чем его фундамент.

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


Двойственность

Разумеется модель поведения пользователя на сайте можно представить и по другому. Как и любая другая области знаний, наука разработки сайта тоже породила свой словарь терминов и выражений. Тому, кто столкнулся в первый раз с веб-дизайном, такое нагромождение похожих терминов может показаться хаотичным: дизайн интерактивности, информационный дизайн, информационная архитектура. Что эти термины обозначают? И обозначают ли что-либо вообще? Или может это просто модные словечки? К еще большему конфузу в разных ситуациях эти выражения используются по-разному. Один называет "информационным дизайном" то, что другой считает "информационной архитектурой". А какая между ними разница? Существует ли она?

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

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

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

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

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

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

Далее »

1. Пять уровней
2. От фундамента к крыше
3. Модель сайта

Rambler's Top100
Rating All.BY
Akavita
Valid XHTML 1.0!