Навигация. 
Проектирование и создание тематического Интернет-портала

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

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

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

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

Навигация дает почву для ног. Заблудиться где-либо — это, как правило, не очень весело. Если навигация разработана правильно, то она дает почву для ног пользователя, а также служит в качестве перил, на которые можно опереться. Используйте «хлебные крошки». Это набор текстовых ссылок, отражающих последовательность перемещения пользователя от домашней страницы к другим страницам Web-узла.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Имеет смысл помещать само окно поиска или соответствующую ему ссылку на каждой странице сайта. Если на вашем сайте действительно есть что искать, то поместите на нем поисковое окно. Формула окна поиска действительно проста: окно поиска, кнопка и слово «Поиск».

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

Названия Web-страниц можно сравнить с дорожными указателями: когда все идет нормально, их можно совсем не замечать. Но если у вас возникает ощущение, что вы двигаетесь не в том направлении, то нужно посмотреть на название страницы, чтобы определить собственное местонахождение.

Что нужно знать относительно названий страниц:

Каждая страница должна иметь название. Недостаточно всего лишь выделить название страницы в навигации.

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

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

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

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

Один из наиболее популярных способов использования постоянной навигации — представление ссылок на разделы в виде вкладок.

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

Вкладки «самоочевидны». Никто, взглянув на интерфейс со вкладками не воскликнет: «А что это такое?».

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

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

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

Основные требования к вкладкам:

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

Вкладки должны быстро загружаться.

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

Одна из вкладок должна быть выбрана. Если ни одна из вкладок не оказывается уже выбранной, когда я захожу на сайт, то нужное воздействие вкладок теряется в первые же секунды.