Требования к шапкам лендингов и баннерам на главной hse.ru

Простой вариант

Состоит из текста и фонового изображения. Фон должен быть таким, чтобы на нем хорошо читался текст белого цвета. На фоне не должно быть значимых элементов, которые нельзя обрезать или пересекать текстом. Фоновое изображение должно быть горизонтально ориентированным, ширина – 1600px. Картинка обязательно должна быть оптимизирована: https://portal.hse.ru/photo

Сложный вариант – используется, когда у проекта есть свой фирстиль

Баннер/шапка представляет из себя композицию из 3 (или меньше) основных элементов:

1. Фон (пример: заливка цветом, паттерн).

2. Текстовый блок (пример: заголовок, название мероприятия, кнопка).

3. Графический элемент (пример: логотип, рисунок, фото).

Для верстки сложного варианта следует прислать команде портала макет в Figma, чтобы отдельные элементы лежали на разных слоях изображения и мы могли их использовать отдельно друг от друга.

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

  • Необходимо прислать именно адаптации одной картинки, а не три по-разному нарисованных изображения: мы верстаем одну адаптивную шапку, а не три отдельных для каждого экрана.

3 варианта ширины (все варианты указываются в макете):

1. 375px для мобильных устройств;

2. 800px для планшетов;

3. 1600px для пк и ноутбуков.

Высота баннера на главной странице портала: 776px; 180px сверху и 80px снизу — служебные поля, в которых может быть размещен только фон.

Высота шапки в лендинге: 490px; 45px сверху и 50px снизу — служебные поля, в которых может быть размещен только фон.