school_flashfamily

тильда гуру

часть 1

school_flashfamily

тильда гуру

Основные элементы:

Дополнительные элементы:

school_flashfamily

тильда гуру

Логотип

Должен быть загружен в svg формате, хорошо читаться и вести по клику на главную страницу

:)

school_flashfamily

тильда гуру

Контакты

Правильно написанные и кликабельные телефон, почта (при необходимости адрес)

+7 980 800 80 80

+7 (8452) 808 080

Написание ссылок:

Правильное написание номеров:

+7 980 800-80-80

+7 (8452) 808-080

school_flashfamily

тильда гуру

Меню

Пункты меню должны иметь ховер. Отступы между пунктами должны быть меньше отступов до краёв шапки

:)

school_flashfamily

тильда гуру

Соцсети

Иконки соцсетей должны быть одинакового стиля, размера и иметь ховер. По клику на иконку ссылка должна открываться в новом окне

:)

school_flashfamily

тильда гуру

Десктоп

Горизонтальный планшет

Вертикальный планшет

В зависимости от разрешения нужно оставлять важные элементы интерфейса

school_flashfamily

адаптив хедера

тильда гуру

Мобилка

В мобильной версии чаще всего навигация уходит в бургер, но кнопку целевого действия лучше расположить рядом

school_flashfamily

адаптив хедера

тильда гуру

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

school_flashfamily

адаптив хедера

тильда гуру

Кнопка

Пример реализации более сложной навигации в мобильной версии.
Для меню дополнительно используется нижняя часть экрана

school_flashfamily

бургер

тильда гуру

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

school_flashfamily

тильда гуру

https://flashfamily.ru/

https://spiritus.by/?ref=https://tilda.cc/ru/madeontilda

При наличии большого количества пунктов меню, основные нужно оставить в шапке, а второстепенные спрятать в бургер

school_flashfamily

тильда гуру

В подвале сайта обычно указывается информация, которую необходимо легко найти на любой странице, поэтому там может частично дублироваться содержание хедера. Туда же добавляется правовая и платёжная информация (политика конфиденциальности, договор оферты, знак копирайта, реквизиты)

school_flashfamily

тильда гуру

На лендинге

Чаще всего оформляется так, чтобы поместиться в один экран с последним блоком

school_flashfamily

тильда гуру

На многостраничнике

Выносится в отдельный блок, верстается по колонкам

school_flashfamily

тильда гуру

Верстается в 1 или 2 колонки в зависимости от количества пунктов

https://woodled.ru/

https://naitori.ru/

flash_family

спасибо :)

school_flashfamily

flashfamily

school.flashfamily

тильда гуру