Как сделать текст на фоне
Перейти к содержимому

Как сделать текст на фоне

  • автор:

Как создать картинку с текстом онлайн: 10 лучших сервисов

Чтобы создать картинку с текстом онлайн, нужно от 3 до 10 минут. В сети есть масса сервисов, помогающих быстро отредактировать фото или создать изображение с нуля.

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

Картинки с текстом используются для создания:

  • красиво оформленной цитаты или мысли;
  • цепляющего заголовка к статье или посту;
  • объявления о конкурсе или акции.

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

Как сделать картинку с надписью: 10 популярных онлайн-сервисов

«Холст» в SMMplanner

Бесплатный редактор визуала сервиса автопостинга SMMplanner. Разработан специально для создания креативов для соцсетей и маркетплейсов. Здесь можно создавать картинки сразу с правильными размерами, с нуля или на основе шаблонов, сохранять их на компьютер или публиковать посты напрямую из SMMplanner.

Особенности «Холста»:

  • Каталог бесплатных шаблонов для постов, сторис и рекламных креативов. Макеты разделены на категории, есть поиск по фильтрам. Библиотека шаблонов регулярно пополняется.
  • Есть все необходимые инструменты для работы с визуалом и его элементами.
  • Готовый макет можно сохранить в свои дизайны и использовать в дальнейшем.
  • Библиотека фонов, элементов, готовых стилей для надписей.
  • Можно добавлять собственные шрифты и свободно настраивать встроенные.
  • Можно автоматически менять размер креатива под нужную соцсеть.
  • Скачивание файлов в форматах JPG, PNG и JSON.

Как сделать надпись на картинке:

1. Загрузите картинку или выберите шаблон/фон из библиотеки редактора.

2. Подберите размер изображения в разделе «Формат».

3. Выберите готовый стиль надписи в разделе Текст» или создайте текстовую плашку с нуля, используя заголовок, подзаголовок, основной текст и коллекцию шрифтов.

4. Напишите свой текст, выберите цвет и начертание с помощью инструментов верхнего меню.

5. Разместите надпись посередине или в нужном месте на картинке, используя направляющие линии, которые появляются при перетаскивании элемента.

6. Скачайте файл в подходящем формате.

Стоимость: инструменты «Холста» доступны для всех пользователей SMMplanner бесплатно. Но если у вас нет оплаченного тарифа, на готовых картинках будут вотермарки. Стоимость тарифов SMMplanner начинается от 675 рублей в месяц. Оплатив тариф, вы сможете использовать и другие полезные SMM-инструменты сервиса автопостинга, например, автоматические отчеты, репостер, AI Ассистент.

Canva

Canva – онлайн-сервис, любимый SMM-специалистами. В нем русскоязычный интерфейс, много бесплатных возможностей. Здесь можно создавать записи для ВКонтакте, Facebook, Instagram, баннеры для блога, флаеры, макеты обложек книг, меню и прочее.

Особенности Canva:

  • Большая база бесплатных шаблонов (около 8000).
  • Автосохранение наработок.
  • Готовые файлы скачиваются в формате .PNG, .JPG, .PDF.
  • Удобная регистрация через почту или аккаунт Facebook/Google.
  • Масса размеров шаблонов, которые к тому же стилизованы для разных сфер бизнеса.
  • Созданные ранее баннеры хранятся на сервисе, и их можно продолжить редактировать.
  • Можно создать команду до 10 человек.

Как сделать надпись:

1. Выберите подходящий формат графики.

2. Через загрузки добавьте файл с компьютера или подберите шаблон.

3. Выберите формат заголовка в меню слева.

4. Напишите свою фразу.

5. Выберите шрифт, цвет записи в верхнем меню.

6. Скачайте файл в нужном формате.

Платный доступ открывает полноценный функционал ресурса. Тариф Pro стоит около 13$ в месяц. К тому же, за отдельную плату можно скачивать шаблоны и фото. Они могут стоить от 1 до 10$ и выше.

Pablo

В онлайн-сервисе Pablo 6-тысячная библиотека стоковых картинок. Здесь не требуется регистрация.

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

Особенности Pablo:

  • поиск по ключевым словам;
  • 9 эффектов (затемнение, размытие и пр.) и 25 шрифтов, однако на кириллице большинство из них работает криво;
  • размер фото можно быстро подогнать под нужную соцсеть;
  • можно загрузить свою картинку;
  • готовую работу можно сразу добавить в Instagram, Facebook, Twitter.

