Рекомендации по оформлению Турбо-страниц

Чтобы сделать Турбо-страницы привлекательнее и увеличить конверсию, обратите внимание на наши советы по оформлению.

  1. Логотип с горизонтальной ориентацией
  2. Контраст между текстом и фоном
  3. Качественные изображения
  4. Кнопка на главном экране
  5. Разделение текста на смысловые блоки
  6. Ритмичная композиция
  7. Равномерные отступы
  8. Адаптивность страниц
  9. Текст не мешает восприятию изображения
  10. Минимум текста по центру
  11. Выравнивание элементов по центру
  12. Минимум цветовых акцентов

Контраст между текстом и фоном

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

Качественные изображения

Используйте изображения высокого качества: четкие, без артефактов сжатия, защитных слоев и т. д.

Кнопка на главном экране

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

Разделение текста на смысловые блоки

Информацию проще воспринимать, если она разделена на блоки по смыслу. Не бойтесь использовать отступы, чтобы визуально отделить блоки друг от друга. Хорошим приемом станет и дополнительный, но не очень яркий цвет фона.

Ритмичная композиция

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

Равномерные отступы

Используйте большие отступы одинакового размера. Это добавит больше белого пространства между смысловыми блоками — так информация будет восприниматься легче.

Адаптивность страниц

Если вы в первую очередь делаете мобильную версию Турбо-страницы, рекомендуем все же проверять, как выглядит десктопная версия. Важно проверить версии страницы для всех устройств, чтобы расположение всех элементов вас устраивало.

Текст не мешает восприятию изображения

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

Минимум текста по центру

Располагайте текст по центру только в том случае, если его немного, иначе информацию будет тяжело и скучно воспринимать.

Выравнивание элементов по центру

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

Минимум цветовых акцентов

Большое количество цветовых акцентов создает путаницу на странице: непонятно, что важнее. Достаточно использовать 1−2 цвета, чтобы выделить важные элементы.