Лайфхакер
Лайфхакер
Лучшее
Новости
Жизнь
Рецепты
Здоровье
Кино
Технологии
Покупки
Лучшее
Новости
Жизнь
Рецепты
Здоровье
Кино
Технологии
Покупки
Нарисуйте с нами книгу
Добрые новости
Стыдные вопросы
Есть мнение
Норм или стрём
Личный опыт
Объясняем за минуту
Сервисы
Советы
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
Это интересно
7 мифов об уколах для похудения

7 мифов об уколах для похудения

Зачем ходить на квизы, если всё можно спросить у ИИ

Зачем ходить на квизы, если всё можно спросить у ИИ

6 диких вещей из эпохи медленного интернета начала 2000-х, о которых вспомнят только олды

6 диких вещей из эпохи медленного интернета начала 2000-х, о которых вспомнят только олды

Реклама
Как поддержать близкого, который бросает курить, и не испортить отношения

Как поддержать близкого, который бросает курить, и не испортить отношения

Комментарии
Виталий Назарук
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 апреля
«Горящая изба»
Советы

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

Аватар автора комментария
Иван Баров48 минут назад

0 / 0

Зачем рассказывать, как устанавливать данное шпионское ПО?
Как скачать «ВКон­такте» и другие при­ло­жения VK на Android без Google Play
Аватар автора комментария
Артём Козориз49 минут назад

0 / 0

Спасибо, что процитировали. Как видим: различий с моими трактовками из статьи, которые я взял на себя смелость изложить более человеческим языком, нет (или они незначительны).
Чем электрический кабель отличается от провода и что лучше
Аватар автора комментария
Артём Козориз58 минут назад

0 / 0

Ну, не смело, а скорее условно, и с упоминанием того, что даже для специалистов это предмет споров. Да и не в конструкции ли, уровне защиты и области применения отличия кабельных изделий заключаются? ГОСТ я привёл. Если в чём-то и допустил упрощение, то сомневаюсь, что так уж оно губительно для человека, который не знал разницы вообще, а теперь хотя бы будет иметь представление. Пожары конечно чаще из-за проводки, согласен. Но я про проектирование и не писал вообще-то. Да и обозначил в начале и в конце статьи её цель и то, что она не превращает после прочтения в опытного электрика — проект, подбор и расчёты только к квалифицированным специалистам. Про удлинители, кстати, писал. О том что не стоит в них подключать, а что можно. За комментарий и точку зрения вам любом случае спасибо.
Чем электрический кабель отличается от провода и что лучше
Аватар автора комментария
Виктор Медведев1 час назад

0 / 0

Так он ещё и чертовски красивый! Ничего лишнего в дизайне
Poco X8 Pro Max собрал почти всё, что хотят видеть в мощном Android-смартфоне
Как найти подруг во взрослом возрасте? История трёх фанаток кей-попа, которым это удалось

Как найти подруг во взрослом возрасте? История трёх фанаток кей-попа, которым это удалось

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