Футер сайта, или подвал — самый нижний завершающий блок каждой веб-страницы. В коде он обозначается семантическим тегом <footer>, откуда и пошло его название. Противоположность футера — шапка сайта, или хедер.
На первый взгляд футер — это просто то, что осталось внизу. На самом деле это один из самых рабочих элементов сайта: именно сюда пользователь смотрит, когда не нашёл нужную информацию на основной странице. Именно отсюда поисковые роботы берут ссылки для обхода всего сайта. И именно здесь хранится обязательная правовая информация, которую закон требует размещать на каждой странице.
Зачем нужен футер
Три ключевые функции, которые выполняет подвал сайта.
Удобство для пользователей. Человек дочитал страницу до конца и хочет связаться с компанией, найти нужный раздел или проверить правовую информацию. Футер — последнее место, куда он посмотрит. Контакты, карта сайта, ссылки на разделы — всё это должно быть здесь.
SEO и внутренняя перелинковка. Футер присутствует на каждой странице сайта, а значит, ссылки из него передают вес по всему ресурсу. Это зона плотной внутренней перелинковки, которая влияет на распределение ссылочного веса и помогает поисковым роботам обходить сайт.
Юридические обязательства. Закон № 152-ФЗ «О персональных данных» требует размещать политику конфиденциальности на каждой странице сайта, который собирает данные пользователей. Футер — стандартное место для этого.
Что обязательно должно быть в футере
| Элемент | Зачем нужен | Обязательно для |
|---|---|---|
| Контактная информация | Телефон, email, адрес, мессенджеры — всё в одном месте | Всех сайтов компаний |
| Политика конфиденциальности | Требование 152-ФЗ для сайтов, собирающих данные | Любой сайт с формами |
| Информация о копирайте (©) | Год создания, название компании, права на контент | Всех сайтов |
| Карта сайта | Ссылки на все разделы, помощь поисковым роботам | Многостраничных сайтов |
| Навигация по разделам | Дублирует главное меню или предоставляет расширенную навигацию | Корпоративных сайтов и магазинов |
| Правовая информация | Лицензии, реестровые номера, оговорки об ответственности | Медицинских, образовательных, финансовых сайтов |
| Кнопка «Наверх» | Возврат к началу страницы без ручного скроллинга | Длинных страниц |
Что дополнительно можно разместить в футере
Дополнительные элементы зависят от типа сайта, задач бизнеса и аудитории. Это не обязательные компоненты, но они могут усилить доверие и удержать пользователя.
- Логотипы партнёров и сертификаты — работают как социальное доказательство. Партнёрство с известными брендами, членство в ассоциациях, сертификаты качества — всё это повышает доверие к компании у пользователя, который ещё не принял решение. СМИ размещают здесь логотипы информационных партнёров.
- Форма подписки или обратного звонка — последний шанс захватить контакт пользователя, который уже пролистал всю страницу. Если человек дошёл до конца, но не совершил целевого действия — форма в футере может помочь.
- Ссылки на соцсети — стандартный элемент для любого сайта, активно работающего с аудиторией в социальных медиа.
- Карта проезда — актуальна для офлайн-бизнесов: кафе, медицинские центры, розничные магазины. Пользователь, который добрался до подвала, нередко ищет именно адрес.
- Возрастные ограничения — обязательны для сайтов с контентом 18+, алкогольной, табачной продукцией.
- Ссылка на брендбук — встречается редко, но полезна для крупных компаний: сторонние подрядчики (дизайнеры, типографии) могут самостоятельно найти нужные логотипы, цвета и шрифты.
- Счётчики посещаемости — актуальны для информационных ресурсов, зарабатывающих на рекламе: данные счётчика помогают рекламодателям оценить аудиторию.
Хедер vs футер: в чём разница
| Критерий | Хедер (шапка) | Футер (подвал) |
|---|---|---|
| Расположение | Верхняя часть страницы | Нижняя часть страницы |
| Первичная функция | Навигация, брендинг, призыв к действию | Вспомогательная информация, перелинковка |
| Видимость | Первое, что видит пользователь | Видит тот, кто дочитал до конца |
| Содержание | Логотип, главное меню, контакт/CTA | Расширенная навигация, контакты, правовое |
| SEO-роль | Главные ссылки сайта | Дополнительная внутренняя перелинковка |
Оба элемента присутствуют на каждой странице сайта — это делает их особенно важными с точки зрения SEO. Ссылки в хедере и футере получают максимальный авторитет при расчёте внутреннего ссылочного веса. Именно поэтому не стоит заполнять футер случайными ссылками — каждая из них получит «заряд» со всего сайта.
Тег footer в HTML
В семантической разметке HTML5 для подвала используется тег <footer>. Он сообщает браузеру и поисковым роботам, что этот блок является подвалом страницы или раздела. До HTML5 для этой цели использовался обычный <div> с классом footer или bottom.
Базовая структура в коде выглядит так:
<footer>
<div class="footer-contacts">
<p>Телефон: +7 (495) 000-00-00</p>
<p>Email: info@company.ru</p>
</div>
<nav class="footer-nav">
<a href="/o-nas">О компании</a>
<a href="/uslugi">Услуги</a>
<a href="/contacts">Контакты</a>
</nav>
<p>© 2025 Название компании. Все права защищены.</p>
</footer>
Тег <footer> можно использовать не только для всей страницы, но и внутри отдельных разделов: статей (<article>), разделов (<section>). В таком случае он обозначает подвал именно этого блока, а не всей страницы.
Типичные ошибки при оформлении футера
- Слишком много ссылок. Футер с сотней ссылок не помогает ни пользователям, ни SEO — он просто перегружает страницу и размывает ссылочный вес. Стандартная рекомендация — не более 30–40 ссылок в подвале.
- Нет политики конфиденциальности. Если сайт использует формы или счётчики аналитики — он по закону обязан иметь политику конфиденциальности. Отсутствие ссылки на неё в футере — формальное нарушение 152-ФЗ.
- Устаревший копирайт. Надпись «© 2018 Компания» в 2025 году выглядит как заброшенный сайт. Год в копирайте стоит обновлять — или ставить диапазон: «© 2018–2025».
- Нечитаемый текст. Мелкий серый шрифт на тёмном фоне — частая проблема футеров. Правовая информация должна быть доступна, а не спрятана. Поисковые системы это тоже видят.
- Отсутствие мобильной адаптации. Если колонки футера на мобильном устройстве съезжают или текст выходит за экран — это UX-проблема. На мобильных колонки должны складываться в вертикальный стек.
Примеры хорошего и плохого футера
Хороший футер:
- чёткая структура с разделением на блоки (контакты, навигация, правовое),
- читаемый шрифт достаточного размера,
- наличие всей обязательной информации,
- адаптация под мобильные.
Ссылок ровно столько, сколько нужно — не больше. Логотип или название компании присутствуют.
Плохой футер: просто строка «© 2019 Компания» без контактов, навигации и правовой информации. Или наоборот — бесконечный массив ссылок на ключевые слова, который очевидно создан для поисковых роботов, а не для людей. Поисковые системы распознают оба варианта как некачественный дизайн и могут снизить доверие к сайту.
Комментарии скоро откроются. А пока — пишите нам в Telegram-канал.