Информационная архитектура и информационный дизайн. Что информационный архитектор делает весь день? Что такое информационная архитектура? В общих чертах, о самом важном

Twitter

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

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

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

Эволюция информационной архитектуры

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

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

Реализация ваших идей по дизайну

Чтобы понять, как информационный архитектор управляет проектом, можно представить себе, что обычному архитектору предлагают поработать над зданием после того, как оно уже построено. Хотя такое предложение кажется смешным, сегодня оно зачастую актуально. Даже после того, как самые хорошо спроектированные здания построены, они всё ещё могут подвергаться изменениям. Стюарт Бренд освещает этот удивительный феномен в своей книге «Как учатся здания: что происходит после того, как они построены» (How Buildings Learn: What Happens After They’re Built). И снова, как бы абсурдно это ни звучало, мы обычно ставим информационных архитекторов в похожее положение - предлагаем им поработать над веб-сайтом после того, как другие самопровозглашённые информационные архитекторы уже его спроектировали. Это происходит потому, что большинство людей не знают о существовании альтернативы. Чем скорее Вы доверите свою идею дизайна проекта профессионалу, тем быстрее он претворит её в жизнь.

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

Интервью с Луи Розенфельдом (Louis Rosenfeld), основателем и президентом Argus Associates. Луи также является соавтором популярнейшей книги Information Architecture for the World Wide Web.

Интервью основано на переписке по электронной почте, которую вел Джон Роудс (John S. Rhodes) 24 мая 99 года

Что такое информационная архитектура? В общих чертах, о самом важном?

Эта сфера знаний пока относительно нова, и находится в стадии развития; следовательно определение информационной архитектуры зависит о того, кто его дает. Вот определение, которое нравится нам:

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

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

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

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

Какова связь между информационной архитектурой и юзабилити?

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

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

Так что, я представляю себе юзабилити, как дисциплину с чрезвычайно широкой сферой применения, но к сожалению недостаточной при применении к специфическим областям. В своей компании Argus мы как раз экспериментируем с этой проблемой; недавно мы наняли Кейт Инстоун (Keith Instone), а также еще одного специалиста по взаимодействию человек-компьютер. Так что теперь в нашей компании есть свои собственные лучшие специалисты по юзабилити. Потом мы посмотрим, какого рода услуг от нас потребует рынок, и если потребуется, мы будем смешивать наш опыт в информационной архитектуре с опытом в юзабилити. Так что год-два спустя мой ответ может быть совсем другим.

Каким образом хорошо продуманная информационная архитектура сайта может сделать сайт более удобным в использовании?

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

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

информационных потребностей посетителей сайта
материалов сайта
целей и бюджетных ограничений

В компании Argus мы очень сильно полагаемся на правило "80/20", которое гласит: если мы можем использовать несколько основных методов организации информации, которые удовлетворят 80% посетителей, тогда мы можем с уверенностью сказать, что пользователи не заблудятся на нашем сайте. Их не запутает обилие "информационных коридоров", многие из которых лишь изредка будут использоваться, но зато потребуют значительных затрат в поддержке. И так же, мы часто замечаем, что примерно 20% информации, которую нам представляет компания-клиент, удовлетворяет все запросы посетителей сайта. Благодаря этому правилу мы можем создавать некрупные, более точные массивы информации, с которыми проще работать. Не пытаясь объять необъятное и удовлетворить все нужды и требования посетителей, владельцы и менеджеры сайтов будут тратить меньше средств и усилий на поддержку сайтов при этом получая от него наибольшую отдачу.

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

Уточните, почему пользователям трудно найти информацию на веб-сайтах? Каковы типичные проблемы?

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

Исследования процесса поиска информации показывают, что попытка в совместить требования пользователей к информации с тем, что им предлагают авторы этой информации, провалилась. Примером может служить специфическая узконаправленная онлайновая база данных LEXUS/NEXUS. Web вносит еще больший хаос в эту проблему: информация в нем присутствует во множестве форматов, на различные темы, в различной подаче. В результате объем информации вырастает на порядки. Учтем еще всех пользователей Web-а со всеми их различиями, и в результате - результативность поиска информации уменьшается до нуля. Чем больше варьируется содержание информации, тем хуже будут результаты поиска. Не следует сваливать все в кучу, но в Web-е именно это обычная практика на веб-сайтах. Вот почему так часто на каждом сайте самая популярная страница - это страница поиска. Вот почему так часто невозможно работать с информацией в интрасети компании и при этом не запутаться окончательно.

