ДокументацияРазделы, компоненты, системы и их подразделы
Система навигации
Положение, направления и возврат
02 · Система навигации
Пользователь всегда понимает своё положение
Навигация связывает информационную архитектуру, URL и видимые элементы управления в один предсказуемый маршрут.
Три вопроса
Навигация постоянно объясняет контекст
Активный пункт, заголовок и breadcrumbs называют контекст одинаково.
Ссылки выглядят и ведут себя предсказуемо, без скрытых маршрутов.
URL, история браузера и иерархия не противоречат друг другу.
Уровни
Один основной способ перемещения на каждом уровне
ГлобальныйГлавные разделы продукта.
РазделМатериалы внутри выбранной области.
ЛокальныйTabs и ссылки внутри текущего контекста.
ДанныеPagination перемещает по большой коллекции.
Состояние URL
Маршрут должен переживать обновление страницы
- ПутьОпределяет устойчивое положение в структуре продукта.
- QueryХранит фильтры, сортировку и страницу набора данных.
- HashВедёт к именованной части длинного материала.
- ИсторияКнопка «Назад» возвращает предыдущее значимое состояние.
Доступность
Ссылки остаются ссылками
Переходы используют ссылки, действия — кнопки. Текущий пункт получает aria-current, раскрываемые группы сообщают aria-expanded, а порядок фокуса повторяет визуальный маршрут.