III этап. Разработка системы навигации
Навигация – это механизм перемещения по сайту, который позволяет посетителю найти то, что вы хотите ему показать.
Задачи навигации - дать ответ на три фундаментальных вопроса: Где я? Где я был? Куда я могу пойти?
Требования к системе навигации: не должна отягощать страницу, не должна отвлекать от содержимого, должна быть легкодоступной
Реализация навигации:
•навигация должна размещаться в верхней части страницы;
•желательно, чтобы она помещалась на один экран;
•если документ длинный, то систему навигации желательно продублировать внизу страницы;
•для изображений, которые используются в графической системе навигации необходимо обязательно давать альтернативное текстовое представление;
•различные типы навигации должны быть визуально отделены друг от друга.
Классификация систем навигации:
•глобальная (перемещение между разделами сайта)
•локальная (перемещение в пределах одного раздела сайта)
Общий алгоритм построения системы навигации:
1.Включаем домашнюю страницу, страницы разделов и наиболее важные страницы в глобальную навигацию;
2.Ссылки в рамках подразделов включаем в локальную систему навигации – уникальна для каждого раздела;
3.Если на некоторых страницах требуется сослаться на страницу другого раздела, включаем соответствующую ссылку в контекстную навигацию;
4.Используем другие способы навигации по мере надобности.
Результат:
•список страниц с глобальной навигацией
•список страниц с локальной навигацией
•список страниц с другой навигацией
Правила построения навигации
1.Не усложняй!
2.Не прячь!
3.Правило 7 +/- 3
4.Не углубляйся!
5.Три клика
Основным принципом построения навигации является баланс широты и глубины информации. Баланс между широтой и глубиной заключается в балансе между пунктами меню, видимыми на странице (широта) и числом иерархических уровней сайта (глубиной)
IV. Проектирование визуального дизайна
Основная задача – визуально представить структуру типовых страниц сайта. Для решения данной задачи необходимо разработать макеты (сетку) типовых страниц сайта.
Макет – это чисто информационный (без всякого дизайна) каркас, в котором намечено содержимое, первичная и вторичная навигация, а также некоторые функциональные возможности.
Для создания макета страниц сайта необходимо определить типы страниц сайта с точки зрения их содержимого, чтобы можно было создать шаблон страницы.
Пример типовых страниц:
•Главная страница
•Страница подраздела
•Информационная страница (текст и графика)
•Страница просмотра товара и т.д.
Типовых страниц не должно быть очень много (обычно 2-3). Для каждой типовой страницы создается своя сетка-шаблон.
Алгоритм разработки макета типовой страницы
1.Определить расположение глобальной и локальной навигации на странице.
2.Определить размер и положение логотипа.
3.Определить местоположение контента на странице.
4.Определить положение дополнительной контекстной информации
(авторские права, реквизиты компании и т.д).
5.Нарисовать эскиз сетки
ПРИМЕРЫ.
1. www.intersport.com Страница первого уровня
-
- www.intersport.com Страница второго уровня
-
- www.intersport.com Страница третьего уровня
-
2. ozone.com.ua. Страница первого уровня
- ozone.com.ua. Страница второго уровня
Страница третьего уровня