25 удачных примеров дизайна подвала сайта
25 вариантов подвала сайта: от минимума юридических ссылок до большой карты сайта и блока местного бизнеса с картой. Что входит, кому подходит и как применить.
Частые вопросы
Как сделать подвал сайта доступным?
Используйте настоящий текст вместо изображений для часов работы и контактов, обеспечьте переход по каждой ссылке клавишей Tab и видимый контур фокуса, добавьте текстовые подписи к значкам соцсетей и проверьте достаточный контраст с фоном.
Что должно быть в подвале каждого сайта?
Как минимум: строка авторских прав с текущим годом, способ связаться с вами и ссылки на необходимые юридические страницы (политику конфиденциальности, условия и при необходимости заявление о доступности). Остальное зависит от типа сайта — варианты приведены ниже.
Сколько ссылок в подвале сайта — это слишком много?
Фиксированного числа нет, но список всех страниц становится шумом, который никто не читает. Разбейте ссылки на 3–5 колонок с заголовками (например, «Компания», «Продукт», «Ресурсы», «Юридическая информация»), а не в один длинный список.
Стоит ли добавить в подвал форму подписки на рассылку?
Это разумное дополнительное место: посетители, дошедшие до низа без конверсии, всё ещё вовлечены. Но не оставляйте форму только в подвале — разместите более заметную выше на странице.
Влияет ли подвал сайта на SEO?
Косвенно — да. Ссылки в подвале помогают поисковым системам и посетителям находить внутренние страницы; повторяющийся или перегруженный список на каждой странице мешает понять структуру сайта. Добавляйте ссылки осознанно и последовательно.
Нужно ли менять подвал сайта на мобильных устройствах?
Контент может быть тем же, но колонки должны складываться одна под другой с понятными отступами, а раскрывающиеся разделы — легко нажиматься. Частая ошибка — один длинный столбец мелкого нечитаемого текста.
Краткий ответ: лучшие подвалы сайтов строятся по нескольким повторяемым схемам: минимум юридических ссылок, большая карта сайта, подписка на рассылку, контакты местной компании с картой и другие варианты. Для результата важнее выбрать схему под тип сайта, чем изобретать уникальную. Ниже — 25 вариантов с содержимым, подходящей аудиторией и советом по применению.
Метод отбора и аудитория: руководство адресовано владельцам малого бизнеса и создателям сайтов. Мы сравниваем схемы по пяти элементам, которые посетители ищут внизу страницы: контакты, часы работы, основные услуги, ссылки на правила и навигация клавиатурой. Примеры ниже — иллюстративные шаблоны We.Inc, а не реальные компании.
Почему подвал важен для SEO
Подвал часто упускают из виду при SEO-оптимизации, хотя он может повлиять на успех или неудачу сайта. Компании, которые продумывают его заранее, избегают дорогой переделки и быстрее получают предсказуемый результат. Что важно для SEO:
- Выбирайте низкочастотные ключевые запросы с намерением купить или выполнить действие, а не только широкие информационные.
- Объединяйте близкие запросы в тематические кластеры, чтобы со временем укреплять тематический авторитет.
- Ставьте в приоритет запросы, по которым авторитет домена даёт реальный шанс попасть на первую страницу.
- Еженедельно отслеживайте позиции и обновляйте контент, когда рост останавливается.
- Сравнивайте объём поиска с конкуренцией: лучше всего большой спрос при низкой конкуренции.
Если для SEO вам нужен новый сайт, целевая страница или веб-приложение, We.Inc поможет быстро. Опишите задачу в чате, и ИИ создаст работающий редактируемый сайт прямо в браузере, чтобы вы могли запустить его без работы в редакторе дизайна.
Что нужно добавить в любой подвал
До выбора макета добавьте обязательное: строку авторских прав с текущим годом, работающий способ связи и ссылки на политику конфиденциальности и условия, если вы собираете персональные данные. Это необходимо для любого варианта.
Основные элементы подвала — важная часть продуманного сайта. Надёжная основа помогает всем остальным элементам работать лучше. Действуйте системно: выделяйте время, отслеживайте результат и вносите постепенные изменения. Задокументированный процесс важнее его сложности. В We.Inc можно создать страницу или приложение по простому описанию, а затем доработать кликами в визуальном редакторе или во встроенном редакторе кода.
| Элемент | Зачем нужен | Частая ошибка |
|---|---|---|
| Строка авторских прав | Базовая юридическая информация, которую легко добавить | Остался старый год |
| Политика конфиденциальности и условия | Часто нужны при сборе данных | Не добавлены или ведут на неработающую страницу |
| Контакты | Позволяют быстро связаться с вами | Контакт есть только на странице без прямой ссылки |
| Ссылки на соцсети | Дополнительный знак доверия | Ведут на заброшенные аккаунты |
| Карта сайта или основные разделы | Помогают найти страницы людям и поисковикам | Дублируют всё меню без сортировки |
25 вариантов подвала сайта
Схема подвала — важная часть структуры сайта. Сначала заложите основу, затем постепенно улучшайте результат. При работе:
- Проверьте решение на небольшом объёме, прежде чем вкладывать много времени или бюджета.
- Действуйте регулярно, а не рывками с долгими перерывами.
- Изучайте удачные решения конкурентов, не начиная с нуля.
- Убирайте лишние шаги: каждый дополнительный шаг снижает процент завершения.
- Отслеживайте опережающие показатели (усилия, активность) и итоговые (результаты), чтобы раньше замечать проблемы.
Если для проверки структуры подвала нужна новая страница, магазин или приложение, We.Inc превратит описание в рабочий сайт за несколько минут. Начните с шаблона, внесите изменения в чате и визуальном редакторе и запустите сайт на собственном домене с бесплатным SSL.
- Минимальный подвал с юридическими ссылками. Только авторские права, политика конфиденциальности и условия в одной строке. Для простого сайта компании или посадочной страницы, где подвал не занимается маркетингом. Совет: выровняйте по центру и сделайте сдержанным, чтобы он не конкурировал с призывом выше.
- Большой подвал-карта сайта. Несколько колонок с заголовками («Продукт», «Компания», «Ресурсы», «Юридическая информация»), охватывающих структуру сайта. Для крупных SaaS- и контентных сайтов. Совет: ограничьте каждую колонку 5–7 ссылками, чтобы их было легко просмотреть.
- Подвал с приоритетом рассылки. Перед ссылками стоит поле для электронной почты. Для издателей, блогов и контентного бизнеса, наращивающего аудиторию. Совет: форма не должна быть единственным местом подписки.
- Подвал местной компании с NAP и картой. Название, адрес, телефон и встроенная карта. Для любого бизнеса с физическим адресом. Совет: текст NAP должен совпадать с профилем компании в Google, а не просто выглядеть похоже.
- Подвал для загрузки приложения. Значки App Store и Google Play рядом с обычными ссылками. Для продукта с мобильным приложением. Совет: ведите значками прямо на страницы приложений, а не на главную.
- Подвал со знаками доверия. Печати безопасности, значки способов оплаты или отраслевые сертификаты. Для интернет-магазинов и компаний, принимающих платежи. Совет: используйте только подтверждённые знаки: просроченный или выдуманный сертификат хуже, чем никакого.
- Подвал с социальными доказательствами. Логотипы клиентов, упоминания в прессе или оценки на площадках с отзывами. Для B2B и сервисных компаний. Совет: размещайте логотипы только с разрешения.
- Большой подвал с поиском. Крупный блок со своей строкой поиска и ссылками карты сайта. Для больших справочных сайтов и маркетплейсов с большим объёмом контента.
- Подвал в один столбец. Все элементы идут вертикально, без колонок. Для простого сайта, портфолио или одностраничника. Совет: разделяйте группы отступами, а не тяжёлыми линиями.
- Двухуровневый подвал. Основная область с колонками и тонкая нижняя полоска только с авторскими правами и юридическими ссылками. Для сайта, который хочет визуально отделить маркетинговые ссылки от обязательной информации.
- Подвал с повторным CTA. Основной призыв («Записаться на демонстрацию», «Начать бесплатно») повторяется прямо над обычным содержимым подвала. Для посадочных и маркетинговых страниц. Совет: визуально отделите CTA от информационных ссылок ниже.
- Подвал со ссылкой наверх. Видимая кнопка или ссылка «Наверх», популярная на страницах с прокруткой. Для больших статей, портфолио с множеством работ и длинных посадочных страниц.
- Переключатель языка или региона. Меню или список языков и регионов в подвале. Для сайтов, работающих в нескольких странах или на нескольких языках.
- Подвал с командой и контактами. Имена, небольшие фотографии важных специалистов и прямые контактные ссылки. Для агентств и консалтинговых компаний, где важны доверие и отношения.
- Подвал-сообщество. Ссылки на Discord, форум или сообщество рядом со значками соцсетей. Для продуктов с активным сообществом пользователей.
- Подвал с наградами и признанием. Награды, упоминания «в прессе» и отраслевые рейтинги. Для компаний с конкретными подтверждёнными достижениями: не выдумывайте награду и не намекайте на ту, которой нет.
- Подвал со ссылкой на заявление о доступности. Прямая ссылка на заявление, иногда рядом с видимым значком настроек доступности. Для компаний, которые серьёзно относятся к инклюзивному дизайну; заявление можно подготовить инструментом ниже.
- Подвал группы родственных сайтов и брендов. Ссылки на другие проекты общей компании. Для организаций с несколькими связанными сайтами или продуктовыми линейками.
- Подвал срочной связи. Заметный номер телефона или контакт на случай срочного обращения, иногда с часами работы. Для медицины, юридических услуг, домашнего сервиса и других срочных услуг.
- Подвал с частыми вопросами. Прямые ссылки на 3–5 главных вопросов поддержки вместо общей ссылки «Помощь». Для интернет-магазинов и подписных продуктов, стремящихся сократить обращения.
- Подвал с вакансиями. Строка «Мы нанимаем» и ссылка на открытые вакансии. Для растущих компаний, использующих сайт и для поиска сотрудников.
- Подвал с пресс-китом. Прямая ссылка на логотипы, фирменные материалы и контакты для прессы. Для компаний, которые регулярно получают запросы от СМИ.
- Подвал для пожертвований и поддержки. Заметная ссылка «Поддержать» или «Сделать пожертвование», отдельно от основной кнопки меню. Для некоммерческих организаций и открытых проектов. См. наше руководство по дизайну сайта для НКО о странице пожертвований.
- Минималистичный тёмный подвал. Более тёмная полоса контрастирует со светлой страницей, иногда независимо от темы сайта. Для портфолио с выразительным дизайном и творческих студий.
- Подвал с обширной юридической информацией. Много ссылок (политика cookie, уведомления GDPR, отказы от ответственности, лицензии), часто нужных финансам, юристам, медицине и другим регулируемым отраслям. Совет: не угадывайте юридические требования своей отрасли, проверьте их у юриста или по актуальным отраслевым рекомендациям.
Призывы к действию в подвале, которые конвертируют
CTA в подвале — важная часть эффективного сайта. Создайте надёжную основу, затем регулярно проверяйте результат и постепенно улучшайте его. Команды, которые выделяют для этого время, отслеживают показатели и вносят небольшие изменения, получают лучшие результаты, чем те, кто работает от случая к случаю. Успех сильнее всего связан с наличием документированного процесса, а не с его сложностью. Если для проверки CTA нужен новый сайт, посадочная страница или приложение, We.Inc создаст рабочую страницу по описанию в чате, которую можно редактировать в браузере.
Дизайн подвала для мобильных устройств
Мобильная версия подвала — важная часть целостного сайта. Проверьте основные элементы и планомерно улучшайте их:
- Проверяйте сайт на настоящих устройствах, а не только в эмуляторе: поведение может значительно различаться.
- Старайтесь загружать мобильные страницы быстрее чем за 3 секунды; каждая дополнительная секунда заметно повышает отказы.
- Проектируйте для касания: крупные области, удобная навигация смахиванием, минимум текстового ввода.
- Сжимайте изображения в WebP и включайте отложенную загрузку элементов ниже первого экрана.
- Ежемесячно проверяйте Core Web Vitals и системно исправляйте CLS, LCP и INP.
Создавать мобильный подвал проще, если сам сайт не становится узким местом. В We.Inc опишите страницу или приложение словами, а затем доработайте кликами в визуальном редакторе или во встроенном редакторе кода.
Подвал на компьютере и мобильном устройстве
| Элемент | Компьютер | Мобильное устройство | Проверка клавиатурой |
|---|---|---|---|
| Контакты | Адрес, телефон и почта в одной колонке | Сначала телефон со ссылкой для звонка | Каждая ссылка доступна Tab, фокус виден |
| Часы работы | Краткая таблица | Сначала часы на сегодня, ниже вся неделя | Обычный текст, не изображение |
| Основные услуги | 4–6 ссылок | Свернуты или оставлены 3 главные | Ссылки в логичном порядке |
| Правила и политика | Небольшая строка внизу | Та же строка с более крупными областями нажатия | Не скрыты при наведении |
| Соцсети | Ряд значков | Значки с текстовыми подписями для скринридера | У значков есть доступные имена |
Примеры с комментариями (иллюстративные)
| Пример | Что в подвале | Что адаптировать | Ограничение |
|---|---|---|---|
| Пекарня | Адрес, часы, заказ, соцсети | Текстовые часы, повторная ссылка на заказ | Длинная таблица часов тесна на телефоне |
| Сантехник | Телефон, зона обслуживания, лицензия | На телефоне сначала звонок | Список зон может стать слишком длинным |
| Стоматолог | Адрес, карта, срочный номер | Отдельный срочный контакт | Много логотипов страховых компаний создают шум |
| Юридическая фирма | Офисы, практики, оговорка | Обязательный текст оговорки | Юридический текст может вытеснить контакты |
| НКО | Пожертвования, регистрация, отчёты | Видимый регистрационный номер | Конкурирующие CTA |
Блоки подвала, которые можно скопировать
Скопируйте в заметки и заполните:
Контакты: [название компании], [улица, город], [ссылка на телефон], [почта] Часы: пн–пт [время], сб [время], вс закрыто Услуги: [услуга 1], [услуга 2], [услуга 3] Правовая информация: Конфиденциальность, Условия, Доступность, © [год] [название компании]
Что адаптировать и что не копировать
Адаптируйте группировку и порядок. Не копируйте значки, награды, число отзывов или юридические формулировки другого сайта. Используйте только то, что соответствует вашему бизнесу, а собственные правила отдайте на проверку.
Начните с подходящего шаблона
Выберите дизайн в разделе шаблонов сайтов для бизнеса, измените подвал в визуальном редакторе и проверьте его бесплатным оценщиком сайта.
Начните создавать сайт для бизнеса. Создайте аккаунт. Бесплатный план позволяет опубликовать до 3 сайтов на шаблонах по адресу we.inc (без кредитов ИИ и собственного домена). Создание с ИИ и собственный домен доступны на Starter за $20 в месяц; подробности — в тарифах.
Полезные шаги: проверьте существующий сайт бесплатным оценщиком сайта, рассчитайте бюджет в калькуляторе стоимости сайта, посмотрите шаблоны сайтов для бизнеса или прочитайте о конструкторе We.Inc.
Как выбрать
Подбирайте вариант под реальные потребности сайта, а не только по впечатлению. Сайту-визитке из пяти страниц не нужен большой подвал с поиском, а маркетплейс с тысячами страниц будет выглядеть недоработанным с минимальным блоком юридических ссылок. Если сомневаетесь, начните с простого варианта (схемы 1, 4 или 9) и добавляйте разделы только по реальной необходимости.
Создайте сайт бесплатно с We.Inc
Необязательно придумывать подвал с чистого листа. Откройте We.Inc и опишите сайт одним предложением, например: «сайт местной пекарни с адресом, часами и ссылками на соцсети в подвале». Конструктор создаст рабочую основу с подвалом, которую можно доработать.
На бесплатном тарифе можно опубликовать до 3 сайтов на шаблонах по адресу we.inc без банковской карты. Текст и изображения в подвале вы меняете сами в редакторе (на бесплатном плане нет генерации ИИ). Если хотите, чтобы ИИ написал и изменил текст подвала, а сайт работал на собственном домене, это доступно на Starter за $20/month. Актуальные сведения — на странице тарифов; можно начать с бесплатного конструктора сайтов без карты или выбрать готовый дизайн в шаблонах.
Как начать дизайн подвала сайта
Примеры удачных подвалов сайта доступны каждому бизнесу, готовому последовательно работать. Выберите один раздел, внедрите его и оцените результат, прежде чем двигаться дальше. Постепенный проверенный прогресс эффективнее попытки сделать всё сразу. Если для сайта, магазина или приложения нужна основа, We.Inc создаёт её по описанию в чате: ИИ готовит работающий сайт, который можно менять визуально или в коде и публиковать на собственном домене с бесплатным SSL. Создайте бесплатный аккаунт We.Inc — карта не нужна.
Быстрый список проверки подвала
Перед публикацией проверьте:
- [ ] В строке авторских прав указан текущий год.
- [ ] Ссылки на политику конфиденциальности и условия работают и актуальны.
- [ ] Контакты доступны одним нажатием, а не спрятаны.
- [ ] Ссылки собраны в разделы с заголовками, а не в один длинный список.
- [ ] На телефоне блоки складываются и остаются удобными для касания.
- [ ] Значки, награды и сертификаты реальные и актуальные.
- [ ] Ссылки на соцсети ведут на активные аккаунты.
Для решений над подвалом см. руководство как спроектировать главную страницу. Практические настройки формы для сбора заявок описаны в руководстве по контактным формам. Для заявления о доступности можно воспользоваться генератором заявления, а полное руководство по созданию сайта охватывает остальные разделы.
Начать бесплатно · Банковская карта не нужна
Product
- AI Website Builder: Describe a site in plain English; it's live in minutes
- White Label Platform: Your brand, your domain, your margin
- Enterprise: SSO, custom SLAs, and dedicated support
- Developer API: Embed site generation into your SaaS
Who It's For
- For Agencies: Resell under your brand
- For Freelancers: Your own branded builder
- For Hosting Providers: Add a builder to your stack
- For SaaS Platforms: Embed site creation via API
- For Startups
- For Financial Services
- For Healthcare
Features
- Drag & Drop Editor
- Built-in SEO Tools
- Custom Branding
- Client Dashboard
- Reseller Billing (Stripe Connect)
Resources
- Blog
- Help Center
- Free Business Tools
- Website Templates
- Glossary & Guides
- Integrations
- Developers
- Benchmark
- Windows App