Пожалуйста, опишите вкратце ключевые идеи вашей популярнейшей книги Information Architecture for World Wide Web. Так же, не могли бы вы объяснить успех этой книги?

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

Почему у книги такой грандиозный успех? Я был бы рад заявить, что это произошло благодаря революционным идеям, изложенным в ней. Но я знаю точно другую причину: реальная причина - точное время выхода книги. Сегодня веб-разработчики имеют дело с пятой или шестой реинкарнацией своего сайта. Их уже не надо учить тому, как надо оптимизировать картинки на сайте, как программировать на Java, и так далее. Но тем не менее они обнаруживают у своих сайтов такой недостаток, который берет начало от более абстрактных понятий дизайна: организация информации и юзабилити. Веб-разработчики уже начали сознавать это, а тут выходит как раз наша книга. Точное время - вот секрет успеха!

Каково будущее информационной архитектуры? Что будет дальше?

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

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

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

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

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

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

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

Дизайнеру очень важно в самом начале определиться, какие типы контента будут использованы при разработке. Для этого потребуется разбить весь контент на виртуальные категории с четко определенными структурными требованиями.

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

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

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

Принцип выбора

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

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

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

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

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

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

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

Принцип образцов

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

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

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

Принцип главного входа

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

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

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

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

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

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

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

Принцип сфокусированной навигации

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

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

Принцип роста

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

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

Вывод

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

До этого момента мы с вами концентрировались на том, как понять и спланировать UX-дизайн. А с сегодняшнего дня мы приступаем к практике. Проектирование реального решения всегда начинается с разбора структуры объекта проектирования. Начнем со введения в тему:

Что такое информационная архитектура?

Если вы раньше не сталкивались с понятием “структура информации”, то начните с этой презентации: Understanding Information Architecture .

Информационная архитектура (ИА, IA) может быть как достаточно простой (в случае небольшого проекта), так и невероятно сложной (если вы работаете над масштабным проектом).

Информационная архитектура невидима. Чтобы с ней работать, нужно нарисовать карту сайта. Вот простой пример:

В этом примере показан вебсайт из 6 страниц: домашняя страница, 2 секции главного меню и 3 подсекции. Линии показывают, как страницы соединены между собой посредством навигации (меню и кнопки).

На заметку: Если у вас миллион пользователей, это не значит, что у вас миллион страниц с профилем. У вас одна страница с профилем, в которой отображается профиль любого пользователя.

Такая организация страниц - в виде семейного древа - называется “иерархической” или “древовидной”. Большинство сайтов и приложений структурированы подобным способом (но он далеко не единственный).

В рисовании карты сайта нет никаких “правил”, но вот вам несколько ценных указаний:

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

Горизонтальная или вертикальная, а не обе сразу.

Вообще-то говоря, карта вашего сайта будет либо “плоской” (flat) - тогда будет больше секций в меню, зато понадобится меньше кликов, чтобы добраться до самого низа - либо “глубокой” (deep), что означает более простое меню, но требует больше кликов на пути к цели.

Заметьте, что в этом примере и в той, и в другой структуре представлено одинаковое количество страниц. То есть они равны по объему, но не по виду.

Сайтам, на которых много продуктов, например Wal-Mart, чаще всего подходит “глубокая” архитектура, иначе размеры меню будут выходить за все рамки. Сайты вроде YouTube, где все строится вокруг пользователей и видео-роликов, обычно “плоские”.

Если ваш сайт и глубокий , и плоский одновременно , это плохо. Вам не помешает . Ну или пусть в основе сайта лежит хороший механизм поиска.

Распространенный миф: Возможно вы слышали от кого-то, что до любого интересующего объекта “всегда должно быть три клика”. Этот кто-то скорее всего изучал UX в 90-е и больше не возвращался к этой теме. А вам нужно концентрироваться на пользователе, а не на дурацких “правилах”. Главное, чтобы люди всегда понимали, где они находятся и что могут сделать. Если ваша навигация простая и четкая, то количество кликов значения не имеет.

Если вам понравилась статья и перевод, дайте нам знать - нажмите зеленую кнопку Recommend

И ещё, если у вас есть на примете какая-нибудь классная статья по UX и не только - скиньте нам ссылку, и мы будем рады над ней поработать.

Краткое резюме: информационная архитектура сайта (Information Architecture, IA) — это информационная основа любого многоуровневого веб-сайта.

Навигация веб сайтов (navigation) — набор элементов пользовательского интерфейса (UI, user interface), позволяющий посетителю найти и получить конкретную информацию на веб-ресурсе, вступить в маркетинговую интеракцию, совершить конверсионное действие.

