Баннеры и иконки для сайта клиники - адаптивный дизайн

В рамках развития действующего сайта клиники подготовил и внедрил единую систему визуального оформления внутренних страниц.

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

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

Создал и подключил 10 тематических иконок. Четыре монохромные иконки добавлены в каталог услуг: эндоскопия, бариатрия, оториноларингология и колопроктология. Для страницы «КТ и рентген» разработал отдельную серию из шести цветных медицинских иконок: головной мозг, лёгкие, позвоночник, суставы, брюшная полость и пазухи носа. Сохранил единый стиль, толщину линий и цветовую палитру.

Также обновил баннеры разделов «Услуги» и «О клинике». Настроил композицию, фон, положение текста и адаптацию под разные экраны.

Технологии: 1С-Битрикс, HTML5, CSS3, адаптивная вёрстка, WebP, PNG, обработка изображений, UI-дизайн, Photoshop, ChatGPT, Claude

Результат - разрозненные изображения и серые заглушки заменены на цельную визуальную систему, связанную с содержанием страниц и корректно работающую на компьютерах и смартфонах.