Как написать текст на картинке:

  • Выбираете интересное изображение или грузите свое (через кнопку «Upload image»).
  • Кликаете дважды на картинку и меняете надпись на свою.
  • При желании можно выбрать цвет, расположение записи (по центру, вверху или внизу), размер.
  • Само изображение можно также украсить: выбрать нужный оттенок, размыть, поменять контраст.

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

Fotor

Онлайн-сервис Fotor позволяет не только делать надписи, но и создавать коллаж или полноценный дизайн. Для работы требуется регистрация, которую можно пройти через Facebook.

Fotor предлагает сразу разные размеры шаблонов для разных соцсетей, обложки для книги, CD-дисков, открытки и прочее.

Особенности Fotor:

  • большинство функций и готовых дизайнов – платные;
  • широкий функционал для создания графики;
  • можно загружать свои фотографии;
  • есть русскоязычная версия;
  • в бесплатной версии можно добавлять некоторые эффекты и виды рамок.

Если шаблон платный – на нем стоит водяной знак «Fotor».

Как работать в Fotor:

1. Если у вас нет картинки, заходите в «Дизайн» и ищете подходящий файл без водяного знака. Если нужно загрузить исходник с ПК, грузите его через кнопку справа. После нажимайте на «Текст».

2. Затем в левом черном меню выбираете эффекты – те, которые не помечены бриллиантом (это платная версия). Скачать готовый файл можно в формате .jpg или .png.

Подписка на Fotor стоит 8.99$ в месяц. Но за эти деньги вы получаете очень хороший сервис с множеством крутых эффектов. Работать в нем намного легче, чем в Фотошоп, а качество изображений выше.

FotoUmp

FotoUmp – русскоязычный бесплатный онлайн-сервис для создания надписей и небольшой коррекции. Редактор позволяет добавить фильтры, изменить форму, обрезать, добавить стикер.

Особенности FotoUmp:

  • есть возможность работать без регистрации;
  • фото можно загрузить свое или скачать из библиотеки FotoUmp;
  • шрифты на кириллице не работают;
  • редактор позволяет создавать креативные надписи (неоновые, 3D и др.) на прозрачном фоне.

Как работать в FotoUmp:

1. Для начала загрузите файл.

2. Выберите подходящий шрифт и установите параметры ввода (размер, цвет, положение) и напишите что-нибудь.

3. При желании добавьте эффекты, стикеры и скачайте готовый файл на компьютер.

Easelly

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

Чтобы начать работу, нужна регистрация (можно через Facebook). Аккаунт позволит хранить созданные макеты и редактировать их заново. Стоимость платной версии – 3$ в месяц.

Особенности Easelly:

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

Как создать надпись:

1. Нажимаете на «Blank Template».2. Тяните нужную картинку в рабочую область или загружаете через «Upload».

2. Нажимаете на Text в верхнем меню и выбираете тип записи (название, заголовок, обычный текст, список).

3. Создаете свою надпись, после чего можно скачивать фото на компьютер.

Crello

Crello – удобный сервис для создания инфографики. Он позволяет не только наложить текст на изображение, но и добавить анимацию. По интерфейсу напоминает Canva.

Особенности Crello:

  • большая галерея стоковых фотографий;
  • огромный выбор шаблонов для соцсетей, пригласительных, афиш и пр.;
  • большой функционал для редактирования надписей: можно выбирать шрифты, цвет, интервалы, прозрачность;
  • есть разные эффекты для изображения;
  • русскоязычный интерфейс;
  • можно загружать свои шрифты;
  • большинство картинок в платной подписке (5$ в месяц);
  • бесплатные стоковые фотографии можно искать в отдельной папке: не нужно всматриваться на наличие значка $.

Как добавить текст в Crello:

1. Выберите размер публикации.

2. Перейдите в раздел «Фото» в левом меню — «Загрузки» — «Загрузить изображение».

3. Выберите формат, введите свою надпись и настройте параметры.

4. Если нужен шаблон, заходите в «Дизайн», выбираете тот, что имеет пометку «бесплатно» и редактируете.

Piktochart

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

Особенности Piktochart:

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

Как работать:

1. Выберите формат и нажмите первый чистый лист (или кликните на подходящий шаблон).

2. Если нужно загрузить картинку, кликните на «Uploads».

3. Затем нажмите на «Текст», укажите тип надписи. В верхнем меню можно задать параметры.

Effectfree

Effectfree – простой бесплатный онлайн-сервис, чтобы добавить текст на фото. Помимо этой функции, есть еще возможность создавать рамки и различные спецэффекты (правда, на «любителя»).

Особенности Effectfree:

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

Как работать:

  1. Загружаете картинку с компьютера или вставляете ссылку на нее из интернета.
  2. Затем в белом поле внизу пишете надпись.
  3. Выбираете шрифты и эффекты.
  4. Двигаете запись с помощью стрелок в нужную область.