Этот пост продолжает серию публикаций о в блоге SaaS-платформы LPgenerator.

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

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

Натаниэль Дэвис (Nathaniel Davis), специалист по оптимизации пользовательского опыта (UX) и проектированию пользовательских интерфейсов, еще в далеком 2011 году выложил в блоге UXmatters концептуальную статью «Основы практического использования информационной архитектуры» (Framing the Practice of Information Architecture), в которой предложил относиться к веб-навигации как видимой надводной части условного айсберга, имя которому — Information Architecture.

Что такое информационная архитектура сайта?

Information Architecture любого веб-ресурса включает в себя 2 основных компонента:

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

Информационная архитектура (IA) не является частью пользовательского интерфейса, видимого на экране, — скорее, IA конфигурирует и обуславливает внешний вид и набор опций user interface.

Information Architecture состоит из электронных документов, таблиц, диаграмм, отнюдь не из макетов или прототипов веб-страниц.

Вот блок-схема, наглядно отображающая взаимосвязь между отдельными составляющими контента на ресурсе nngroup.com. Синие узлы представляют информационные объекты 1 уровня, зеленые — второго, желтые — третьего.

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

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

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

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

Для определения архитектуры веб-ресурса проводятся следующие мероприятия:

Инвентаризация контента (Content inventory): экспертное исследование сайта, которое проводят, чтобы найти и идентифицировать существующий контент.
Аудит контента (Content audit): оценка полезности, точности, тональности подачи и общей эффективности контента.
Группировка информации (Information grouping): определение степени клиентоориентированности соотношения «пользователь — контент».
Разработка и усовершенствование таксономии контента (Taxonomy development): определение стандартизированной терминологии для классификации и систематизации содержимого веб-ресурса (например, товарные категории для офферов интернет-магазина).
Создание описательной информации: определение метаданных, которые могут быть использованы для создания ссылок по теме, списков или других компонентов навигации, способствующих обнаружению необходимой информации, служащей активатором конверсионного действия.

Определение и описание навигации сайта

Навигация сайта представляет собой набор компонентов пользовательского интерфейса. Основная цель навигации — помочь пользователям найти контент и функциональные элементы ресурса (другими словами, «органы управления» UI), чтобы затем мотивировать к совершению запланированного маркетологом действия.

Типы навигации сайта и ее компоненты:

глобальная навигацая (global navigation),
локальная навигацая (local navigation),
вспомогательная навигацая (utility navigation),
фильтры категорий, ценовых границ и т. п. (filters),
ссылки по теме (related links),
«толстый» футер (fat footer), дублирующий элементы глобальной, локальной и вспомогательной навигации в собственно ,
и т. д.

Примеры навигационных компонентов: 1 — вспомогательная навигация; 2 — глобальная навигация; 3 — указатель местоположения («хлебные крошки», breadcrumb trail; буквально — «путь, помеченный рассыпанными хлебными крошками»); 4 — локальная навигация; 5 — ссылки по теме (в данном случае на статьи и сообщения в блоге); 6 — «толстый» футер.

Перед имплементацией элемента навигации на веб-страницу следует решить несколько вопросов.

Статистические приоритеты: сколько пользователей будут пользоваться этим навигационным элементом. Например, пользователи будут ориентироваться на ресурсе при помощи локальной навигации или предпочтут «привязанные» тематически ссылки?

Размещение: на каких страницах этот элемент должен располагаться? А где именно на макетной сетке: вверху, внизу, слева, справа?

Дизайнерский шаблон: что будет максимально способствовать юзабилити и положительному пользовательскому опыту — табы, выпадающие меню, «мегаменю» и т. д.?

Взаимосвязь между информационной архитектурой и навигацией

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

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

Рассмотрим гипотетическую ситуацию: дизайнер решил использовать широко распространенную навигацию «в стиле перевернутой L» (верхний навигационный бар и левый сайдбар, как его еще называют на сленге, «рельс»).

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

Если уже в ходе эксплуатации выяснится, что контент раздела превышает этот запас (при том, что 5 и больше уровней — это вполне обычная глубина информационной архитектуры для современных ресурсов типа интернет-магазинов), — то останется 2 выхода:

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

Определитесь с IA, прежде чем проектировать навигацию

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

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

Отметим, что при применении автономных целевых страниц, отличающихся простотой Information Architecture и «неглубокой» структурой при отсутствии глобальной навигации, все выше упомянутые проблемы грамотной иерархической организации контента просто не возникнут.