Банер на головній BBA — як зробити підписи читабельними

Проблема: підпис і назви апаратів білі, а частина банерів світла (Virtue RF, Vivace RF, LinearZ, Cellec V) — текст зникає. Технічно причина одна: на десктопі під текстом немає жодної підкладки (bg-transparent), а на мобільних градієнт дуже слабкий (чорний 30% під кутом 8°). Нижче — 5 варіантів рішення на тих самих банерах. Кожен правиться в одному компоненті банера, банери перезнімати не треба.

ЗАРАЗ

Як є

Білий текст просто лежить на фото. На темних банерах читається, на світлих — ні.

Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
ВАРІАНТ 1 · РЕКОМЕНДУЮ

Затемнення знизу (градієнт)

Під нижньою третиною кожного банера — плавне затемнення від прозорого до 78% чорного. Фото зверху лишається чистим, текст завжди на темному. Це стандартне рішення для банерів із текстом; візуально нічого не «додається».

нічого не змінює в композиції, працює з будь-яким майбутнім банеромодна правка CSS, ~0,5 годниз банера трохи темніший — частина фото приглушується
Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
ВАРІАНТ 2

Тінь під текстом, без затемнення

Фото не чіпаємо взагалі — тільки м'яке темне сяйво навколо самих літер. Найделікатніше рішення, але на дуже світлих банерах (LinearZ, Cellec V) читабельність лишається середньою.

фото повністю збережене, найменше втручаннянайшвидше, ~0,3 годна білому фоні текст усе одно «м'який», не 100% контраст
Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
ВАРІАНТ 3

Скляна плашка під підписом

Підпис лягає на напівпрозору розмиту «шибку». Виглядає сучасно й дорого, читається завжди — але це вже помітний елемент дизайну, а не невидима підкладка.

100% читабельність на будь-якому фотопреміальний вигляд, підходить під естетику брендудодає UI-елемент поверх фото; на старих Android розмиття може не працювати (є запасний варіант — просто напівпрозорий фон)
Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
ВАРІАНТ 4

Суцільна темна смуга внизу

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

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

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
ВАРІАНТ 5

Колір тексту під банер: світлий банер — темний текст

Для кожного банера в адмінці вмикається перемикач «світлий / темний». На світлих банерах текст стає графітовим, а підкладка — світлою; на темних усе лишається як зараз. Найакуратніше візуально, але вимагає поля в адмінці і ручного вибору для кожного банера.

фото не темніє, дизайн кожного банера виглядає «рідним»потрібне нове поле в CMS + менеджер має щоразу обрати правильний режимнайдорожчий варіант: правка фронту + адмінки
Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
БЛЮР

Розмиття фото під підписом

Ідея: не додавати плашку, а трохи розмити саме фото там, де лежить білий текст. Нижче чотири варіанти сили ефекту, на десктопі й на мобільних однаково.

ВАРІАНТ 6А

Тільки блюр, без затемнення

Розмивається саме фото під підписом, нічого не темніє. На темних банерах стає акуратніше, але на світлих проблема лишається: розмите біле — це те саме біле, контрасту блюр сам по собі не додає. Видно на Virtue RF, LinearZ і Cellec V.

на світлих банерах не вирішує проблему
Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
ВАРІАНТ 6Б · РЕКОМЕНДУЮ З БЛЮРІВ

Блюр + легке затемнення 26%

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

читається на всіх банерах, включно з білимим'якше за суцільне затемнення, фото не «важчає»
Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
ВАРІАНТ 6В

Блюр + помітне затемнення 45%

Те саме, але темніше. Контраст максимальний, читається впевнено навіть на дрібному тексті телефону.

найнадійніше з блюр-варіантівниз банера відчутно темніший
Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
ВАРІАНТ 6Г

Блюр локально, лише під самим підписом

Розмивається не вся нижня смуга, а тільки прямокутник під текстом. Фото зачіпається мінімально, але поява прямокутників робить це схожим на кнопки.

найменша площа втручання у фотопрямокутники читаються як окремі UI-елементи
Детальніше
про продукт

Density

Апарат для RF-омолодження DENSITY. Записатись на презентацію тел. +380673107909

EdgeOne
Virtue RF
Vivace RF
LinearZ
Sunny RF
PlaDuo
Cellec V
МОБІЛЬНА ВЕРСІЯ

Ті самі варіанти на телефоні

На мобільних банери йдуть списком, назва — зліва на фото. Зараз під нею є ледь помітне затемнення (30% під кутом), тому «Vivace RF» на рожевому і «Cellec V» на блакитному майже зникають.

Зараз — слабкий градієнт
DensityАпарат для RF-омолодження DENSITY. Записатись на презентацію
Virtue RF
Vivace RF
LinearZ
Cellec V
Варіант 1 — затемнення знизу
DensityАпарат для RF-омолодження DENSITY. Записатись на презентацію
Virtue RF
Vivace RF
LinearZ
Cellec V
Блюр + легке затемнення
DensityАпарат для RF-омолодження DENSITY. Записатись на презентацію
Virtue RF
Vivace RF
LinearZ
Cellec V
Варіант 3 — скляна плашка
DensityАпарат для RF-омолодження DENSITY. Записатись на презентацію
Virtue RF
Vivace RF
LinearZ
Cellec V
Варіант 4 — темна смуга
DensityАпарат для RF-омолодження DENSITY. Записатись на презентацію
Virtue RF
Vivace RF
LinearZ
Cellec V