используя выпадающие списки для навигации

Question

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

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

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

3. Используйте аккордеоны, например - Jquery гармошка - преимущество: расположение меню по вертикали оставляет достаточно места для расширения.Проблемы: Аккордеон будет на левой боковой панели.Я хотел бы держать меню в верхней части и оставить всю ширину под меню для содержимого.Пользователю трудно увидеть текущее выбранное меню, потому что аккордеон, кажется, восстанавливает исходное состояние после обновления страницы.Я знаю, что это можно исправить, но я не эксперт по JavaScript.Я также хотел бы сохранить свою страницу с минимальным javascript.

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

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

Answer 1

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

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

попробуйте разбить его на три уровня вместо двух.

Взгляните на несколько крупных интернет-магазинов, таких как Amazon или Ebuyer. у них есть абстрактные предметы наверху, тогда, когда вы углубляетесь, вы получаете все больше и больше subnavs.

Answer 2

Посмотрите на эту страницу, простую навигацию CSS, но вы можете создать действительно красивое меню / подменю и т. Д.

http://htmldog.com/articles/suckerfish/

Использовали его на нескольких сайтах для компаний, и все они называлиЭто хороший способ для просмотра их категорий.

Пример: http://htmldog.com/articles/suckerfish/dropdowns/example/vertical.html
Пример: http://www.yec.nl
Пример: http://www.klaveryachtpainting.com