Лайфхакер
Лайфхакер
Лучшее
Новости
Жизнь
Рецепты
Здоровье
Кино
Технологии
Покупки
Лучшее
Новости
Жизнь
Рецепты
Здоровье
Кино
Технологии
Покупки
Куда поехать на выходные
Великая китайская распродажа
Добрые новости
Стыдные вопросы
Есть мнение
Норм или стрём
Личный опыт
Объясняем за минуту
Советы
6 августа 2015

Накладываем текст на изображение правильно: полезные советы популярного фотостока

Depositphotos приготовил несколько приёмов для того, чтобы вы усилили с помощью фотографии ваши визуальные истории. Презентации? Рекламные баннеры? Представление большого количества данных на одном слайде? Нет ничего проще с этими рекомендациями.
Фото автора Лиля Леднёва
Лиля Леднёва

Накладываем текст на изображение правильно: полезные советы популярного фотостока

Фотография в качестве подложки под текст используется не только в веб-дизайне. Этот приём популярен как в оформительском дизайне, так и среди медиа. Оглянитесь вокруг: текст поверх изображения придаёт сообщению выразительность и способен стать эмоциональным крючком для потребителя.

🥰 Опрос для дорогих читателей! Помогите нам стать лучше и поделитесь, что вы хотели бы изменить. В конце — бонус от наших иллюстраторов.

Фотография в паре с текстом призвана рассказать целую историю, а не просто выступить в качестве декорации. Поэтому работа с изображением зачастую сложнее, чем просто затемнение или добавление прозрачности. Ключевая задача — соединение ритмического рисунка текста и графического рисунка фотографии.

Как это сделать? В Сети вы найдёте множество примеров и обсуждений того, как усилить воздействие текста при помощи фотографии. Ниже собраны самые интересные приёмы пользователей.

Текст, вписанный в пространство фотографии

Накладываем текст на изображение правильно
laurawall-design.com

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

Текст как часть изображения

Накладываем текст на изображение правильно
gogoro.com

Детали мопеда используются как основание для размещения текста. Тонкие и яркие линии букв переходят в очертания предметов. Отсутствие визуального шума обеспечивают фокусные точки — чёрные крышки приборных панелей.

Текст, размещённый на прямоугольнике или другой фигуре для улучшения читабельности

Накладываем текст на изображение правильно
daucybio.fr

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

Прозрачный текст, через который видно фоновое изображение

Накладываем текст на изображение правильно
carladasso.com

Белый текст на чёрном или зелёном фоне может выглядеть достаточно грубо. Сделайте текст чуть бледнее, для того чтобы текстура предметов на изображении могла проступать через буквы и тем самым работать на смягчение графичности шрифта.

Уменьшение яркости фотографии для выделения текста

Накладываем текст на изображение правильно
onepagelove.com

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

Использование минималистичной фотографии для эффектной расстановки акцентов

Накладываем текст на изображение правильно
dribbble.com

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

Вспомогательные элементы для фокусирования внимания на тексте и отделения его от фоновой фотографии

Накладываем текст на изображение правильно
aquatilis.tv

Вы можете не просто сделать фотографию под текстом бледной, а усилить этот приём жирным начертанием шрифта и использованием рамок. Главное, чтобы фотография вторила сообщению, которое вы хотите донести до читателя.

«Параллакс» текста и фотографии

Накладываем текст на изображение правильно
soyuzcoffee.com

Один из самых противоречивых приёмов из-за своей сложности. Помните о том, что человеческий взгляд (в западной традиции) стремится двигаться по слайду слева направо, а также быстро схватывает самые яркие цветовые акценты на плоскости.

Построение композиции таким образом, чтобы её элементом выступил не только текст, но и детали фотографии

Накладываем текст на изображение правильно
gnosh.co.uk

Фоновое изображение предлагает разные возможности для экспериментов со шрифтами. Поворачивайте буквы под таким углом, чтобы следовать вектору размещения предметов, и используйте свободное пространство для создания нужного вам сообщения.

Особенно хорошо смотрится использование контрастного шрифта по отношению к фотографии, при этом текст вписан в пространство изображения.

pinterest.com
pinterest.com

Главное в совмещении фотографии и текста — простота.

По возможности не усложняйте ритмические соединения и помните, что чем легче считываются визуальные истории, тем лучше.

Если нашли ошибку, выделите текст и нажмите Ctrl + Enter
Это интересно
3 места в доме, которые часто захламляются 

3 места в доме, которые часто захламляются 

Зачем проходить диспансеризацию и оплатит ли её работодатель

Зачем проходить диспансеризацию и оплатит ли её работодатель

Как начать заниматься спортом, если вы живёте в небольшом городе: 5 простых и доступных способов

Как начать заниматься спортом, если вы живёте в небольшом городе: 5 простых и доступных способов

6 технологий, без которых невозможно представить современную систему переработки отходов

6 технологий, без которых невозможно представить современную систему переработки отходов

