Навигация

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

Следует иметь в виду, что часто, если не всегда, посетителей на ваш сайт «приводят» поисковые системы и социальные медиа [прим. перев.: социальные сети, форумы, блог-платформы, рекомендательные и закладочные службы] и оказываются они [посетители] на какой угодно странице сайта, только не на главной. Вот почему следует задуматься о наличии кнопки или ссылки «На главную».

На многих сайтах навигация — двух типов: главная и второстепенная. Элементы первого типа обычно располагаются наверху, слева или справа, второго — в нижней или в верхней части страницы. Последние в большинстве случаев — менее заметны, чем первые. Меню, относящиеся ко второстепенным средствам навигации, содержат такие ссылки как «Свяжитесь с нами», «О нас», «Юридическая информация». Второстепенные средства навигации нужны для материалов, которые требуются посетителям не в первую очередь, но должны быть доступны при необходимости.

В качестве общего правила можно порекомендовать использование 4—8 ссылок на одном уровне навигации, но не больше восьми.

Навигационная цепочка («хлебные крошки»)

«Хлебные крошки» — вспомогательное навигационное средство. Источник термина «хлебные крошки» — сказка братьев Гримм, герои которой, пробираясь через лес, оставляли за собой хлебные крошки, чтобы найти обратный путь. Обычно, навигационная цепочка выводится горизонтально в верхней части сайта. Применяются два ее варианта.

• Первый предполагает отображение пути пользователя по сайту до текущей страницы.
• Второй предполагает отображение иерархии разделов, которым принадлежит текущая страница [родительский раздел → родительский раздел → текущая страница].

Благодаря «хлебным крошкам» у посетителей не создается впечатления, что они заблудились. В идеале, они всегда должны представлять, где именно находятся, и как вернуться на любую из открытых ранее страниц. В исходной комплектации Joomla! есть модуль «Навигатор сайта», а во многих шаблонах есть для него специальная позиция (рис. 1).

Рис. 1. «Хлебные крошки».

Меню Joomla

Основным навигационным средством сайтов, построенных на основе Joomla, являются меню. Создавать их можно в любом нужном вам количестве. Каждое меню может содержать неограниченное количество пунктов и подпунктов и позволяет фильтровать выводимые пункты по критерию принадлежности к тому или иному уровню [например, выводить только пункты 2-го, 3-го и 4-го уровней]. Каждый пункт меню может относиться к компоненту или являться прямой ссылкой на страницу. К пункту меню, в свою очередь, могут быть привязаны определенные модули и шаблоны. Если вы сохранили демонстрационные данные, то у вас есть образцы пунктов меню.

Давайте рассмотрим два примера реализации главной навигации.

Первый пример: статичный каталог или «книжная» структура

Такой вариант навигации подойдет для публикации на сайте книги, руководства или каталога. Пример подобной структуры — меню «About Joomla!» [демонстрационные данные]. Предположим, мы создаем сайт-книгу, состоящую из трех глав. Навигация должна обеспечивать доступ к каждой странице и выглядеть подобно той, что изображена на рис. 2.

Рис. 2. Статичная, «книжная» структура.

Подготовка

Давайте определим структуру книги.

• Руководство для начинающих
  • Введение
  • Контент
    • Перечни статей
    • Формат «Блог»
  • Шаблоны

Прежде, чем создавать пункты меню, следует создать сами статьи. Для этого воспользуйтесь менеджером материалов: текстовое меню административного раздела → пункт «Материал» → подпункт «Менеджер материалов» → подпункт «Создать материал» (рис. 3). Вы можете включить статьи в категорию «Uncategorized» [«Неклассифицированные»], а можете, прежде чем создавать статьи, создать для них категорию.

Рис. 3. Шесть глав книги.

Этап №1: создание меню

Для устройства навигации по сайту-книге можно воспользоваться уже существующим меню, а можно создать свое при помощи менеджера меню: текстовое меню административного раздела → пункт «Меню» → подпункт «Менеджер меню» → подпункт «Создать меню» (рис. 4).

Рис. 4. Создание нового меню.

Этап №2: создание пунктов меню

Необходимо открыть меню «Книга» (текстовое меню административного раздела → пункт «Меню» → подпункт «Книга») и создать шесть пунктов типа «Материал». Каждый из них нужно именовать и привязать к соответствующей статье (рис. 5). Если вы забыли как это делается, обратитесь к главе «Создаем страницу „О нас“».

Рис. 5. Пункты меню «Книга».

Этап №3: создание модуля вывода меню

Этот этап связан с некоторыми сложностями. У вас есть: статьи, меню и пункты, связанные со статьями, но для того, чтобы посетитель мог вашим меню воспользоваться, нужен модуль. Давайте создадим его. Для этого потребуется менеджер модулей: текстовое меню административного раздела → пункт «Расширения» → подпункт «Менеджер модулей» → пиктограмма «Создать» → пункт «Меню» в перечне. На открывшейся странице заполните поля [форм «Подробно» и «Привязка к пунктам меню»]. При помощи выпадающего списка в поле «Выбор меню», в форме «Основные параметры», свяжите модуль с меню «Книга». Выберите значение «Да» в поле «Показывать подпункты меню» (рис. 6).

Рис. 6. Модуль вывода меню «Книга».

Последний шаг — выбор модульной позиции. Выбрать позицию можно, кликнув по кнопке «Позиция». В появившемся всплывающем окне при помощи фильтра нужно выбрать позиции, относящиеся к шаблону «Beez_20», из отфильтрованных выбрать «position-4» и сохранить настройки [пиктограмма «Сохранить»].

Рис. 7. Выбор позиции модуля меню.

Второй пример: меню, ссылающееся на разделы (по образцу новостных сайтов)

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

Подготовка

Нам понадобятся статьи, объединенные в несколько категорий:

Категории:

• Новости
  • Международные
    • Африка
    • Европа
  • Технологии
    • Интернет
    • Автомобили

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

Этап №1: меню

Выбор дальнейших действий — за вами. Самый простой способ — переделать пункты имеющегося меню «Книга». Альтернатива — создание меню «Новости». Я создал его, и вы, если хотите, можете последовать моему примеру.

Этап №2: пункты меню

Имея дело с категориями, следует задумываться над тем, что увидит посетитель, кликнув по тому или иному пункту меню, связанному с ними. Нам нужно следующее:

• пункт «Новости» — отображаются все статьи категории «Новости» и вложенных категорий;
• пункт «Международные» — отображаются только статьи категории «Международные».

И так далее.

Рис. 8. Пункты в меню «Новости».

Для того, чтобы система вела себя так, как описано выше, создавая пункт «Новости», выберите тип «Блог категории». В «Обязательных параметрах» выберите вновь созданную категорию «Новости». На панели «Параметры макета Блога» в выпадающем списке «Включать подкатегории» выберите пункт «Все», а в поле «Во всю ширину» введите значение «0». Создайте пункты меню для прочих категорий — и все готово (рис.9).

Рис. 9. Настройки отображения категории.

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

Рис. 10. Структура категории. Статьи.

Прочие возможности

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

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

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