IQSites - умный конструктор сайтов
+7 (911) 11-8888-1
Звоните прямо сейчас
Социальные сети
Как сделать текст читаемым? Простые решения в Photoshop.

Как сделать текст читаемым? Простые решения в Photoshop.

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

19 августа 2016 в 11:19

Что может быть хуже сливающегося с фоном текста, который невозможно читать? Соответственно первое, о чем стоит позаботиться, это сделать текст так, что бы он на контрасте отличался от фона. Самые распространенные приемы - светлый шрифт на темном фоне и наоборот, темный шрифт на светлом. Для достижения таких эффектов достаточно открыть Photoshop и затемнить/осветлить будущий фон секции:

Как сделать текст читаемым? Простые решения в Photoshop.
Как сделать текст читаемым? Простые решения в Photoshop.

Один из наиболее простых способов сделать это - открыть нужную картинку, выбрать инструмент "Заливка" (1), создать новый слой (2), залить изображение черным цветом (или белым, если вы осветляете) и потянуть за ползунок "Непрозрачность" (3) до наиболее оптимального уровня.

Однако если вы хотите результат "посочнее", то существует еще один метод:

Как сделать текст читаемым? Простые решения в Photoshop.
Как сделать текст читаемым? Простые решения в Photoshop.

Мы применим более гибкий инструмент. Новый слой создавать не нужно, достаточно выбрать "Кривые" (1) и немного поэкспериментировать с ползунками, результат вышел вполне приемлемым для фона.

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

Как сделать текст читаемым? Простые решения в Photoshop.

Минута дополнительных работ с кривыми, и результат стал еще приемлемее:

Как сделать текст читаемым? Простые решения в Photoshop.

Осветление происходит по тем же принципам, что и затемнение, а значит текст будет уже темным:

Как сделать текст читаемым? Простые решения в Photoshop.

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



Подписка на обновления блога
Хотите оперативно получать новости компании из корпоративного блога? Просто заполните форму ниже.
Вы сможете отписаться в любой момент.
* Поля, обязательные для заполнения
Нажимая "Подписаться", Вы принимаете условия обработки персональных данных.
Теги: Обучающая статья

Другие статьи блога

Познаем термины веб-дизайнеров - часть 2
Познаем термины веб-дизайнеров - часть 2
Умелое использование хэштегов в социальных сетях
Умелое использование хэштегов в социальных сетях
Полезные возможности Microsoft Word о которых вы не знали - ч.3
Полезные возможности Microsoft Word о которых вы не знали - ч.3

×

Информация, за которую другие щедро платят!

Подпишитесь на блог IQSites и получайте свежие лайфхаки конверсии сайтов, привлечения трафика и клиентов, тренды веб-дизайна, реальные кейсы и многое другое. Это всё ещё бесплатно!
* Поля, обязательные для заполнения

Нажимая "Подписаться", Вы принимаете
условия обработки персональных данных.

Наверх
array(5) { ["id"]=> int(0) ["ip"]=> string(13) "54.81.195.240" ["language"]=> string(2) "en" ["gmt"]=> int(0) ["guest_id"]=> string(32) "8e4ff7be0c86922133d63d5ecff68e6a" }