Не экономьте на информационной архитектуре сайта

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

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

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

Мне нравится одно из определений, которое принадлежит Матти Лангенбергу (Mattie Langenberg):

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

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

Библиотеки, использующие картотеки, могут показаться архаичными, но на самом деле они весьма современны. Давно прошли те времена частных книжных собраний, в которых книги регистрировались по правилам, придуманным самим владельцем. Чаще всего при регистрации записывались имя автора, название, тема или даже литературный жанр (пьеса, роман и т.п.). Посетитель такой библиотеки едва ли нашёл бы интересующую его книгу без помощи составителя этой самой библиотеки. Но современные библиотеки быстро приспособили под свои нужды систему, названную Десятичной системой Дьюи (Dewey Decimal System - DDS) по имени создавшего её в 1876 году библиотекаря Мелвила Дьюи (Melvil Dewey). Его идея сортировать книги по десяти категориям совершила революцию в библиотечном деле. Система DDS стала первым шагом на пути создания высокоорганизованной и гибкой схемы информационной архитектуры для книг.

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

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

Такая продуманность и гибкость, то, что нужно, когда речь заходит о разработке ИА для веб-сайта. Представьте, во что бы превратились библиотеки, если бы система DDS не смогла вместить в себя все новые темы и подтемы, появившиеся на свет за прошедшие 125 лет. Сколько времени библиотекарям пришлось бы всякий раз тратить на реорганизацию их каталогов и перестановку их карточек? Может показаться глупым, но… сколько раз вы ломали голову над тем, как поменять положение материалов на сайте или как втиснуть дополнительный пункт в уже готовое меню навигации?

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

Теперь, разобравшись в сущности Информационной Архитектуры, спросим себя, каково её значение в Web-разработке? Вернемся к примеру с библиотекой, ИА это не внешний вид библиотеки, не то, как и где расположены полки и из чего они сделаны. ИА - это то, как рассортированы книги. А карточки картотеки - это эффективный инструмент навигации, который помогает пользователям найти то, что они ищут.

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

Web-разработчикам следует помнить, что ИА - это скелет сайта, "движок" (базы данных, javascript, cgi и т.п. ) - мускулы, и HTML код - кожа. В качестве другой аналогии можно взять постройку дома. В этом случае ИА - это план-чертеж дома, с которого начинается любая стройка. База данных - это фундамент, запросы к ней - каркас, и HTML - штукатурка и краска. Без архитектурного плана хороший дом не построить.

Почему же тогда многие разработчики начинают с разработки внешнего вида? Это тот вопрос, на который нужно ответить самим разработчикам, и который нужно разъяснить клиентам. Многие полагают, что пара страниц сайта, нарисованных дизайнером в Фотошопе, это и есть информационная архитектура. Но это не так, на самом деле это визуальная архитектура (presentation architecture), т.е. то, как информация, взятая из ИА, будет показана. Это - почти эквивалент юзабилити. Возвращаясь к примеру с библиотеками, визуальная архитектура - это всего-навсего вопросы, того как выглядят карточки каталога. Но прежде всего надо позаботиться о том, чтобы информацию на карточках (Web-страницах) можно было легко найти и легко прочитать.

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

Положение в рейтинге поисковиков - разбивая Web-сайт на правильные разделы (с логически обоснованными заголовками), ИА помогает выставить на первый план те ключевые элементы, которые используются поисковыми серверами при вычислении релевантности страниц (сюда входят названия страниц, ключевые слова, названия каталогов и файлов). Разве плохо для компании, если ссылка на её Web-сайт окажется в числе первых 10-20 результатов поиска?

Улучшение юзабилити - Если сайт имеет правильную ИА, с сайтом станет легче работать. Разумеется это не значит, что проект сайта не надо рассматривать с точки зрения юзабилити. Благодаря ИА будут чётко определены ключевые элементы навигации и их расположение, что облегчит работу графическому дизайнеру. Вспомните карточки из каталога библиотеки. В каждой библиотеке вы можете найти книгу по различным критериям (автор, название и т.п.), так почему же на веб-сайте все материалы должен быть разбиты по одному критерию? ИА даст вам и другие варианты.

