Фон лендинга влияет на три вещи: читаемость текста, ожидание цены посетителем и удобство чтения на солнце. Тёмный фон поднимает восприятие цены и подходит нишам с чеком выше среднего, но хуже читается на улице и людьми старше 45 лет. Светлый фон универсальнее и прощает ошибки вёрстки. Решает не мода, а контраст и содержание страницы.
Почему этот выбор вообще возникает
Заказчик смотрит примеры работ и видит два лагеря. Одни студии показывают тёмные лендинги: почти чёрный фон, крупные цифры, яркие акценты. Другие делают светлые страницы, похожие на журнальную вёрстку. Вопрос, каким сделать фон для сайта, светлым или тёмным, звучит едва ли не в каждом втором брифе.
Тёмная тема сайта ассоциируется с дорогими вещами: так оформляют презентации флагманских телефонов и автомобилей, сайты игровых студий, афиши концертов. Светлый фон воспринимается спокойнее и проще. Обе ассоциации реальны, но заявки приносит не ассоциация. Их приносит текст, который посетитель смог прочитать, и кнопка, которую он заметил.
Ниже разберу, что фон меняет на практике: читаемость, ожидание цены, поведение людей старше 45, продажи с телефона на улице. И покажу, где проходит граница, за которой тёмный лендинг начинает стоить вам заявок.
Как фон лендинга влияет на восприятие цены?
Тёмный фон поднимает ожидание цены. Одна и та же стрижка на чёрном фоне с золотым акцентом выглядит дороже, чем на белом с синей кнопкой. Эффект работает в обе стороны, и использовать его надо осознанно.
Барбершопу с ценником 2500 рублей тёмный лендинг помогает: оформление оправдывает цену выше среднего по городу. Клинингу с позиционированием "быстро и недорого" тот же приём вредит. Посетитель заранее готовится к дорогому предложению и уходит сравнивать цены, не долистав до прайса.
С экспертами то же самое. Психолог с консультацией за 2000 рублей на угольно-чёрной странице с золотыми буквами выглядит странно. А наставник с групповой программой за 150 000 рублей на простом белом фоне недобирает статуса. Фон должен совпадать с уровнем цен, иначе посетитель чувствует подвох.
Правило из практики: если ваше главное преимущество - низкая цена, тёмный фон работает против вас. Если вы продаёте дороже конкурентов и делаете это осознанно, тёмное оформление позицию поддержит.
Светлый фон: скучно, зато предсказуемо
Светлая страница почти никогда не становится причиной провала. Тёмный текст на белом читается привычно: так выглядят документы и большинство сайтов, которыми человек пользуется каждый день. Мозгу не нужно перестраиваться.
Минус у светлого фона один: выделиться такой страницей сложнее. Когда все конкуренты в выдаче Директа светлые, ваш лендинг сливается с ними. Тогда отстройку придётся делать оффером и первым экраном, а не цветом. Это честнее, но труднее.
Ещё светлый фон прощает ошибки. Слабый контраст, случайный серый текст, мелкий кегль на белом остаются читаемыми дольше, чем на чёрном. Для страницы, которую вы потом будете править сами без дизайнера, это весомый аргумент.
Где тёмный фон теряет читателей
Солнце и улица
Тёмный экран на ярком солнце превращается в зеркало. Человек с телефоном на улице видит отражение собственного лица вместо оффера. Для услуг, которые ищут на ходу, вроде шиномонтажа или эвакуатора, это прямая потеря денег: никто не пойдёт искать тень, чтобы прочитать ваш заголовок. Откроют следующий сайт из выдачи.
Возраст и зрение
Светлые буквы на тёмном фоне тяжелее даются людям с возрастной дальнозоркостью и астигматизмом: текст начинает светиться и расплываться. Если заметная часть ваших клиентов старше 45-50 лет, тёмная страница снижает шансы, что до кнопки вообще дочитают. Что ещё менять в дизайне под такую аудиторию, я разбирал в статье Лендинг для аудитории 55 плюс.
Длинные тексты
Заголовок и три цифры на тёмном смотрятся эффектно. Абзац из пяти строк уже утомляет: светлый текст на тёмном при долгом чтении напрягает глаза сильнее. Чем больше на странице текста, тем сильнее аргументы за светлый фон. Лендинг юриста с подробными разборами ситуаций и тёмная тема сочетаются плохо.
Как фон связан с нишей
За годы работы с лендингами у меня сложилась примерная карта: где тёмное оформление помогает, а где мешает. Это не закон, а стартовая точка, и свою аудиторию она не отменяет. Таблица ниже - выжимка из этих наблюдений.
| Ниша | Что обычно работает | Почему |
|---|---|---|
| Барбершоп, тату, детейлинг | Тёмный | Атмосфера мастерской, молодая аудитория, мало текста |
| Стоматология, медицина | Светлый | Ассоциация с чистотой, есть возрастные клиенты |
| Ремонт квартир, стройка | Светлый | Фото интерьеров, длинные описания этапов |
| Онлайн-школы, вебинары | Светлый с тёмными блоками | Длинная страница, много текста |
| Игровые и IT-продукты | Тёмный | Аудитория привыкла к тёмным интерфейсам |
| Юристы, финансы | Светлый | Документы и подробности читаются на белом легче |
Отдельная история - фотографии. Интерьеры после ремонта и светлые кухни выигрывают на светлой подложке. Машины после детейлинга и неоновая подсветка - на тёмной. Посмотрите на свои реальные снимки до выбора фона, а не после: фон должен работать на них, а не спорить с ними.
Контраст решает больше, чем цвет фона
Провальные лендинги, которые я видел, страдали не от тёмного или светлого фона. Они страдали от слабого контраста: серый текст на белом, тёмно-серый на чёрном, надписи поверх фотографии без подложки. Цвет фона тут ни при чём.
Ориентир: контраст основного текста к фону не ниже 4,5 к 1. Проверка занимает минуту в бесплатных инструментах, как именно, описано в статье Как проверить цвета лендинга за пять минут. На тёмном фоне попасть в норму сложнее. Чистый белый на чистом чёрном слепит, а приглушённый серый уже плохо читается. Рабочий коридор узкий, и без проверки в него попадают редко.
Фон ничего не продаёт. Продаёт оффер, который посетитель смог прочитать. Хороший фон - тот, который этому не мешает.
Тёмные блоки на светлой странице
В большинстве проектов я делаю не выбор "или-или", а комбинацию: светлая страница и два-три тёмных блока. Тёмным выделяю цену и финальный призыв - блоки, где мало текста и много смысла.
Такая схема забирает лучшее у обоих вариантов. Длинные описания остаются на белом и нормально читаются, а тёмные вставки задают ритм и останавливают взгляд там, где это выгодно. Когда уместна полностью тёмная страница, а когда хватит вставок, разобрано в статье Тёмная тема на лендинге.
Как проверить, какой фон подойдёт вашей аудитории?
Спор о вкусах решается цифрами. Если трафик уже идёт, соберите вторую версию страницы с другим фоном, разделите посетителей пополам и сравните конверсию в заявку по целям Метрики. По моему опыту, на вариант нужно хотя бы 300-500 визитов: раньше разница неотличима от случайности.
Если теста нет, есть проверка за один день. Откройте лендинг на телефоне на улице в солнечный день. Дайте прочитать первый экран трём-пяти людям из целевой аудитории, а не знакомому дизайнеру. Спросите, что здесь предлагают и сколько это стоит. Если человек щурится или подносит телефон к лицу, ответ на вопрос о фоне вы уже получили.
После запуска смотрите Вебвизор. Если посетители с мобильных уходят в первые секунды днём, а вечером досматривают страницу до конца, это косвенный признак, что днём тёмный экран на улице не читается.
Частые ошибки тёмных лендингов
- Чистый чёрный плюс чистый белый. Максимальный контраст слепит, буквы двоятся. Мягче работает очень тёмный серый фон и чуть приглушённый белый текст.
- Тонкие шрифты. Светлые тонкие буквы на тёмном визуально худеют ещё сильнее и разваливаются на мелких размерах.
- Серые подписи. Второстепенный текст, который на белом был просто бледным, на чёрном пропадает совсем.
- Поля формы в цвет фона. Тёмное поле ввода на тёмной странице посетитель не находит. Поля лучше оставить светлыми даже в тёмном дизайне.
- Фото с тёмными краями. Снимок сливается с фоном, и блок выглядит дырой в макете.
Частые вопросы
Можно ли на одном лендинге совместить светлый и тёмный фон?
Да, и это самый частый рабочий вариант. Светлая страница с двумя-тремя тёмными блоками под цену и финальный призыв берёт лучшее от обеих схем: длинные описания читаются легко, а тёмные вставки задают ритм. Полностью тёмная страница нужна реже, обычно когда премиальность зашита в позиционирование целиком.
Сколько стоит перекрасить готовый лендинг из тёмного в светлый?
Технически это не переделка структуры, а смена цветов фона, текста и кнопок в файле стилей. Разметка блоков и тексты остаются прежними. В моей практике такая перекраска занимает от нескольких часов до одного дня, в отличие от изменения структуры или офферов.
Что делать, если аудитория лендинга смешанная по возрасту?
Ориентируйтесь на менее удобный сценарий чтения. Если хотя бы четверть посетителей старше 45-50 лет, тёмный фон целиком рискованнее, чем светлый с тёмными акцентными блоками. Молодой части аудитории такая страница читается так же легко.
Влияет ли фон лендинга на позиции в поиске?
Напрямую нет, поисковик цвет фона не ранжирует. Косвенно влияет через поведенческие факторы: если посетители уходят через пару секунд, потому что не смогли прочитать текст на солнце или из-за низкого контраста, это сказывается на метриках вовлечённости, а не на самом факте тёмного оформления.
Коротко
Светлый фон - вариант по умолчанию. Он легче читается, прощает ошибки, дружит с длинными текстами и возрастной аудиторией. Тёмный - инструмент под конкретную задачу: поднять ожидание цены и отстроиться в нише, где все конкуренты светлые.
Сомневаетесь - начните со светлой страницы с тёмными акцентными блоками, это решение почти не бывает ошибкой. А спор о том, что сработает лучше именно у вас, решайте не голосованием в чате, а тестом на живом трафике.
