Дублирование меню

Interaction Design Patterns (Web)
автор: 2002 Martijn van Welie
перевод: Александр Качанов

(назад к списку)

от www.minvws.nl

Задача

Предоставить посетителям доступ к основной навигации по сайту

Условия

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

Решение

Повторите меню навигации внизу страницы

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

Почему

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

Еще примеры

На сайте Planet Internet site (www.planet.nl) верхний блок выглядит так:

Пример верхнего меню Planet Internet site www.planet.nl (4 кб)

А нижний блок повторяет все те же самые пункты меню, только в несколько более простом оформлении:

Пример нижнего меню Planet Internet site www.planet.nl (2 кб)

Используют

www.planet.nl; www.minvws.nl

Другие шаблоны

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


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