BeFunky

BeFunky – англоязычный ресурс, мало чем отличается от остальных.

Особенности BeFunky:

  • Большие возможности для редактирования текста.
  • Три вида редактирования: фоторедактор, коллаж, дизайн.
  • Много шаблонов и функций, правда, большинство из них в платной версии (5$ в месяц).
  • Для редактирования фото не нужна регистрация.

Как добавить надпись на фото:

  1. Заходите в раздел «Foto Editor» и загружаете картинку с ПК.
  2. Нажимаете в левом меню «А», затем зеленую кнопку «Edit text» и вводите надпись.
  3. При желании, картинку можно отредактировать эффектами, которые не помечены золотой звездочкой.
  4. Фразу можно редактировать через всплывающее окошко «Text Properties» (выбрать цвет, размер, тип шрифта и пр.).

PicMonkey

PicMonkey – сервис для создания коллажей, ретуши, дизайна и редактирования. Можно работать с шаблонами или с собственными фотографиями.

Особенности сервиса PicMonkey:

  • Есть бесплатная пробная версия на 7 дней, потом – 8$ в месяц.
  • Для текста есть эффекты: разные шрифты, цвета, расстояния между буквами, прозрачность, тень и пр.
  • Можно редактировать фото человека: убрать красные глаза, сделать стройнее, отбелить зубы и др.

Как подписать изображение:

1. Добавляете свое фото через плюсик.

2. Затем жмете «Add text» и редактируете.

3. В правом углу выбирайте настройки для записи.

Заключение

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

  1. Выбирайте цвет записи, контрастный с фоном, например, на насыщенном красном фоне хорошо будет смотреться белый текст, но не черный.
  2. Обрамляйте надпись плашками, рамками, если редактор позволяет (Fotor, Canva, Crello).
  3. Не наносите текст на значимые места (лица, предметы) и выбирайте свободный участок с однородным фоном.

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

Написание текста поверх изображений в Microsoft Word

Написать текст на картинке в Word

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

Написание текста на изображении в Word

Microsoft Word располагает несколькими инструментами для одновременной работы с картинками и текстом. Можно просто вписать слова в изображение, находящееся на заднем фоне, использовать буквицу или Word Art, а также создать специальное текстовое поле в документе, не говоря о добавлении подписи к рисункам или отдельной картинке. Обо всех этих методах и их особенностях пойдёт речь в данной статье.

Способ 1: Написание текста в картинке на заднем фоне

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

    Кликните правой кнопкой мыши по изображению, на котором следует написать текст. В выпавшем контекстном меню последовательно нажмите на «Обтекание текста», а после «За текстом».

Настройка обтекания за текстом картинки в Word

Область где нужно кликнуть, чтобы начать писать на картинке в Word

Область некорректного клика, при котором выделяется вся картинка в Word

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

Способ 2: Вставка надписи

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

    Чтобы вставить надпись, нажмите на панель «Вставка», далее выберите раздел «Надписи» и из выпавшего меню укажите один из заданных вариантов, какой проходит вам больше. Кроме этого, можно нажать на кнопку «Нарисовать надпись» для создания своей надписи, отличной от стандартных.

Выбор надписи для вставки в документ Word

Надпись поверх картинки и инструменты для её редактирования в Word

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

Способ 3: Вставка WordArt

Будучи инструментом, сходным с надписями, WordArt предназначен больше для нескольких слов, которые надо как-то вычурно оформить.

    Для вставки объекта WordArt перейдите на вкладку «Вставка», потом кликните по значку «WordArt» и выберите стиль, в котором вы хотите видеть его на картинке.

Выбор WordArt для вставки в документ Word

WordArt очень схож с надписями в Word

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

Способ 4: Вставка названия

В том случае, когда пользователю необходимо не столько написать что-то в картинке, сколько дать ей описание, лучше всего использовать вставку названия.

    Кликните правой кнопкой мыши по изображению, которое нужно подписать. В контекстном меню нажмите на «Вставить название…».

Выбор вставки названия для картинки в Word

Настройка названия и параметров вставки названия картинки в Word

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

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

Подходя к итогу, следует сказать, что написать текст поверх картинки в Microsoft Word не очень сложно, даже довольно удобно и порой интересно, если требуется его как-то красиво оформить. Текстовый редактор даёт для этого все инструменты, такие как обычное добавление текста поверх картинки, пользуясь ей как некой подложкой, блоковое написание для заметок или выделения одних частей документа над остальными, создание красиво оформленных художественных и технических подписей.

