Главный баннер, сделанный одной картинкой, часто выглядит приемлемо только на одном размере экрана. На других разрешениях текст может плохо читаться, элементы съезжают, а менять содержание баннера становится неудобно.
Для B2B-магазина на InSales нужно было изменить шапку и сверстать баннер на главной странице как адаптивный блок, а не как статичное изображение.
Ключевые факты
| Дата задачи | 28.10.2023 |
| Платформа | InSales |
| Ниша | B2B e-commerce |
| Тип работ | адаптивная верстка шапки и главного баннера |
| Результат | первый экран стал гибким HTML-блоком вместо статичной картинки |
Задача
На главной странице баннер был сделан картинкой. Нужно было изменить шапку сайта и сверстать баннер адаптивно, чтобы он корректно выглядел на разных устройствах.
Что сделали
- Изменили структуру шапки сайта.
- Перенесли главный баннер из формата статичной картинки в адаптивную верстку.
- Разделили визуальные элементы баннера на управляемые блоки.
- Учли поведение шапки и первого экрана на разных ширинах.
Результат
Главная страница стала гибче: баннер лучше адаптируется под разные экраны, а сайт не зависит от одной большой картинки с зашитым содержанием.
Что мы сделали для клиента
Мы превратили первый экран из статичной графики в рабочий интерфейсный блок. Для магазина это значит больше контроля над подачей и более аккуратный вид на мобильных и десктопных устройствах.
