Подвал группы. Передаётся в конце children.
Доступность (a11y)
Семантическая роль
По умолчанию использует HTML-тег <footer>, дополнительно задаётся роль role="contentinfo" (для поддержки Safari<=13 ↗).
Предназначен для:
- контактной информации;
- ссылок на разделы сайта;
- копирайта и юридических данных;
- мета-информации о содержимом.
Ключевые правила
| Сценарий | Решение | Почему важно |
|---|---|---|
| Глобальный подвал страницы | Только один на страницу | Соответствие стандартам WAI-ARIA |
| Несколько подвалов | Добавить aria-label каждому | Различение разделов скринридерами |
| Декоративный элемент | <Footer Component="div"> | Избежать ложной семантики |
Контекст использования
В данном примере первый Footer “локальный”, потому что находится внутри секционного контента (компонент Group)
и содержит мета-информацию, а второй Footer - глобальный, потому что относится ко всей странице.
Множество
Несколько подвалов без контекста скринридеры воспринимают как дубли, чтобы этого избежать,
добавляйте aria-label каждому компоненту:
<Footer aria-label="Навигация">
<Link href="#about">О нас</Link>
<Link href="#contacts">Контакты</Link>
</Footer>
<Footer aria-label="Юридическая информация">
<Text>© 2025 Компания</Text>
</Footer>Пользовательский тэг
Используйте Component="div" если:
- контент не соответствует семантике подвала;
- элемент используется для визуального оформления;
- уже есть глобальный подвал на странице.
// Декоративный раздел
<Footer Component="div">Информация на данной странице является конфиденциальной.</Footer>