Хедер сайта и футер: что это и что в них поставить, чтобы были заявки

РАЗДЕЛ 01Что такое хедер сайта простыми словами

Хедер (от английского header, «заголовок, шапка») это блок, который стоит в самом верху страницы и обычно повторяется на всех страницах сайта. В нём логотип, название, меню, контакты. На многих сайтах шапка «прилипает» и едет за человеком при прокрутке.

Слово пишут по-разному: хедер, хэдер, хеддер, хэддер, хейдер, даже хедр и heder латиницей. Правильного варианта в словарях нет, в профессиональной речи чаще всего говорят «хедер» или просто «шапка». Смысл у всех вариантов один.

Как называется верхняя часть сайта, где логотип

Её называют шапкой или хедером. Самая верхняя тонкая строка над шапкой, где бывают город, телефон или «Доставка и оплата», называется верхней строкой или топ-баром. Это тоже часть хедера, просто второй уровень.

Как называется нижняя часть страницы сайта

Это футер (footer) или подвал. Футер страницы стоит в самом низу, под основным содержимым, и тоже обычно одинаковый на всём сайте.

РАЗДЕЛ 02Что поставить в хедер сайта, чтобы были заявки

Хедер видит каждый посетитель, и он видит его первым. Если человек пришёл из рекламы, у него есть несколько секунд, чтобы понять три вещи: что это за компания, занимается ли она тем, что он ищет, и как с ней связаться.

Логотип и одна строка о том, что вы делаете

Логотип сам по себе ничего не объясняет человеку, который видит вас впервые. Рядом с ним нужна короткая подпись: «Ремонт квартир под ключ» или «Оптовые поставки упаковки». Это называется дескриптором, и он экономит человеку первую мысль «куда я попал».

Контакты, по которым удобно написать

Мессенджеры, телефон, если на нём кто-то реально отвечает, кнопка «Оставить заявку». Ссылки на мессенджеры должны открывать чат сразу, а не страницу «Контакты». Номер телефона на мобильном должен быть кликабельным.

Меню без лишнего

Пять-семь пунктов достаточно. Если меню разрослось до пятнадцати, человек тратит время на чтение пунктов, а не на решение. Второстепенное уносите в футер.

Гео и режим работы

Если вы работаете в конкретном городе, напишите его в шапке. Если работаете удалённо, тоже напишите. Человек должен понять, обслужите ли вы его, не открывая страницу «О компании».

РАЗДЕЛ 03Хедер это в магазине: шапка интернет-магазина

У интернет-магазина шапка устроена сложнее, потому что человек приходит не за одним предложением, а за конкретным товаром.

Каталог и поиск

Кнопка каталога и строка поиска главное в шапке магазина. Поиск должен быть виден сразу, а не прятаться за иконкой лупы на десктопе. На мобильном его часто выносят отдельной строкой под логотипом.

Корзина и личный кабинет

Иконка корзины с числом товаров, вход в кабинет, избранное. Эти элементы люди ищут глазами в правом верхнем углу, потому что так привыкли на маркетплейсах. Переносить их в непривычное место не стоит.

Доставка и условия

В верхней строке магазина хорошо работают короткие условия: «Доставка по России», «Бесплатно от суммы такой-то», «Самовывоз». Это снимает вопрос до того, как человек дошёл до корзины. Если хотите глубже разобраться, как продвигать сам товар в разных каналах, есть статья про рекламу товаров.

РАЗДЕЛ 04Хедер на мобильном: где теряются заявки

Большая часть трафика из рекламы во многих нишах приходит с телефонов. Шапка, нормальная на компьютере, на мобильном часто превращается в проблему.

Высота шапки

Если хедер занимает треть экрана телефона, первый экран почти пустой. Шапка на мобильном должна быть компактной: логотип, одна-две иконки связи, бургер с меню.

Липкая шапка

Хедер, который едет за человеком при прокрутке, удобен: кнопка связи всегда под рукой. Но только если он тонкий. Толстая липкая шапка съедает место под контент на каждом экране.

Бургер-меню

Внутри бургера должно быть то же меню, что и на десктопе, плюс контакты. Частая ошибка: на мобильном в меню нет ни телефона, ни мессенджеров, и человеку приходится листать до футера.

РАЗДЕЛ 05Футер сайта: что это и что в нём должно быть

Футер сайта это, простыми словами, последний блок каждой страницы. До него доходят люди, которые дочитали, но ещё не решились. Часто именно в подвале человек ищет подтверждение, что компания настоящая.

Реквизиты и юридическая информация

Название юрлица или ИП, ИНН или ОГРН, адрес, если он есть. Для человека это сигнал, что за сайтом стоит реальная компания. Для B2B-клиентов это обязательная часть: их бухгалтерия будет проверять контрагента.

Политика конфиденциальности

Если сайт собирает имя и телефон через форму, это сбор персональных данных. По тексту статьи 18.1 закона 152-ФЗ «О персональных данных» на consultant.ru (проверено в октябре 2026) оператор, собирающий данные через интернет, должен опубликовать документ о своей политике обработки персональных данных на страницах сайта, через которые идёт сбор, и обеспечить к нему доступ. Ссылку на политику обычно ставят в футер и рядом с каждой формой. Это не юридическая консультация: текст политики лучше согласовать с юристом.

Навигация и карта ссылок

