Шапка (хедер) официального сайта органов местного самоуправления — это не просто «лицо» ресурса, а важный инструмент взаимодействия власти и граждан. Она должна быть строго аккуратной, легко читаемой и максимально информативной уже в первые три секунды визита. Ниже — подробная инструкция, как создать шапку для сайта администрации, исходя из федеральных рекомендаций, лучших практик и примеров.

Что обязательно должно быть в шапке муниципального сайта

1. Федеральный герб РФ или официальный герб муниципалитета (в формате SVG или PNG высокого разрешения).
2. Полное официальное название органа власти: «Администрация городского округа …» без сокращений.
3. Контактный телефон «горячей линии» в международном формате +7 (XXX) XXX-XX-XX.
4. Кнопка «Обратная связь» / «Приёмная граждан» — прямой переход к форме электронного обращения.
5. Выбор языка (русский + региональные языки, если предусмотрено законом субъекта).
6. Ссылка на версию для слабовидящих (иконка «A+ A-»).
7. Кнопка входа в персональный кабинет для жителей (оплата ЖКХ, запись к врачу, подача заявлений).
8. Короткое горизонтальное меню первого уровня: «Новости», «Документы», «Услуги», «Обращения граждан».

Типовая структура шапки

Минималистичный вариант (один ряд)

Подходит для городов до 100 тыс. жителей.

+-----------------------------------------------------------------------+
| [Герб] Администрация городского округа Н-ск +7 (XXX) XXX-XX-XX |Версия для слабовидящих| Обратная связь |
+-----------------------------------------------------------------------+
| Новости | Документы | Услуги | Обращения граждан | Личный кабинет |
+-----------------------------------------------------------------------+

Двухрядный вариант (для мегаполисов)

При большом количестве разделов удобно разделить шапку на две строки:

• Верхний ряд: герб, название, телефон, почта, выбор города, версия для слабовидящих.
• Нижний ряд: основное меню и кнопка «Приёмная граждан» ярко выделена цветом.

Дизайн: цвета, шрифт, адаптивность

Раздел «Контактная информация» в шапке

Обязательные данные

• Телефон «горячей линии» (единый справочный).
• Электронная почта для общих обращений: info@gorodXX.ru.
• Физический адрес приёмной главы: ул. Ленина, д. 1, каб. 101.
• График работы: пн–пт 8:00–17:00, перерыв 12:00–13:00.
• Кнопка «Схема проезда» (карта 2ГИС/Яндекс).

Форма быстрого обращения (pop-up)

Кнопка «Написать обращение» открывает модальное окно:

1. Выпадающий список тем: «Личный приём», «Жалоба», «Предложение», «Заявление».
2. Поле ФИО с автоматической подстановкой из личного кабинета.
3. Загрузка файлов до 5 МБ (сканы, фото).
4. Отметка о согласии на обработку ПД.
5. Кнопка «Отправить», после чего пользователь получает номер заявления и срок рассмотрения (10 дней).

Доступность (WCAG 2.1)

• Контрастность текста ≥ 4.5:1.
• Возможность увеличения шрифта до 200 % без потери функционала.
• Клавиатурная навигация по Tab.
• Альтернативный текст к гербу: «Герб городского округа Н-ск».

<header>
 <div class="top-bar">
 <img src="gerb.svg" alt="Герб городского округа Н-ск" width="70" height="80">
 <h1>Администрация городского округа Н-ск</h1>
 <span class="phone">+7 (XXX) XXX-XX-XX</span>
 <a href="/appeals" class="btn-feedback">Обратная связь</a>
 <a href="/accessibility" class="a11y">Версия для слабовидящих</a>
 </div>
 <nav class="main-menu">
 <ul>
 <li><a href="/news">Новости</a></li>
 <li><a href="/docs">Документы</a></li>
 <li><a href="/services">Услуги</a></li>
 <li><a href="/appeals">Обращения граждан</a></li>
 <li><a href="/lk">Личный кабинет</a></li>
 </ul>
 </nav>
</header>

Чек-лист перед публикацией

1. Логотип не искажается на Retina-дисплеях.
2. Все ссылки в шапке открываються ≤ 1 секунды (PageSpeed Insights ≥ 90).
3. На мобильном устройстве кнопка «Обратная связь» видна без прокрутки.
4. В шапке нет рекламных баннеров и сторонних виджетов.
5. Наличие микроразметки Schema.org для организации (телефон, адрес).

Грамотно оформленная шапка сайта администрации — это визитная карточка, которая:

• сразу показывает, что посетитель попал на официальный ресурс;
• даёт главную «точку входа» для обращений граждан;
• обеспечивает доступность и удобство на любом устройстве.

Следуйте приведённым рекомендациям, и ваш муниципальный сайт будет соответствовать всем современным стандартам открытости, безопасности и дизайна.