Размещение файлов - те, кому приходилось обслуживать большой веб-сайт, знают, как много времени уходит на поиск файла, который надо обновить. Чем лучше ИА, тем быстрее вы отыщете этот файл. Хорошая ИА определяет категории, по которым можно разбить информацию. Как веб-разработчик, вы должны просто следовать этим категориям, создавая структуру каталогов и присваивая имена файлам. Тогда, для внесения изменений вам не придётся идти на сайт, и искать нужную страницу только для того, чтобы по её URL-у определить имя файла. Теперь вы можете вызывать любой файл сайта из своего редактора даже не зная пути к нему. Помните, что структура именования каталогов и файлов, построенная на ИА также использована поисковыми серверами для ранжирования страниц (см. пункт № 1). Разве это не снизит расходы на разработку в будущем? Трудно сказать точно на сколько именно, но примерно это может составить экономию от 1 до 5 %, в зависимости от частоты и природы вносимых изменений.

Нет нужды в редизайне - как часто вам доводилось менять целые разделы сайта только из-за того, что надо было добавить что-то новое. Уделив должное внимание ИА, как и в случае с системой Dewey Decimal System, вы с легкостью сможете добавлять любые новые материалы и при этому вам не придется полностью переделывать сайт. Сколько это поможет сэкономить денег скажем за пару лет? Тысячи и тысячи долларов, в зависимости от размеров и сложности сайта.

Сокращение времени разработки - выделив заранее время на разработку продуманной ИА Web-сайта, общее время разработки сайта можно сократить на 10-25 %.

Информационная Архитектура это вполне определенная, объяснимая и ценная дисциплина в искусстве Web-разработки. Web-разработчики просто обязаны овладеть этой дисциплиной и не забывать о ней в любом проекте. Если же вам нужен "крутой" информационный архитектор, загляните в библиотеку, вам подойдет любой ее работник, закончивший вуз по специальности "библиотечное дело" (Library Science degree).

Статьи по теме

Чат-бот – что это такое

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

2022-04-25

Основные UX-тренды 2022 года

Традиционно новый год приносит с собой ряд изменений в сфере e-commerce. Чтобы успешно конкурировать на рынке с другими компаниями, представ�...

2022-01-18

Особенности оформления подвала сайта

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

2021-08-02

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

Несмотря на то, что в последние годы переписка между компанией и клиентами является основным методом коммуникации, некоторые люди по-пр�...

2021-03-29

Фирменный стиль: секреты успешной разработки

Число брендов на мировом рынке постоянно увеличивается. Чтобы выделиться среди конкурентов, вам необходимо разработать фирменный стил�...

2021-03-19

ТОП-10 онлайн-консультантов для сайта

Онлайн-консультанты − помощники, которые встречают гостей сайта практически сразу после визита на интернет-площадку. Эти виджеты позво...

2021-02-24

Вопросы юзабилити: на что обратить внимание в 2021 году?

Вопросы юзабилити: на что обратить внимание в 2021 году? Начало года − время для подготовки плана работы над сайтом. В зоне внимания в�...

2021-01-19

Подключение платформы Яндекс.Диалоги на веб-сайт

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

2020-09-15

Текст для карточки товара: как сделать идеальное описание?

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

2020-08-21

Онбординг: получаем признание клиентов за несколько секунд

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

2020-07-30

Главная страница: идеальное юзабилити

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

2019-06-26

Поведенческие факторы: суть и специфика их влияния на продвижение сайта

Поведенческие факторы (ПФ) − это всевозможные действия, которые совершают на интернет-сайте посетители. Их набор меняется с течением вр�...

2019-06-18

Оформление электронной корзины: как не помешать пользователям сделать покупку?

Онлайн-коммерция − высококонкурентная сфера. Чтобы побудить пользователей к приобретению, мало просто добавить активную кнопку «Купит...

2019-05-15

Оформление текстов на сайтах: 10 полезных советов

Важность текстового контента для интернет-ресурсов трудно переоценить. Мы уже неоднократно говорили о том, что материалы должны быть ин...

2019-01-09

3 конкретных шага, чтобы сделать ЛЮБОЙ сайт продающим! Или как минимум улучшить его.

ЗДРАВСТВУЙТЕ! Нам все чаще за последнее время стали поступать заявки с вопросами: как привлечь клиентов, какие рекламные каналы работ...

2017-03-01