В футер уносят то, что не поместилось в шапку: разделы услуг, статьи, документы, доставка, вакансии. Здесь нет ограничения на пять пунктов, но ссылки нужно группировать по смыслу, а не сваливать в одну колонку.

Контакты ещё раз

Человек, который дочитал страницу до конца, не должен листать обратно наверх, чтобы написать. Мессенджеры, телефон, кнопка заявки в подвале обязательны.

РАЗДЕЛ 06Футер в веб-дизайне: как оформить подвал

Футер в веб-дизайне это отдельный блок со своей сеткой. Его делают визуально отличным от основной части: другой фон, мельче текст, колонки.

Колонки по смыслу

Обычная схема на десктопе: три-четыре колонки. Компания и реквизиты, услуги или каталог, полезное (статьи, доставка, вопросы), контакты. На мобильном колонки складываются в одну, и важно, чтобы контакты не оказались в самом низу под длинным списком ссылок.

Читаемость

Мелкий светло-серый текст на сером фоне смотрится аккуратно в макете и не читается на телефоне на улице. Контраст в подвале нужен такой же, как в основном тексте.

Чего не класть в подвал

Простыню ключевых слов, десятки ссылок на одинаковые страницы «услуга в районе таком-то», счётчики посещаемости на виду. Это не помогает человеку, а поисковики видят в таких блоках попытку манипуляции.

Неважно, заказываете вы дизайн сайта в Ярославле, в Казани или у дизайнера в другой стране: просите показать шапку и подвал на мобильном до того, как утверждать макет. Про этапы и стоимость разработки дизайна есть отдельная статья: разработка дизайна сайта.

РАЗДЕЛ 07Как хедер и футер влияют на рекламу и SEO

Шапка и подвал есть на каждой странице. Поэтому любая ошибка в них умножается на весь сайт.

Посадочная под рекламу

Когда человек приходит из Директа, у него нет терпения. Если в шапке нет понятного предложения и кнопки связи, заметная часть людей уходит с первого экрана. Я на этапе подготовки рекламы всегда проверяю хедер посадочной на телефоне. Подробно про то, как собрать страницу под Директ, в статье про посадочную для Директа.

Сквозные ссылки для поиска

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

Скорость загрузки

Тяжёлые анимации, видео и виджеты в шапке грузятся на каждой странице. Если хедер тормозит, тормозит весь сайт.

РАЗДЕЛ 08Пошагово: как проверить хедер и футер своего сайта

Возьмите телефон и откройте сайт так, как его откроет клиент из рекламы.

1. Через три секунды после загрузки ответьте себе: понятно ли, что за компания и что она делает? Если нет, нужна строка под логотипом.
2. Нажмите на телефон и на мессенджер в шапке. Открылся звонок и чат или страница «Контакты»?
3. Откройте бургер-меню. Есть ли там контакты?
4. Прокрутите вниз. Если шапка липкая, сколько места она занимает?
5. Долистайте до футера. Есть ли там реквизиты, политика конфиденциальности, контакты и кнопка?
6. Проверьте, читается ли текст в подвале при яркости экрана на улице.
7. Повторите то же самое на компьютере.

Каждый пункт, где вы споткнулись, это место, где спотыкается клиент.

РАЗДЕЛ 09FAQ

Отвечает Никита Морозов

Что такое хедер сайта?

Это верхняя часть страницы, шапка: логотип, меню, контакты и главная кнопка. Обычно она одинаковая на всех страницах сайта.

Как правильно: хедер, хэдер или хеддер?

Нормативного варианта нет. В профессиональной речи чаще говорят «хедер» или «шапка», остальные варианты означают то же самое.

Как называется нижняя часть страницы сайта?

Футер или подвал. Там размещают реквизиты, документы, навигацию по разделам и контакты.

Что обязательно должно быть в футере?

Контакты, реквизиты компании и, если сайт собирает данные через формы, ссылка на политику обработки персональных данных. Плюс навигация по основным разделам.

Что поставить в шапку интернет-магазина?

Каталог, поиск, корзину, вход в кабинет и короткие условия доставки в верхней строке. Человек должен сразу найти товар и понять, сколько стоит доставка.

Нужна ли липкая шапка?

Нужна, если она тонкая и в ней есть кнопка связи. Высокая липкая шапка на мобильном мешает читать.

Влияет ли футер на SEO?

Влияет через сквозные ссылки: по ним роботы находят разделы. Но переспам ключами и сотни ссылок в подвале вредят.

РАЗДЕЛ 10С чего начать

1. Пройдите чек-лист из семи шагов выше на своём телефоне и запишите, где споткнулись.
2. Добавьте под логотип одну строку о том, что вы делаете, и сделайте кликабельными телефон и мессенджеры.
3. Проверьте футер: реквизиты, политика конфиденциальности, контакты и кнопка заявки.
4. Если запускаете рекламу, проверьте шапку посадочной до старта кампании, а не после первых счетов.

Если хотите, чтобы на сайт посмотрел человек со стороны, пришлите адрес: разберу хедер и футер глазами клиента из рекламы.

Никита Морозов

Яндекс Директ, SEO, маркетинг под ключ

Веду кабинеты клиентов сам, без передачи «младшему специалисту». Тексты на сайте написаны по тому, что вижу в отчётах, а не по чужим гайдам.

9лет в нише

200+проектов

4,919 оценок на Картах

Telegram-канал Отзывы на Яндекс Картах Кейсы