Комментарии
Виталий Назарук
06.08.15 19:50
Какие лучшие программы для таких целей вы можете посоветовать?
Олександр Євтушенко
06.08.15 20:58
угадай с первого раза)
Андрей Гриценко
06.08.15 21:57
Ай красавцы, как долго искал такую статью. Виталий, Adobe Photoshop и Adobe Illustrator (для векторной и растровой графики)
Виталий Назарук
06.08.15 23:30
Эт я знаю. Но я думаю, что есть спец. варианты. В Adobe сложновато разобраться.
Andre Ibragimov
07.08.15 08:12
canva
Владимир Ткаченко
07.08.15 08:17
сложно? Есть программы и попроще, в основном рассчитанные на добавление шаблонных текстов с такими же шаблонными стилями, используются они для редактирования фоточек для вконтактика. Если преследуешь те же цели - вперед, доставай телефон, в маркете такого сабжа полно. Ну а если хочешь нарисовать что-то сам, ставь Photoshop, Illustrator, учи мат-часть и вперед, гляди попробуешь, а это твое :)
Anton Geer
07.08.15 20:25
Еще неплохой прием, к которому сам неоднократно прибегал - блюр изображения. Допустимо в том случае, когда изображение не играет первостепенной роли. Хорошо работает, когда на изображении много деталей или необходим тонкий шрифт. Читаемость возрастает на глазах. Главное - не переборщить с блюром, чтобы зритель мог однозначно ответить, что изображено на фоне.
Златоуст Артемий
13.08.15 13:16
Просто и гениально! Спасибо Лайфхакеры!))
Что вы могли пропустить
Как сделать съёмную квартиру уютнее
Как сделать съёмную квартиру уютнее
0
18 июля
Советы
Советы
Как стирать постельное бельё, чтобы оно хрустело как в отеле
Как стирать постельное бельё, чтобы оно хрустело как в отеле
14 июля
«Горящая изба»
Советы
Чем смазать дверь, чтобы она не скрипела
Чем смазать дверь, чтобы она не скрипела
0
11 июля
Ликбез
Советы
Плачу на ретро: Collider выбрал 10 культовых фильмов 80‑х, о которых все забыли
Плачу на ретро: Collider выбрал 10 культовых фильмов 80‑х, о которых все забыли
0
24 июня
Кино
Новости
Что надо знать про ортопедическую подушку, чтобы спать сном младенца
Что надо знать про ортопедическую подушку, чтобы спать сном младенца
24 июня
«Горящая изба»
Советы
15 насекомых, которые живут с нами дома
15 насекомых, которые живут с нами дома
0
22 июня
Ликбез
Советы
Как избавиться от чешуйницы в квартире
Как избавиться от чешуйницы в квартире
0
11 июня
Ликбез
Советы
Какого специалиста вызвать, если в доме что-то сломалось
Какого специалиста вызвать, если в доме что-то сломалось
0
7 июня
Советы
Советы
15 бытовых устройств, которые выгоднее взять в аренду или купить совместно с друзьями 
15 бытовых устройств, которые выгоднее взять в аренду или купить совместно с друзьями 
0
26 мая
Советы
Советы
Как правильно мыть аэрогриль
Как правильно мыть аэрогриль
0
9 мая
Ликбез
Советы
Классные способы отстирать шторы в стиральной машине и не испортить их
Классные способы отстирать шторы в стиральной машине и не испортить их
8 мая
«Горящая изба»
Советы
Я проверила 6 популярных лайфхаков с мицеллярной водой, и вот что работает на самом деле
Я проверила 6 популярных лайфхаков с мицеллярной водой, и вот что работает на самом деле
0
6 мая
Советы
Советы
Как сдерживать беспорядок в доме с помощью метода пяти вещей
Как сдерживать беспорядок в доме с помощью метода пяти вещей
0
25 апреля
Советы
Советы
7 бытовых вещей, которые стоит убрать подальше от детей и животных
7 бытовых вещей, которые стоит убрать подальше от детей и животных
0
20 апреля
Советы
Советы
Как выбрать моющий пылесос для небольшой квартиры: характеристики, на которые реально стоит смотреть
Как выбрать моющий пылесос для небольшой квартиры: характеристики, на которые реально стоит смотреть
17 апреля
«Горящая изба»
Советы

Новые комментарии

Аватар автора комментария
Илья Новак22 минуты назад

0 / 0

Писькой жопу вытираешь или зубы чистишь ,обмылок.
50 лучших фильмов всех времён по версии IMDb
Аватар автора комментария
solowolf3 часа назад

0 / 0

Я раньше для обработки всё в фотошопе делал, но сейчас для простых вещей уже проще нейросетью. Особенно когда надо убрать какой-нибудь объект, фон поменять или качество старого фото подтянуть. Из онлайн-вариантов ещё пробовал нейросеть для обработки изображений https://ranvik.ru/image, иногда получается очень даже неплохо. А вы чем обычно пользуетесь?
11 крутых нейросетей для обработки фото
Аватар автора комментария
Dreamer3 часа назад

0 / 0

Всё нормально получилось! Спасибо
8 способов сделать так, чтобы LED-индикаторы бытовой техники не бесили
Аватар автора комментария
solowolf3 часа назад

0 / 0

Я пробовал оживлять старые фотографии, и лучше всего результат получается, когда фото более-менее чёткое и лицо хорошо видно. Ещё заметил, что разные сервисы сильно отличаются по результату. Для экспериментов можно попробовать нейросеть для создания изображений https://ranvik.ru/image, там тоже интересно поиграться с фотографиями и посмотреть, что получится.
Как оживить старое фото бесплатно: самый простой способ
Поваренная книга донора. 15 простых и полезных рецептов, которые поддержат организм до и после сдачи крови

Поваренная книга донора. 15 простых и полезных рецептов, которые поддержат организм до и после сдачи крови

Лайфхакер
Информация
О проектеРубрикиРекламаРедакцияВакансииО компании
Подписка
TelegramВКонтактеTwitter (X)PinterestYouTubeИнициалRSS
Правила
Пользовательское соглашениеПолитика обработки персональных данныхПравила применения рекомендательных технологийПравила сообществаСогласие на обработку персональных данныхСогласие для рекламных рассылокСогласие для информационной программы
18+Копирование материалов запрещено.
Издание может получать комиссию от покупки товаров, представленных в публикациях