Як оформити шапку сайту практичні поради
Почнемо з основних показників гарної шапки.
Обов'язкові елементи
З першого погляду на шапку юзер повинен розуміти, куди прийшов і що може отримати тут.
Короткий опис
Воно завжди розташоване поряд із логотипом. Це ємний текст про те, чим саме займається або чому вигідна співпраця з компанією/магазином (унікальна торгова пропозиція).
Є три варіанти: вказати його у шапці великим шрифтом, дрібнішим або взагалі прописати лише на сторінці «Контакти». Все залежить від того, звідки ви отримуєте максимум замовлень. Ці дані повинні бути обов'язково.
Години роботи
Вкажіть час, коли менеджери обробляють замовлення та уточніть, що оформити можна у будь-який час, якщо на це є місце у шапці. Якщо ви працюєте цілодобово і навіть у вихідні, підкресліть це.
Друга інформація
Зворотний дзвінок
Якщо він працює та відвідувачі користуються, залиште кнопку у шапці. Якщо запит звідси – скоріше виняток (специфіка аудиторії), можна сміливо прибирати, і на його місці вказати більш корисну інформацію чи функцію.
Кошик, Особистий кабінет
Ці пункти зазвичай розміщують над шапкою, оскільки вони є більшою мірою навігаційними, на рівні з іншими пунктами меню, які зазвичай знаходяться вище або нижче шапки.
Кнопка CTA
Заклик до дії з кнопкою – це традиційний варіант для лендінгу. Для складних товарів, магазинів великого асортименту та B2B-компаній вона не працює. Якщо на вашому сайті є заклик саме у шапці, не робіть її акцентом усієї сторінки — оформіть її більш стримано, щоб кнопка стала швидше корисною додатковою функцією.
Не для шапки
Акції та спеціальні пропозиції
Не потрібно перевантажувати шапку цим повідомленням – намалюйте гарний банер, який буде клікабельним, та розмістіть у верхній частині головної. Нехай вона буде завершеним елементом, а не частиною хаосу.
Агресивний CTA
В інтернет-магазині немає місця примітивним закликам та агресивним кольорам. Не ризикуйте так, інакше покупець вирішить, що ви у розпачі і не захочете мати з вами справу. Будьте самодостатніми, дайте клієнту вибір.
Слогани, красиві фрази, цитати та ін.
Чомусь деякі власники сайтів вважають, що цитата у шапці сайту відобразить цінності компанії та чудову натуру керівника. Як би не хотілося, краще відмовитися від зайвих слів у шапці та й на сайті взагалі.
Довгі формулювання
Якщо інформацію можна повідомити довідково, оберіть саме таку подачу. Наприклад: «Робочі дні: пн-сб з 10 до 22. Неділя — вихідний». Це зрозуміло та доступно, можна без вказівки вихідних.
Рекомендації
- Шапка не повинна займати весь перший екран, навіть якщо це зображення дуже подобається. Висота, наскільки можна, до 250 пікселів.
- Не використовуйте теги H1-H6 для тексту шапки, оскільки це може вплинути на оптимізацію.
- Якщо у вас багато текстових матеріалів та асортимент понад 10-ти товарів, у шапці сайту має бути присутнім пошук.
- Пам'ятайте, що шапка буде однаковою на всіх сторінках сайту. Слідкуйте за тим, щоб вона не контрастувала з іншими сторінками.
- Збережіть пункт меню «Головна», тому що не всі клацають по логотипу, щоб повернутися на головну.
Зразкове розташування елементів шапки може мати такий вигляд. На перший погляд, порожньо, але якщо поставити собі за мету і зайняти весь вільний простір, жоден елемент не працюватиме як треба.

Ефективна шапка сайту виглядає досить просто, несе лише корисну інформацію та не містить зайвих елементів. Спробуйте порівняти поведінку відвідувачів з урахуванням двох різних варіантів шапки, і ви зрозумієте, що лаконічність бере гору над нагромадженням інформації.