Как сделать фон для текста в фотошопе?

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

Например, к тексту можно добавить какой-нибудь фон, или вернее, расположить текст на каком-нибудь фоне. В этом уроке мы будем делать текст на фотографии и применим к нему фон. Открыв фотошоп загружаем в него фотографию, на которой будем делать текст с фоном.

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

В результате на панели слоев появится новый слой. Далее, на панели инструментов выбираем инструмент «прямоугольная область» и рисуем выделение необходимого размера. В частности, рисуем от одного края рисунка до противоположного прямоугольник.

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

На следующем этапе устанавливаем для этого слоя заливку в 20%.

Далее, кликаем два раза по слою выделения и вызываем окно свойства слоя. Открываем вкладку «Обводка«. Здесь в пункте «Цвет» выбираем белый цвет. Размер выставляем два пикселя. В разделе положение ставим «Снаружи», а «непрозрачность» устанавливаем как 50%.

Создаем копию фонового слоя. У нас получится три слоя: «фон», «фон копия» и верхний слой – «слой выделение». Активируем слой «фон копия». Затем зажимаем клавишу Ctrl и щелкаем левой кнопкой мыши по миниатюре слоя с выделением (третий верхний слой). В результате выделится часть фонового слоя под прямоугольником.

Затем в главном меню выбираем «Фильтр-Размытие-Размытие по Гауссу».

Радиус размытия устанавливаем равным 20.

Далее, на готовом фоне пишем нужный текст. Выбираем шрифт, цвет и размер и получаем готовое изображение с текстом.

Вот такой текст на фоне можно создать. Потренировавшись, можно создавать свои варианты фона как однотонные, так и цветные градиентные. Удачи!

5 способов разместить текст на изображении в Фотошоп

5 способов разместить текст на изображении в Фотошоп

Сложность урока: Легкий

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

В этом уроке представлены 5 способов улучшения контраста при размещении текста поверх изображений.

1. Наложение Цвета

На изображении ниже, вы можете увидеть, что текст очень сложно прочитать, потому что отвлекает внимание задний фон. На заднем фоне слишком много деталей, в частности в области барной стойки. Хорошо подобранный шрифт “Buffalo Wings” полностью затерялся из-за нагромождения, которое создал задний фон. Тем не менее, в данном случае, у нас есть возможность улучшить контраст.

Первый шаг – создайте новый слой, назовите этот слой “наложение цвета”. Далее, выберите инструмент Пипетка (Eyedropper), нажав клавишу (I). С помощью данного инструмента, отберите образец цветового оттенка с рубашки мужчины, а затем залейте новый слой выбранным цветовым оттенком (Shift+F5).

В заключение, уменьшите непрозрачность (opacity) слоя с заливкой до 50%, а затем, переместите данный слой вниз, расположив ниже слоёв с текстом.

Как вы видите, мы значительно улучшили контраст. Теперь, текстура шрифта “Buffalo Wings” стала более отчётливой и более различимой.

2. Стиль слоя Тень (Drop Shadow)

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

Первый шаг – подберите соответствующий цвет для текста.

Вы наверно догадались, что в данном случае, мы хотим, чтобы цвет текста был более светлым, предпочтительно белый.

Следующий шаг- это добавить стиль слоя Тень (drop shadow) к слою с текстом. Установите степень непрозрачности 52%. Также подкорректируйте значение Размаха (Spread) 16%, включая значение Размера (Size) 10px. Угол (angle) должен быть где-то, примерно, -144 градусов.

Мы значительно усилили контраст, просто добавив стиль слоя Тень (drop shadow).

3. Линии

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

Добавление двух линий….

.…создаёт наибольшее разделение между двумя элементами дизайна.

4. Фигурные Блоки для Текста

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

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

Чтобы усилить видимость текста, выберите инструмент Произвольная фигура (Custom Shapes Tool), нажав клавишу (U), чтобы создать фигурный блок. Фигурный блок может быть любой формы, здесь нет блока правильной формы или неправильной формы.

Залейте фигуру чёрным цветом, а также установите цвет Обводки (Stroke) белый, толщина обводки 3pt.

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

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

5. Размытие Заднего фона

5-й и последний способ улучшить контраст – это лёгкое размытие заднего фона.

Изначально, текст очень сложно различить на заднем фоне.

Первый шаг- преобразуйте слой с задним фоном в смарт-объект. Просто, щёлкните правой кнопкой мыши по слою с задним фоном и в появившемся окне, выберите опцию Преобразовать в смарт-объект (Convert to Smart Object).

Далее, идём Фильтр – Размытие – Размытие по Гауссу (Filters-Blur-Gaussian Blur).

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *