Нижняя навигация для мобильных и планшетов
Мобильная навигация стала лучше. Мы добавили постоянную панель навигации внизу для пользователей мобильных устройств и планшетов.
Что изменилось
Раньше
- Навигация только сверху (требуется прокрутка вверх для переключения страниц)
- Меню-гамбургер для вторичной навигации
- Сложнее переключаться между разделами во время просмотра
Теперь
- Панель навигации внизу всегда видна (удобно для большого пальца)
- Быстрый доступ к брендам, основателям, инсайтам, рынкам
- 44px сенсорные цели (Руководство по интерфейсу iOS)
- Автоматическое скрытие при прокрутке вниз (больше места для чтения)
- Появляется при прокрутке вверх (всегда доступно)
Почему нижняя навигация?
Оптимизация зоны большого пальца: На телефонах 5.5" и больше нижняя треть экрана — самая лёгкая область для доступа одной рукой.
Переключение контекста: Пользователи могут переходить от профиля бренда к рыночным инсайтам к историям основателей без прокрутки наверх.
Конвенции платформы: Нативные приложения (Instagram, Twitter, YouTube) используют нижнюю навигацию — это привычно и интуитивно понятно.
Адаптивное поведение
- Мобильные (< 768px): Нижняя навигация видна
- Планшеты (768px - 1024px): Нижняя навигация видна
- Десктоп (> 1024px): Только традиционная верхняя навигация
Технические детали
- Закреплённое позиционирование: На основе CSS, JavaScript не требуется
- Оптимизировано для касаний: Минимальный размер цели 44px
- Анимированные переходы: Плавное показ/скрытие при прокрутке
- Доступность: Правильные ARIA-метки, поддержка навигации с клавиатуры
Что дальше
Мы рассматриваем добавление значка поиска в нижнюю навигацию для ещё более быстрого доступа к нашей базе данных брендов.
Попробуйте — откройте Brandmine на телефоне и исследуйте. Навигация должна ощущаться естественной и лёгкой.