Картинка с прозрачным фоном формат: Использование флажков «Прозрачность» и «Подложка» в Photoshop Elements

Содержание

Gif, Png или Jpg — форматы растровой графики для веба, их плюсы и минусы при использовании на сайте

Обновлено 22 мая 2021
  1. Растровая графика для веба в лице Гиф, Джейпег и Пнг
  2. Формат Gif — элементы дизайна и анимация для сайта
    1. Gif-анимация и ее использование
    2. Поддержка прозрачного фона
    3. Какую графику лучше сохранять в Гиф?
  3. Jpg — полноцветные изображения с малым весом
    1. Плюсы и минусы Джейпег
    2. Какие изображения лучше сохранять в формате Jpg (JPEG)?
  4. Png — замена Gif и Jpeg, а так же прозрачный фон
    1. Png8 и Png24 — альтернатива Gif и Jpeg
    2. Png 32 — полноценная прозрачность с альфа каналом

Здравствуйте, уважаемые читатели блога KtoNaNovenkogo.ru. Сегодня я хочу поговорить про форматы растровой графики, которые было уместно применять для картинок выводимых на сайте, да и вообще.

Мы рассмотрим Gif, который популярен сейчас именно из-за поддержки им гиф анимации, Jpg, который очень хорошо подходит для вставки полноцветных фотографий и, конечно же, Png, который позволяет создавать картинки с прозрачным фоном и может служить отличной заменой упомянутых ранее форматов. Так же можете почитать про наполовину графический, а наполовину текстовый формат djvu.

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

Растровая графика для веба в лице Гиф, Джейпег и Пнг

Сейчас очень трудно представить веб-сайты и отдельных веб-страниц совсем без наличия на них каких-либо фотографий, значков или картинок. Кстати, первым браузером, который мог показывать графику, стал Mosaic (мозаика), появившийся практически одновременно с появлением языка гипертекстовой разметки Html.

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

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

Размер картинки у них определяется таким понятием, как разрешение, которое представляет из себя размер изображения в пикселах по горизонтали и вертикали, например, 300 на 200. Иногда, правда, говорят об общем количестве пикселей в картинке, например, производители фотоаппаратов (12 Мега пикселей и т.п.).

Применительно к вебу, физический размер растровой картинки может существенно зависеть от величины пикселя (зерна экрана) того устройства, на котором пользователь осуществляет просмотр веб страницы. Изображения так же характеризуются таким понятием, как количество цветов используемых в нем. Например, для Gif используется всего лишь 256 цветов, которые задаются в одном байте информации.

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

Одним из основных недостатков растровой графики является большой размер результирующих картинок, даже в форматах Gif, Png и Jpg, которые используется в вебе. Естественно, что для уменьшения результирующих изображений используются различные алгоритмы сжатия, которые работают как с ухудшением качества (сжатие с потерями), так и без оного.

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

Но существуют и алгоритмы сжатия картинок без потерь — BMP, Gif и Png. BMP чаще всего представляет из себя не сжатое изображение, а вот Gif и Png сжимаются без потерь за счет удаления повторяющейся и избыточной информации (получается что-то на вроде архивирования, но учитывающего особенности растровой графики).

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

Формат Gif — элементы дизайна и анимация для сайта

На данный момент практически все браузеры поддерживают три основных формата растровой графики используемых для веба — Gif, Png и Jpg. Исторически первым появился Гиф и именно с помощью него в первых браузерах можно было добавлять и отображать картинки и медийную информацию, которая в первую очередь выражалась в так называемой Гиф анимации.

Аббревиатура Gif расшифровывается, как Graphics Interchange Format — формат графического обмена. Произносится как гиф, но разработчики стандарта считали, что правильно его называть джиф, но прижилось другое название в русской интерпретации.

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

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

Но, к сожалению, на практике, при преобразовании полноцветных фотографий в Гиф, вылазит куча артефактов (из-за этого самого подмешивания), которые делают фотографии неприемлемым для выкладывания в вебе. Поэтому для вывода на страницы сайта полноцветных картинок и фото он не используется (для этого чаще всего выбирают Jpg или Png).

Gif-анимация и ее использование в интернете

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

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

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

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

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

В результате получает тот самый эффект мультика, который мы уже привыкли наблюдать на веб страницах. Иногда даже в глазах рябит от анимированных баннеров (читайте про то, как сделать баннер онлайн), смайликов, аватаров. Примером Гиф анимации может служить гоблин со страницы «О блоге» моего проекта.

Гиф поддерживает прозрачный фон (почти)

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

Но проблема состоит в том, что для любого пиксела в изображении этого формата возможно лишь два значения — прозрачный или непрозрачный (два крайних состояния без возможности промежуточных вариантов типа полупрозрачный, на четверть прозрачный и т.п.). Т.е. о таком понятии, как альфа-канал (используемого в Png), в прозрачном Gif речи не идет. Из-за этого возникают сложности с отображением плавно изменяющего уровня прозрачности.

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

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

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

Цвет MATE подмешивается в те области Гифа, где вам требуется создать плавные края с падением прозрачности, но все это будет хорошо смотреться только для того фона веб страницы, который совпадает с указанным вами MATE. А вот поверх другого оттенка эта картинка будет выглядеть очень не здорово.

Для какой веб-графики имеет смысл использовать формат Gif?

Как я уже упоминал чуть выше, в этом формате рисунки сжимаются (преобразуются) без потерь, но только в том случае, если исходная картинка была 8-ми битной (для кодирования цвета отводился всего лишь один байт), т.е. содержало 256 цветов. Если же исходник был полноцветным, то будет ухудшение качества при сохранении или преобразовании в Gif, именно в силу потери части оттенков.

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

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

Кроме этого, данный алгоритм сжатия был в свое время запатентован, и именно поэтому началась усиленная работа над альтернативным Png 8, но на данный момент сроки патентов Gif уже истекли. ПНГ получился в итоге на голову лучше Гифа и продолжает набирать популярность среди вебмастеров.

Jpg (JPEG) — полноцветные изображения с малым весом

Jpg был разработан для сжатия и хранения полноцветных фотографий. Он является собственностью ассоциации американских фотографов, о чем, собственно, и говорит аббревиатура Jpeg — Joint Photographic Experts Group. Хотя сама же эта ассоциация говорит, что это открытый формат.

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

Плюсы и минусы Джейпег

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

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

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

Вот пример такого издевательства (всего несколько повторных сохранений в формате Джепег и на картинку без слез не взглянешь):

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

Какие изображения лучше сохранять в формате Jpg?

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

Смотрите, как неприглядно выгладит скриншот текста в формате JPEG (хотя при таком же и даже меньшем весе в формате PNG картинку вообще было бы не отличить от оригинала):

У Jpg (JPEG), как я уже упоминал, есть возможность задать качество получаемого изображения, регулируя степень его сжатия. При сохранении фото, на которых, например, много неба, следует ставить качество (степень сжатия) Jpeg близкое к максимальному (минимальное сжатие) во избежании заметных артефактов на этом самом небе.

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

Я упоминал, что при сохранении в Jpg (JPEG) происходит разбиение всего изображения на квадратики со стороной в восемь пикселей. Так вот, если у вас будет возможность выбирать размер результирующего фото, то лучше его брать кратным восьми, т.к. в этом случае вы получите чуть меньше артефактов, что будет особенно заметно на картинках с тонкими линиями и т.п.

Png — замена Gif и Jpeg, а так же прозрачный фон в Png32

Изначально Png разрабатывался как альтернатива проприетарного в то время Gif (к его разработке не подпускали никого со стороны). Расшифровывается аббревиатура как «portable network graphics», изначально он был заточен именно для применения в вебе. Этот формат растровой графики полностью открытый и его описание есть на сайте консорциума W3C.

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

Png8 и Png24 — полноценная замена Gif и Jpeg

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

Png 8 — восьмерка обозначает битность цвета и говорит о том, что при сохранении фотографии в Пнг 8 будет использоваться только 256 цветов по аналогии с уже описанным чуть выше Gif.

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

Png 24 — цифра 24 означает, что на каждый пиксел фото в этом формате выделяется три цветовых канала по 8 бит каждый (по 1 байту), тем самым реализуется полноцветное формирование изображения. Т.о. с помощью Пнг 24 вы сможете передавать цвета без искажений. Даже Jpg не может этого сделать на все сто процентов.

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

Т.е. как я уже упоминал чуть выше, для обычных фоток лучше всего подойдет Jpeg, а вот для изображений с текстом или там, где ни в коем случае нельзя будет ухудшать качество, Png 24 будет незаменим. Для сохранения скриншотов, которые я использую в статьях, Пнг 8 или 24 мне кажутся оптимальным решением.

Например, тот же самый скриншот с текстом, который чуть выше вы могли видеть сохраненным в Jpeg (правда с низким качеством, чтобы подчеркнуть возможные артефакты) в Png будет выглядеть так:

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

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

Png 32 — полноценная прозрачность с альфа каналом

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

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

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

или иконка RSS ленты:

Наверное, понятно, что Png 32 просто незаменим и не имеет аналогов по предоставляемых возможностям. Кстати говоря, альфа канал можно использовать так же и в Пнг 8, но, к сожалению, не все редакторы растровой графики позволят вам это сделать. Фотошоп, например, этого делать не умеет, но зато Fireworks или Gimp умеют.

Кроме этого, у Пнг 32 и 8 с альфа-каналом есть такая проблема, что он в браузере IE, начиная с версии 6 и ниже, не поддерживается полноценно, и вместо прозрачного фона будет подмешиваться серый цвет, а Png 8 с альфа-каналом там вообще показываться не будет. Правда, таких архаичных браузеров у пользователей уже практически не осталось, но все же.

Удачи вам! До скорых встреч на страницах блога KtoNaNovenkogo.ru

Формат PNG — описание формата, как использовать, чем открыть — PNG картинки с прозрачным фоном cкачать бесплатно

Формат PNG – описание, особенности, использование

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

История и общее описание PNG формата

Название PNG — это аббревиатура от полного названия Portable Network Graphic. Что в переводе на русский означает — компактный сетевой графический формат. Смысл заложеный в названии действительно отражает суть PNG формата, как компактного качественного графического контента предназначенного для использования в сети интернет. Именно благодаря характеристикам, идеально подходящих для использования на интернет сайтах, PNG стал общеупотребительным форматом и используется практически на каждом сайте и портале.

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

Формат PNG появился как альтернатива формата GIF. В свое время GIF был единственным растровым форматом, который поддерживал свойство прозрачности. Однако использование изображений в GIF формате требовал соблюдение прав на лицензию и соответственно предполагал оплату, плюс ко всему GIF поддерживал 8 битную разрядность. По сути поддерживал всего 256 цветов, что конечно не позволяло хранить качественную картинку.

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

В отличие от GIF формата PNG используют уже шестнадцатиричную разрядность и поддерживают до 2,5 млн цветов и оттенков, что позволяет обеспечить намного более качественное картинку, сохранив свойство прозрачности за счёт поддержки альфа-канала. Также PNG формат стал невероятно популярным за счёт того, что не предусматривал никаких коммерческих лицензий. Использовать изображение в PNG формате можно абсолютно бесплатно. Особо следует отметить возможность поддержки большого количества оттенков в PNG и поддержка полупрозрачности, что дает возможность создавать плавный, качественный переход от графического контента в прозрачный фон. Часто такая задача встает когда дизайнеры реализуют эффекты свечения или тень. В таких случаях именно PNG-формат становится просто незаменим!

Размер изображений в PNG формате

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

Поддержка PNG формата операционными системами

Изображения в PNG формате в связи с его стандартизацией и приобретением статуса общеупотребительного и общедоступного формата, поддерживается всеми существующими операционными системами, как в настольных компьютерах (ОС Windows, MacOS, Linux, Ubuntu и др. ), так и на мобильных платформах, таких как iOS, Android, Tizen, Windows Mobile и др.).

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

Обработка PNG формата в графических редакторах 

Все популярные современные графические редакторы в различных операционных системах способны редактировать и сохранять графику в PNG формате по-умолчанию и без необходимости использования дополнительных плагинов и надстроек. Вы можете сохранить графику в PNG файл и из векторных редакторов таких, как Adobe Illustrator или Corel Draw, несмотря на то, что ПНГ является растровым форматом.

Единственное с чем вы можете столкнуться, так это с переносом PNG изображения из браузера в графический редактор, например, Photoshop, путем прямого копирования (если вы правой кнопкой скопируйте изображение и также через правую кнопку вставите в рабочую область Photoshop) прозрачный фон может замениться на черный.

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

Современные браузеры и PNG изображения

Что касается использования изображений в PNG формате в верстке (HTML-коде) и отображение в браузерах, то ничего нового добавить невозможно, все современные браузеры и даже Internet Explorer самого старого поколения безошибочно отображает PNG изображение с сохранением прозрачного альфа-канала без специальных атрибутов, настроек и расширений для браузеров, как для серверной части на хостинге, так и на стороне клиента не требуется.

Единственное, что мы можем Вам порекомендовать, так это оптимизировать размер PNG изображений по размерам: ширине и длине, под вашу верстку и не использовать пережатие размера картинок через атрибуты тегов и css. Такой подход  не рационально расходует трафик и увеличивает размер загружаемых данных. Хотя такое правило характерно не только для PNG, но и для JPEG изображений и других графических форматов, используемых в верстке сайтов.

Выводы и резюме по обзору PNG формата

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

2.3. Сохранение изображений с прозрачностью

2.3. Сохранение изображений с прозрачностью

2.3. Сохранение изображений с прозрачностью

Существует два разных подхода сохранения прозрачных областей в файлах: простая бинарная прозрачность и прозрачность альфа. Простая бинарная прозрачность поддерживается в формате GIF. Здесь один цвет в таблице цветов отведён прозрачному цвету. Прозрачность альфа поддерживается в формате PNG.

Здесь информация о прозрачности сохранена в отдельном канале альфа.

Примечание

Обычно нет необходимости сохранять изображения в формате GIF, потому что PNG поддерживает все аспекты GIF и даёт дополнительные (например, прозрачность альфа). Однако, GIF всё ещё используется для анимации.

Процедура 6.1. Создание изображений с прозрачными областями (прозрачность альфа)

  1. Для примера будет использоваться изображение с Уилбером, как и в других инструкциях.

    Рисунок 6.10. Изображение с Уилбером в режиме RGBA


  2. Чтобы экспортировать изображения с прозрачностью альфа, необходимо иметь канал-альфа. Чтобы проверить, есть ли у изображения альфа-канал, перейдите в диалог каналов и посмотрите, есть ли среди них, помимо каналов красного, зелёного и синего, канал «Alpha». Если это не так, то добавьте новый альфа-канал из меню слоёв: + → .

  3. В исходном файле XCF есть слои фона, которые можно удалить. GIMP предлагает набор фильтров для создания градиентов; проверьте подменю +. Для демонстрации прозрачности мы добавили свечение вокруг Уилбера.

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

Рисунок 6.11. Изображение Уилбера с прозрачностью


Как сделать прозрачный фон картинки в фотошопе 3 разных способа.


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

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

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

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

Вырезание объекта в фотошопе

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

Качество готовой картинки в основном зависит от качества выделения. Постарайтесь максимально точно повторить форму предмета подходящими инструментами лассо.

Если края предмета имеют не четкие края, выделение тоже должно иметь слегка размытые грани. Для этого нужно щелкнуть по выделению правой кнопкой мыши и задать значение «Растушевки». Значение размытия сработает ко всему выделению.

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

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

Основной предмет с высокой четкостью границ можно выделить обычным инструментом «Лассо», а нечеткие края — мягкой кистью в режиме «Быстрой маски» (Quick Mask — Клавиша Q), как показано на снимке ниже.

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

Добавление к выделению нечетких областей

А теперь, подробнее о другом способе выделения. Выделите основную часть изображения с четкими границами, затем нажмите — Select/Save Selection…

Снимите выделение и создайте новое, вокруг нечеткой области. Нажмите правой кнопкой мыши — Feather… (Растушевка…) Задайте необходимое значение. Как правило, нескольких пикселей будет достаточно.

Теперь, нажмите — Select/Load Selection… Выберите пункт — Add to Selection (добавить к выделению). Ваше прошлое выделение склеиться с новым, а разные степени размытия сохранятся.

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

Форматы поддерживающие прозрачный фон

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

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

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

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

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

Кратко о возможных вариантах

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

  1. “Волшебная палочка”
  2. “Магнитное лассо”
  3. “Быстрое выделение” (если фон картинки разноцветный)
  4. “Быстрая маска” (если разноцветный)

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

back to menu ↑

Способ №1 “Волшебная палочка”

Это самый популярный способ, который применяется для одноцветного бэкграунда.

Вот что нужно сделать:

1 Откройте изображение в Фотошоп. Картинки с непрозрачным фоном обычно имеют формат Jpg, и у них фоновый слой недоступен для редактирования. Чтобы его разблокировать в правом нижнем углу выберите раздел Слои и кликните по замочку в строке Слой 0 (Layer 0)

2 Теперь активируйте инструмент Волшебная палочка (Magic wand). Если его никак не найти, то кликаем правой кнопкой по инструменту Быстрое выделение, и в ниспадающем меню появится нужная нам палочка

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

4 Теперь ненужный задний слой необходимо удалить (нажмите на клавиатуре клавишу Delete). То что задник стал невидимым понятно по открывшемуся полю из бело-серых шашек. Можно сразу вставить объект в другой бэкграунд (копируем и вставляем с помощью сочетания горячих клавиш Ctrl+C и Ctrl+V)

5 Для того чтобы прозрачный бэкграунд не превратился в белый во время сохранения выберите формат GIF либо PNG. В меню Файл нужно будет выбрать функцию Сохранить как, тогда будет доступен выбор формата сохраняемого изображения. Если сохранять в Jpg, то все до одной картинки будут непрозрачными. Поддерживается получившийся формат всеми браузерами, поэтому можно сразу загружать работу на web-сайт

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

Теперь перейдем к работе с Лассо.

back to menu ↑

Способ №2 “Лассо”

У инструмента есть три разновидности.

  • Обычное “Лассо” стоит применять только если у вас графический планшет либо твердая рука. Выделять границу объекта вместе со всеми неровностями придется самостоятельно, без помощи программы
  • “Прямолинейное лассо” подойдет только для объекта, состоящего из прямых линий
  • “Магнитное лассо” является самым удобным вариантом и подойдет неопытным пользователям. Им и будем работать

Вот что нужно сделать:

1 Откройте изображение в Фотошопе. В правом нижем углу кликните по окну Слои, а затем по иконке замка в строке Слои 0. Если он исчез, то это сигнализирует о допуске к работе

2 На панели инструментов правой кнопкой кликните по иконке Лассо. Откроется ниспадающее меню, в котором нужно выбрать Магнитное лассо

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

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

5 Теперь в верхнем меню кликните по разделу Выделение, а в ниспадающем меню выберите функцию Инверсия

6 В результате вы увидите, что вся область бэкграунда автоматически выделится

7 Останется только удалить ее кнопкой Del. Не забудьте сохранить получившуюся картинку как PNG или GIF-изображение. Если нужно, то сразу используем Ctrl+C и вставляем скопированное изображение в новый фон

Разобранные способы хороши для одноцветного бэкграунда, но что делать, если он контрастный?

back to menu ↑

Способ №3 “Быстрое выделение”

Инструмент для лентяев, как и магнитное лассо. Однако с “приталиванием” пограничной линии, возможно, придется повозиться.

Вот что нужно сделать:

1 Откройте изображение в Фотошоп. В правом нижнем углу выберите раздел Слои и в строке Слой 0 кликните на замочек

2 На панели инструментов выберите Быстрое выделение. Если инструмента не видно, то кликните правой кнопкой мыши по инструменту Волшебная палочка и в выпадающем меню перейдите на нужный

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

4 Теперь применим уже известный нам комбинацию с инверсией

5 Марширующие муравьи опять очертили весь ненужный фон

6 Осталось только удалить его, нажав Del, и сохранить получившееся изображение как PNG или GIF-картинку

Для полноты картины рассмотрим еще один способ устранения разноцветного фона.

back to menu ↑

Способ №4 “Быстрая маска”

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

Вот что нужно делать:

1 Открываем изображение в фоторедакторе. В правом нижнем углу находим окно Слои и в строке Слои 0 нажимаем на иконку замка для разблокировки фона

2 На панели инструментов последовательно выбираем Быструю маску и Кисть

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

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

5 Теперь нажмите знакомую уже клавишу Delete фон для удаления. Готово. Осталось сохранить получившуюся картинку как PNG или GIF.

back to menu ↑

Отсечение фона маской

Этот метод не требует использования программы Photoshop. Непосредственно в программе верстки CorelDRAW или Illustrator вы можете обрисовать предмет контуром, а затем скрыть все, что за его пределами.

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

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

Clipping Mask в Adobe Illustrator

Разместите изображение в редакторе Illustrator и обрисуйте контуром предмет. Затем выделите изображение и контур вместе и нажмите правой кнопкой мыши — Обтравочная маска (Make Clipping Mask). Часть изображения за пределами контура скроется.

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

PowerClip в CorelDRAW

В CorelDRAW есть такой же прием, однако работает он немного иначе. Также нужно обрисовать предмет контуром, а затем, выделить изображение и нажать — Effects/PowerClip/Place inside Frame…. Вместо указателя появится стрелка, которой нужно показать контур.

Контур в CorelDRAW также можно редактировать после создание маски.

Еще в CorelDRAW можно сделать объект прозрачным, не создавая контура, вы можете просто перемещать узлы краев изображения инструментом Shape tool, тем самым меняя его форму. Двойной щелчок по контуру будет создавать новые узлы.

Как сохранить изображение в формате PNG с помощью стандартных средств Windows

Проще всего для изменения формата изображения воспользоваться предустановленной программой Paint. Вам поможет представленная далее инструкция.

  1. Откройте программу.
  2. В открывшееся окно перетащите необходимое для изменения формата изображение.
  3. Нажмите по синей кнопке, расположенной в левом верхнем углу интерфейса приложения.
  4. Из появившегося списка нажмите по вкладке «Сохранить как».
  5. В открывшемся окне «Проводника», во второй строке «Тип файла», необходимо развернуть список и выбрать из предложенных расширение PNG.
  6. Нажмите «ОК».


Прозрачность режимом наложения

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

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

В Illustrator нужно открыть панель прозрачностей — Window/Transparency. А затем выбрать режим — Multiply (Умножение).

В CorelDRAW возьмите инструмент — Transparency.

В панели параметров инструмента настройте так, как показано на скриншоте ниже:

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

Программы для работы с png, как скачать и установить

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

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

Как правило, использование утилит ПНГ подразделяют на несколько категорий:

  • предназначенные для работы в Windows, Mac, Linux;
  • на мобильных устройствах.

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

Программы для работы с png в Windows

Выше мы разбирались с основным вопросом статьи – формат png что это. А сейчас разберём лучшее программное обеспечение для Windows, которое может не только открыть Png файлы, но и их редактировать:

  1. Movavi Fhoto Editor. Эта отличная программа для Виндовс, которая редактирует фотографии и картинки. Вместе с тем, открывает форматы картинок в Png.
  2. Microsoft Paint. Об этой программе мы уже говорили раньше в статье. Она поможет Вам просматривать ПНГ файлы и сохранять их в другие форматы. Данная программа есть в каждой Виндовс, её не нужно устанавливать на компьютер.
  3. Artweaver. Эта утилита умеет качественно редактировать любые изображения. С помощью неё Вы так же сможете открыть ПНГ картинки.
  4. Adobe Photoshop. Думаю эта программа известна многим пользователям. Она редактирует изображения, делает их уникальными и сохраняет их в формате Png.

Этих программ Вам вполне хватит, чтобы отредактировать картинку в PNG и её открыть.

Программы для работы с png в Mac, Linux и мобильных устройствах

Рассмотрим ещё программы для редактирования ПНГ файлов на других устройствах:

  1. MacPhun ColorStrokes. Эта программа в основном используется в операционной системе MAC. Она довольно быстро редактирует картинки ПНГ.
  2. GIMP. Простой редактор, который предназначен для создания и редактирования картинок Png и других форматов. Он работает в системе Linux.
  3. Adobe Photoshop Express for Android. Это своего рода специальное приложение, которое устанавливается на телефон через App Story или Плей Маркета. Оно может Вам помочь отредактировать фотографию для Вашего блога и социальных сетей.

Конечно, это не все программы. На просторах Сети Вы сможете найти ещё больше похожих программ.

Конверторы png файлов

В Интернете есть бесплатные конверторы png файлов. Воспользуемся одним из них – «convertio.co/ru/png-converter», а затем перечислим небольшой список конверторов. Итак, нажимаете кнопку на сервисе – «С компьютера» и выбираете те картинки, которые хотите конвертировать в Png (Скрин 5).

Если перейдёте по указанной ранее ссылке, в настройках на сервисе, будет стоять формат PNG. Далее, кликните на кнопку «Конвертировать», чтобы преобразовать формат. Затем, нажмите «Скачать» и файл будет загружен на компьютер в формате Png.

Есть ещё такие конверторы, которые Вы можете использовать:

  1. PNG To JPG Converter.
  2. Online-converting.ru.
  3. Конвертор Png
  4. Pixlr

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

Оптимизация изображений.

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

Лучший способ сжать изображения оффлайн.

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

Вот его преимущества:

  • Объединяет PNGOUT, OptiPNG и DeflOpt для создания меньшего размера PNGs
  • Без потерь качества изображения — изменяется только размер файла
  • Конвертация JPG, GIF, TIFF, и BMP файлов в PNG
  • Ультра-комфортный интерфейс

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

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

Шаг 1. Работаем с оригиналом

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

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

Открыть фото для работы

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

Улучшите качество фото

Довольны результатом? Замечательно, теперь вам предстоит изменить фон на фото.

Шаг 2. Делаем фон прозрачным

В меню «Эффекты» кликнете по вкладке «Замена фона» . Первое, что потребуется сделать, – отделить объект от фона. Для этого аккуратно обведите фигуру по краю с помощью курсора. Ошиблись? Не страшно! Просто воспользуйтесь функцией «Выделить другую область» и начните работу заново. Для удобства вы можете увеличить масштаб изображения, нажав кнопку «100%» . Замкните начало и конец выделения двойным щелчком мыши. Получилось неровно? Скройте небрежные края, увеличив степень размытия границ.

Обведите контур объекта

Отлично! Теперь в списке вариантов для оформления отметьте самый первый пункт – «Без фона» . Один клик – и всё, что находится за границей выделения, удалено. На изображении это будет обозначено шахматным узором. На примере – фото с цветным задним планом, но вы также можете сделать белый фон картинки прозрачным. Алгоритм действий не изменится.

Обратите внимание на возможности опции «Замена фона» . В дальнейшем вы сможете оформлять подложку снимков однотонной или градиентной заливкой, а также с помощью текстур и фоновых изображений. Не подошли варианты коллекции программы? Загрузите файл с вашего компьютера. Всё – очень просто!

Делаем фон прозрачным

Шаг 3. Сохраняем результат

Не спешите закрывать окно замены фона, прежде – сохраните результат. Нажмите кнопку «Сохранить в файл» . В появившемся окне введите название изображения и в строке «Тип файла» установите в качестве формата PNG или GIF. Это важно, поскольку только указанные форматы поддерживают отображение прозрачных участков. Если вы пропустите этот нюанс, программа автоматически сохранит изображение с белым фоном. Проверьте настройки и повторно кликните «Сохранить» . Готово!

Сохраняем готовую картинку

Быстро и легко, правда? Всего три шага – и вы получили фото с прозрачным фоном!

При желании вы можете дополнительно обработать изображение уже после замены фона. Обратите внимание на панель инструментов. С помощью кистей осветления и затемнения, размытия и резкости вы сможете редактировать отдельные участки снимка. Инструмент «Штамп» пригодится для ретуши. Просто зажмите кнопку ALT, выберите на фото область, которая будет источником штампа, и закрасьте нежелательный объект.

Корректируем фото штампом

В дальнейшем вы сможете наложить картинку с прозрачным фоном на другой снимок, использовать в качестве клипарта или создать оригинальный коллаж. Всё это возможно с удобной опцией «Фотомонтаж», вы найдёте её в меню «Оформление».

Наложите слой с png-или gif-картинкой на другое изображение. Меняйте размер и положение объекта. Настройте режим смешивания и прозрачность, при желании используйте маску. Подробную инструкцию о том, как выполнить фотомонтаж в «Домашней Фотостудии», вы найдёте в других статьях онлайн-учебника.

Теперь вы знаете, как сделать задний фон картинки прозрачным и как можно применить этот полезный навык. Если вы решите скачать «Домашнюю Фотостудию», вам не нужно будет осваивать сложные графические редакторы. Качественная ретушь, быстрое устранение дефектов, доступный новичку фотомонтаж – в программе есть всё необходимое для работы с фотографиями. Преображайте любые изображения быстро, просто и с удовольствием!

Онлайн-программма Pixir-делаем прозрачный фон у картинки.

Сергей Фещуков

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

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

Как сделать прозрачный фон у картинки

Возьмём в пример одну простую картинку в формате.jpg (вообще формат не важен особо):

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

Загружаем наше изображение. Справа в окошке «Слои» появится слой «Фоновый», на котором замочек (не дает удалять фон картинки).

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

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

Теперь удаляем фон нажатием кнопочки «Delete» и получаем нужное нам изображение с прозрачным фоном.

В итоге на выходе получаем то же изображение с прозрачным фоном.

Единственный минус Pixlr — нельзя изображение сохранить в формат.gif, который тоже сохраняет прозрачный фон, но намного легче, чем формат.png. Но если нет другого выхода, почему бы не воспользоваться этим?

спасибо Натальи Петровой

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

Итак, как сделать прозрачный фон в Фотошопе?

Запускаем Фотошоп и открываем подопытную фотографию. Жмем меню Файл – Открыть и указываем расположение изображения.

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

Нужно, чтобы этот замочек исчез, то есть слой разблокировался. Для этого прямо по замочку делаем один клик левой кнопкой мыши . И замочка больше нет!

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

Жмём инструментом по фону на фотографии, таким образом выделив ненужный нам объект.

Появилась пунктирная линия (бегающие муравьи). Остается нажать на клавиатуре клавишу DELETE и фон будет удален. Смотрите как получилось:

Супер! Теперь снимите выделение нажав на клавиатуре сочетание клавиш CTR+D .

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

Для этого нажмите меню Файл – Сохранить для Web . Или же просто воспользуйтесь ALT+SHIFT+CTR+S .

Вы увидите окно, в котором нам обязательно нужно выбрать формат PNG-24 и только после этого нажимать кнопку Сохранить .

А теперь смотрите что было и что стало:

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

На этом сегодня всё, желаю удачи!

2 голоса

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

Это самая популярная функция в программе Photoshop, а потому я решил максимально подробно рассказать вам не только о самом процессе, но и том, как сохранить картинку в фотошопе без фона.

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

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

Более терпеливых я благодарю за понимание. Приступим.

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

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

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

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

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

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

Как правильно хранить прозрачные картинки

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

Видите, помимо шашки, в Google почти всегда вместе с нужными картинками можно увидеть это сочетание букв.

Затем выбираете нужный тип файла, png и готово. Он есть в любой версии. Если не видите – ищите внимательнее. Без него никак. Уверяю вас.

Зачем было нужно придумывать другой формат? Все дело в том, что популярный jpeg, не понимает, что такое прозрачность. Он меняет ее на привычный белый.

Как избавиться от фона: простой и довольно быстрый способ без лишних заморочек

В моем блоге вы можете найти статью, в которой я показываю 4 инструмента и привожу видео, в котором можно найти 3 способа избавиться от фона на рисунке (). Можете прочитать ее, если вам интересно. Сейчас я хотел бы показать вам еще один прием, так как считаю, что без этого статья была бы не полной. Мало ли, кто-то не захочет лазить по моему блогу. А тут все в одном месте.

Итак, открываем картинку.

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

Можете увеличить диаметр ластика, чтобы стирать было удобнее.

Теперь повозюкайте по ненужным элементам на картинке. Вы увидите, как шашка начинает проявляться, а цвет исчезать!

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

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

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

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

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

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

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

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

Занимайтесь чем-то новым. Если вы любите фотошоп – обратите внимание на курс Зинаиды Лукьяновой — «Фотошоп с нуля » и овладейте им в совершенстве. Очень быстро у вас появится прибыльное хобби. Не так уж увлечены дизайном? Обратите внимание на то, и создавайте свои проекты.


Если вам понравилась эта статья, и я хотя бы немного заинтересовал вас – подписывайтесь на рассылку. Пусть не сейчас, но дайте себе шанс заняться чем-то новым. Я буду присылать вам свои публикации о том, как можно зарабатывать деньги в интернете.

Возможно, одна из них вас вдохновит на что-то новое и пока неизвестное. Вы поймете, что это интересно и захотите попробовать сами, а потом… кто знает что будет потом?

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

Я искренне желаю вам успехов в ваших начинаниях и надеюсь, что эта наша встреча будет не последней.

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

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

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

Но лучшим решением будет подготовить изображение в Photoshop и сохранить в формате поддерживающим прозрачность фона.

В этом видео уроке подробно опишу 3 способа, а также, какие форматы поддерживают прозрачность.

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

Качество готовой картинки в основном зависит от качества выделения. Постарайтесь максимально точно повторить форму предмета подходящими инструментами лассо.

Если края предмета имеют не четкие края, выделение тоже должно иметь слегка размытые грани. Для этого нужно щелкнуть по выделению правой кнопкой мыши и задать значение «Растушевки». Значение размытия сработает ко всему выделению.

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

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

Основной предмет с высокой четкостью границ можно выделить обычным инструментом «Лассо», а нечеткие края — мягкой кистью в режиме » » (Quick Mask — Клавиша Q), как показано на снимке ниже.

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

Добавление к выделению нечетких областей

А теперь, подробнее о другом способе выделения. Выделите основную часть изображения с четкими границами, затем нажмите — Select/Save Selection…

Снимите выделение и создайте новое, вокруг нечеткой области. Нажмите правой кнопкой мыши — Feather… (Растушевка…) Задайте необходимое значение. Как правило, нескольких пикселей будет достаточно.

Теперь, нажмите — Select/Load Selection… Выберите пункт — Add to Selection (добавить к выделению). Ваше прошлое выделение склеиться с новым, а разные степени размытия сохранятся.

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

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

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

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

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

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

Отсечение фона маской

Этот метод не требует использования программы Photoshop. Непосредственно в программе верстки CorelDRAW или Illustrator вы можете обрисовать предмет контуром, а затем скрыть все, что за его пределами.

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

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

Clipping Mask в Adobe Illustrator

Разместите изображение в редакторе Illustrator и обрисуйте контуром предмет. Затем выделите изображение и контур вместе и нажмите правой кнопкой мыши — Обтравочная маска (Make Clipping Mask). Часть изображения за пределами контура скроется.

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

PowerClip в CorelDRAW

В CorelDRAW есть такой же прием, однако работает он немного иначе. Также нужно обрисовать предмет контуром, а затем, выделить изображение и нажать — Effects/PowerClip/Place inside Frame…. Вместо указателя появится стрелка, которой нужно показать контур.

Контур в CorelDRAW также можно редактировать после создание маски.

Еще в CorelDRAW можно сделать объект прозрачным, не создавая контура, вы можете просто перемещать узлы краев изображения инструментом Shape tool, тем самым меняя его форму. Двойной щелчок по контуру будет создавать новые узлы.

3. Прозрачность режимом наложения

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

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

В Illustrator нужно открыть панель прозрачностей — Window/Transparency. А затем выбрать режим — Multiply (Умножение).

В CorelDRAW возьмите инструмент — Transparency.

В панели параметров инструмента настройте так, как показано на скриншоте ниже:

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

Видео урок: прозрачный фон

Смотрите подробный видео урок, как сделать прозрачный фон в Adobe Photoshop, Illustrator, CorelDraw тремя разными способами:

(Visited 2 704 times, 4 visits today)

58 PNG, дротики в формате PNG, бесплатные картинки с прозрачным фоном

Бесплатные PNG картинки, 58 PNG, дротики в формате PNG, бесплатные картинки с прозрачным фоном, Изображения высокого качества, 300 DPI, Скачать быстро. фев-27-2018

Файл: darts.rar
Разрешение: 300 dpi
Размер файла: 100,9 Mb
скачиваний 15

subscribe 1  PNG      3000*2649 px  размер: 1,66 Mb     (23)      PNG      3000*1903 px  размер: 1,66 Mb     (21)      PNG      3000*3240 px  размер: 1,44 Mb     (13)      PNG      3000*1903 px  размер: 1,44 Mb     (5)      PNG      3000*1918 px  размер: 1,91 Mb     (41)      PNG      3000*1489 px  размер: 1,98 Mb     (10)      PNG      3000*2453 px  размер: 1,69 Mb     (11)      PNG      3000*3000 px  размер: 2,83 Mb     (9)      PNG      3000*3000 px  размер: 1,57 Mb     (4)      PNG      4489*985 px  размер: 2,67 Mb     (2)      PNG      3000*722 px  размер: 1,63 Mb     (9)      PNG      3000*541 px  размер: 1,07 Mb     (6)      PNG      3000*1590 px  размер: 1,62 Mb     (0)      PNG      3000*2252 px  размер: 1,3 Mb     (3)      PNG      3000*3000 px  размер: 2,9 Mb     (4)      PNG      3000*3000 px  размер: 1,28 Mb     (0)      PNG      3000*2252 px  размер: 1,56 Mb     (1)      PNG      3000*2252 px  размер: 902,69 Kb     (2)      PNG      3318*2581 px  размер: 1,45 Mb     (10)      PNG      3000*2648 px  размер: 1,66 Mb     (0)      PNG      3000*1993 px  размер: 3,8 Mb     (2)      PNG      3000*2085 px  размер: 1,72 Mb     (9)      PNG      3000*2140 px  размер: 1,91 Mb     (2)      PNG      3000*1957 px  размер: 1,78 Mb     (0)      PNG      3000*1683 px  размер: 1,02 Mb     (0)      PNG      3000*3000 px  размер: 2,33 Mb     (3)      PNG      3000*3000 px  размер: 2,5 Mb     (5)      PNG      3000*2252 px  размер: 1,5 Mb     (7)      PNG      3000*2259 px  размер: 245,5 Kb     (2)      PNG      3000*1773 px  размер: 2,66 Mb     (1)      PNG      3000*1797 px  размер: 3,56 Mb     (0)      PNG      3000*2400 px  размер: 1,21 Mb     (0)      PNG      3000*4073 px  размер: 1,77 Mb     (0)      PNG      3000*2140 px  размер: 1,91 Mb     (1)      PNG      3000*2460 px  размер: 1,57 Mb     (0)      PNG      3000*910 px  размер: 1,13 Mb     (0)      PNG      3000*3000 px  размер: 2,62 Mb     (0)      PNG      3000*1500 px  размер: 1,91 Mb     (0)      PNG      3000*1837 px  размер: 3,97 Mb     (0)      PNG      3000*1189 px  размер: 1,97 Mb     (0)      PNG      3000*2352 px  размер: 2,61 Mb     (1)      PNG      3000*3688 px  размер: 1,3 Mb     (0)      PNG      3000*3000 px  размер: 1,13 Mb     (0)      PNG      3000*1500 px  размер: 1,3 Mb     (2)      PNG      3000*1500 px  размер: 925,71 Kb     (0)      PNG      3000*1500 px  размер: 1,54 Mb     (0)      PNG      3000*1971 px  размер: 1,38 Mb     (2)      PNG      3000*1971 px  размер: 1,42 Mb     (0)      PNG      3000*1500 px  размер: 1,43 Mb     (0)      PNG      3000*1500 px  размер: 206,59 Kb     (0)      PNG      3000*3000 px  размер: 3,2 Mb     (0)      PNG      3000*5364 px  размер: 471,49 Kb     (0)      PNG      3000*2080 px  размер: 1,93 Mb     (0)      PNG      3000*3000 px  размер: 852,05 Kb     (0)      PNG      3000*3000 px  размер: 852,05 Kb     (0)      PNG      3000*3000 px  размер: 2,21 Mb     (0)      PNG      3000*2965 px  размер: 2,7 Mb     (1)      PNG      3000*1500 px  размер: 266,11 Kb     (0)    

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

Как сделать прозрачный фон на картинке. Как создать PNG с прозрачностью в Adobe Photoshop (версии CC и выше)

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

Инструкция
  • Многое зависит от того, в каком графическом редакторе вы работаете. Простейшие программы, типа стандартного редактора Paint, в принципе не поддерживают прозрачность. Более функциональные программы Paint.net, CorelDraw, Adobe Photoshop (и подобные им) позволяют настраивать прозрачность изображений и поддерживают работу со слоями.
  • Чтобы настроить прозрачность (частичную прозрачность) изображения или какой-либо его части, создавайте новые слои и используйте инструменты своего редактора для настройки отображения слоев. В зависимости от особенностей редактора, возможно, перед сохранением вам придется объединить все слои.
  • Чтобы сохранить изображение в том виде, в каком вы видите его в редакторе, выберите в верхней строке меню пункт «Файл» (File). Из выпадающего меню выберите команду «Сохранить как» (Save as). В открывшемся диалоговом окне укажите директорию для сохранения файла, в поле «Имя файла» (File name) введите имя, под которым вы хотите сохранить файл. В поле «Тип файла» (Format) из выпадающего списка выберите значение PNG(*.PNG) и нажмите на кнопку «Сохранить» (Save).
  • В том случае, если объединение слоев ведет к потере прозрачности, либо сохраняйте изображение, не объединяя слои, либо установите для своего редактора инструмент, позволяющий экспортировать слои в формате.png без потери прозрачности (например, в Adobe Photoshop стандартными инструментами этого не добиться, так как в списке форматов нет расширения.png).
  • Загрузите из сети интернет соответствующий скрипт. В качестве фона установите прозрачный слой, а основное изображение разместите на другом слое. Выберите в верхней строке меню пункт «Файл», в развернувшемся меню — пункт «Сценарии» (Scripts) и команду «Экспортировать слои в файлы» (Export Layers to File).
  • В открывшемся диалоговом окне выберите директорию для сохранения слоев, установите маркер в поле напротив надписи Fast Mode (Don»t remove hidden layers), в поле «Тип файла» выберите формат.png и нажмите кнопку «Выполнить» (Run). Данное действие приведет к тому, что у вас будет сохранено два файла: один «пустой», в другом будет находиться изображение с вашими настройками прозрачности.
  • Для того, чтобы создать прозрачное изображение в формате PNG с помощью бесплатного онлайн сервиса сайт необходимо сначала подготовить изображение. В качестве изображения желательно использовать картинки в форматах PNG или GIF, так как формат JPEG может вносить небольшие искажения в изображение на границе перехода цветов, что помешает сделать качественную заготовку для будущего водяного знака.

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

    Затем следует выбрать в главном меню сайта сайт пункт «Сервисы » и перейти на подпункт «Создание прозрачного изображения в формате PNG «. На открывшейся странице выбираем подготовленный нами ранее файл и нажимаем кнопку «Следующий шаг».

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

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

    Приветствую Вас, дорогие читатели моего блога!

    Недавно мне понадобилось убрать фон с картинки, с фотошопом я не дружу особо. И скажу Вам, что у меня его даже нет на компьютере. (Ну правильно вообще то, зачем мне то, с чем я не умею работать).

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

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

    Покажу Вам на примере, вот такой картинки, убирать мы будем белый фон

    Заходим в онлайн фотошоп. Я использовала вот этот PIXLR

    Выбираем: Загрузить изображение с компьютера.

    Теперь справа в окошке «СЛОИ» надо открыть замочек

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

    Теперь идем на панели, которая находиться слева, выбираем инструмент «волшебная палочка» и толерантность ставим 21.

    Вот вроде бы и все, но меня не устраивает полностью картинка, остались еще остатки фона, я снова кликаю на то место которое хочу убрать. Потом «редактировать»—-«очистить». И так пока не уберете все, что надо.

    Инструкция

    Многое зависит от того, в каком графическом редакторе вы работаете. Простейшие программы, типа стандартного редактора Paint, в принципе не поддерживают прозрачность. Более функциональные программы Paint.net, CorelDraw, Adobe Photoshop (и подобные им) позволяют настраивать прозрачность изображений и поддерживают работу со слоями.

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

    Чтобы сохранить изображение в том виде, в каком вы видите его в редакторе, выберите в верхней строке меню пункт «Файл» (File). Из выпадающего меню выберите команду «Сохранить как» (Save as). В открывшемся диалоговом окне укажите директорию для сохранения файла, в поле «Имя файла» (File name) введите имя, под которым вы хотите сохранить файл. В поле «Тип файла» (Format) из выпадающего списка выберите значение PNG(*.PNG) и нажмите на кнопку «Сохранить» (Save).

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

    Загрузите из сети интернет соответствующий скрипт. В качестве фона установите прозрачный слой, а основное изображение разместите на другом слое. Выберите в верхней строке меню пункт «Файл», в развернувшемся меню — пункт «Сценарии» (Scripts) и команду «Экспортировать слои в файлы» (Export Layers to File).

    В открывшемся диалоговом окне выберите директорию для сохранения слоев, установите маркер в поле напротив надписи Fast Mode (Don»t remove hidden layers), в поле «Тип файла» выберите формат.png и нажмите кнопку «Выполнить» (Run). Данное действие приведет к тому, что у вас будет сохранено два файла: один «пустой», в другом будет находиться изображение с вашими настройками прозрачности.

    Источники:

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

    png — графический формат для интернета

    Из всех применяемых сегодня графических форматов для веб-изображений чаще всего используются три — gif, jpeg и молодой, но очень перспективный формат png. Разработанный в 1995 году, как альтернатива не удовлетворявшему все пользовательские запросы GIF, он предназначен для изображений, использовать которые планируется в интернете. В отличие от gif, формат png поддерживает 24-битные изображения и прозрачность фона без зубчатых краев.

    Основные преимущества формата png -поддержка любых цветов, работа с прозрачными пикселями, эффективный алгоритм сжатия без потери качества изображения. В отличие от gif, который поддерживает только полную прозрачность, png сохраняет также полупрозрачные пиксели (1-99%) за счет Альфа-канала с 256 градациями серого. Встроенная гамма-коррекция позволяет без искажений отображать цвета на любом компьютере, независимо от платформы. Данный формат имеет возможность загружаться с чересстрочной разверткой, причем двойной — по горизонтали и вертикали.

    Формат png поддерживает цветовые модели RGB, Grayskale, Indexed Color и Bitmap без альфа-каналов. Он не предназначен для использования с профессиональной графикой и не обеспечивает поддержку цвета CMYK.

    Как посмотреть файл с расширением png

    Самый простой способ открыть такой файл — два раза щелкнуть по нему левой кнопкой мышки. Даже если на компьютере не установлено никаких дополнительных программ, запустится «Средство просмотра фотографий Windows» и картинка будет открыта. Кроме того, этот формат без проблем открывает графический редактор Paint (в котором можно еще и отредактировать изображение, а также создать новое) и браузер Internet Explorer, входящие в пакет стандартных программ.

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

    Если система не может открыть файл с расширением png, необходимо переустановить стандартные приложения и проверить реестр windows на наличие ошибок.

    Программы для просмотра и редактирования изображений

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

    FastStone Image Viewer — удобное приложение для домашнего пользования. Включает в себя все основные функции обработки изображений. Главное достоинство этой программы — просмотр изображения, открытого на весь экран с увеличением отдельных деталей. Это позволит подробно рассмотреть любую область. Слайд-шоу, сделанное при помощи FastStone, будет иметь расширение exe, поэтому легко запустится даже на самом старом компьютере.

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

    Ashampoo Photo Commander FREE — качественная утилита для просмотра и обработки графики. Имеет такие встроенные эффекты, как сепия, тень и резкость, позволяет кадрировать и вращать изображение. Помимо основных функций, обладает возможностью делать снимки рабочего стола, записывать фотографии на диск CD или DVD, конвертировать изображения и отправлять их по электронному адресу. Кроме того, в ней можно создавать и коллажи.

    Помимо графических редакторов и просмотрщиков изображений, файлы с расширением png открываются в любом современном браузере, а также в Microsoft Office Word.

    Все рассмотренные программы полностью бесплатны. Существует и много других подобных приложений. Среди них можно отметить, например, Honeyview, который позволяет просматривать фотографии прямо из архива zip, 7z или rar, не распаковывая их. Также заслуживает внимания просмотрщик изображений Irfan View. Его функциональность можно значительно увеличить при помощи плагинов, выбор которых будет зависеть от задач, стоящих перед конкретным пользователем.

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

    И так, открываем нашу картинку в фотошопе.

    1. Первое, что нужно сделать — создать у картинки рабочую область с прозрачным фоном. Для этого:
    — в окошке слоёв кликаем два раза на наш слой (с замочком)
    — В повившемся окошке нажимаем ОК

    Замочек должен исчезнуть

    Если фон однотонный:
    Выбираем инструмент «Волшебная палочка » — это очень гибкий инструмент для выделения нужной области. Наша задача выделить весь фон, кроме рисунка. Для этого подгоняем настройки волшебной палочки (параметр допуск ), пока не получим нужный результат. Так-же пользуемся клавишей Shift, чтобы выделить область помимо уже выделенной. Нажимаем Del и выделенная облась удаляется.

    Если фон разноцветный:
    Используем инструмент «Быстрое выделение «. Тут наша задача выделить не фон, а сам объект, который должен остаться. Нажимаем до тех пор, пока не выделится нужная область. Если выделилось лишнее, зажимаем Alt и минусуем облась. Посмотреть результат можно клавишей Q.
    Когда выделение готово, копируем его Ctrl+C. Создаем новый документ с прозрачным фоном (Ctrl+N) и вставляем туда объект Ctrl+V.

    3 . Если на рисунке осталось что-то лишнее, используем инструмент «Ластик «, просто затираем лишний фон.

    4 . Сохраняем изображение для Web (Alt+Shift+Ctrl+S) выбираем формат GIF либо PNG (в других наш прозрачный фон превратится в белый).

    Полезное видео в тему:

    Сделайте изображение прозрачным — служба поддержки Office

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

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

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

    1. Дважды щелкните изображение, и когда появится Работа с рисунками , щелкните Инструменты работы с рисунками Формат > Цвет .

    2. Щелкните Установить прозрачный цвет и, когда указатель изменится, щелкните цвет, который хотите сделать прозрачным.

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

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

    Как сделать изображение прозрачным 3 способами [в том числе PNG и GIF]

    24 июня 2021 г. • Проверенные решения

    Если вы создаете что-то или добавляете изображение в свое видео, нежелательный фон на изображении может быть самой большой раздражительностью. Заманчиво, что попытка сделать изображение прозрачным без правильных инструментов может быть раздражающей и отнимающей много времени задачей.К счастью, вам не о чем беспокоиться, так как мы пройдемся по процессу, чтобы сделать изображение прозрачным, используя мощные функции манипулирования альфа-каналом Wondershare Filmora9. И мы также изучим два других простых метода получения прозрачного фона путем удаления существующего фона изображения.

    Часть 1: Все об альфа-канале

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

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

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

    Часть 2: Сделайте изображение прозрачным с помощью Wondershare Filmora9 Video Editor

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

    Давайте посмотрим, как сделать изображение прозрачным с помощью Wondershare Filmora9:

    • Загрузите и установите Wondershare Filmora9 на свой компьютер.Он поддерживает как Windows, так и Mac.

    • Теперь откройте Wondershare Filmora9 и выберите Импорт-импорт файлов мультимедиа в раскрывающемся списке, чтобы загрузить исходное изображение в библиотеку мультимедиа.

    • Добавьте импортированное изображение на шкалу времени filmora9. Вы можете щелкнуть изображение правой кнопкой мыши и выбрать опцию «Вставить» или просто перетащить изображение на шкалу времени.

    • Здесь начинается настоящая работа.Дважды щелкните изображение на временной шкале, и откроется вкладка с подробными настройками прямо над временной шкалой. Прокрутите список настроек и найдите «Chroma Key» settings.
    • Включите хроматический ключ, и вы увидите, что изображение станет прозрачным. Зеленый цвет по умолчанию является белым цветом фона изображения. Или вы можете просто щелкнуть значок «Выбор цвета» справа от выбранного цвета, перейти в раздел, который хотите сделать прозрачным, и щелкнуть один раз.

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

    • Наконец, вы можете наложить прозрачное изображение на свое видео и нажать OK , чтобы сохранить настройки. Затем вы можете добавить это прозрачное изображение к своему видео. И нажмите «Экспорт», чтобы экспортировать все видео.

    Примечание:

    Чтобы сделать изображение прозрачным, Wondershare Filmora9 поддерживает только форматы изображений PNG и GIF.

    Часть 3: Сделайте изображение прозрачным с помощью онлайн-фоторедактора

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

    • Щелкните Здесь , чтобы открыть онлайн-инструменты PNG в окне браузера.

    • Нажмите на серый раздел, чтобы импортировать изображение PNG с вашего устройства.

      • Как только вы загрузите изображение на платформу, вы получите прозрачный PNG-вывод. У вас есть только параметры создания прозрачности PNG, где вы можете выбрать цвет фона и цветовой тон.

    Часть 4: Сделайте изображение прозрачным с помощью PowerPoint

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

    Шаги, чтобы сделать изображение прозрачным с помощью PowerPoint:

    • Откройте презентацию PowerPoint с изображением, которое нужно сделать прозрачным, и перейдите к слайду с изображением.
    • Нажмите на изображение, чтобы выбрать его. Когда вы выбираете изображение, новая вкладка будет добавлена ​​в меню вкладки PowerPoint

    • Перейдите к формату Picture Tools Format или Picture Format в Mac и выберите опцию Remove Background .

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

    • Нажмите кнопку Сохранить изменения , чтобы применить изменения.Вы получите прозрачное фоновое изображение.

    Заключение

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

    Прочтите больше, чтобы получить: Лучшие средства для удаления фонового изображения с видео

    Бенджамин Аранго

    Бенджамин Аранго — писатель и любитель всего видео.

    Подписаться @Benjamin Arango

    Как сделать логотип с прозрачным фоном

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

    Создайте свой собственный логотип с помощью программы для создания логотипов Turbologo. Это занимает менее 5 минут и не требует навыков проектирования.

    Перейти в Logo Maker

    Нанесение логотипа с прозрачным фоном

    Чаще всего такие логотипы встречаются на сайтах компаний, страницах в социальных сетях, блогах о товарах или рекламных постах.

    Основная причина, по которой компании выбирают логотипы с прозрачным фоном, заключается в их «гибкости» — такие логотипы легко вписываются в дизайн любого веб-сайта, красиво сочетаются с любой цветовой палитрой, используемой на веб-странице, и вполне гармонируют с любыми другими элементами.

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

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

    Форматы изображений для логотипов с прозрачным фоном

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

    PNG

    Это, наверное, самый популярный вариант, который по сути представляет собой формат растрового изображения, позволяющий сохранять сжатые изображения с минимальными потерями качества.Он был изобретен в конце ХХ века, а именно в 1996 году, как популярная тогда неофициальная (пиратская) версия GIF.

    Вероятно, он стал популярным благодаря удобству и широкому спектру возможностей, которыми он предоставлял редакторы изображений. Еще одно преимущество: PNG поддерживается всеми современными программами для редактирования (Adobe Photoshop, Adobe Lightroom, Illustrator и т. Д.).

    Более 80% современных логотипов были созданы в этом формате и использовались на веб-страницах многих успешных предприятий.

    GIF

    Этот формат уже упоминался здесь немного выше. Старый GIF был вытеснен PNG, но все еще иногда используется. Вероятно, наиболее популярное его использование — когда вы публикуете мемы в социальной сети. Формат был разработан еще в 1987 году. Его нельзя назвать самым удобным форматом логотипа, но есть несколько способов сделать фон прозрачным с его помощью.

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

    SVG

    Векторный формат SVG имеет одну функцию, которая позволяет устанавливать уровень прозрачности фона, используя полную непрозрачность (в основном, изменение чисел, которые могут быть интересны программистам, но не обычным пользователям). Формат был создан на основе XML (расширяемого языка разметки), что упрощает размещение логотипа в этом формате на веб-сайте.

    Отметим, что SVG чаще всего используют настоящие профессионалы, дизайнеры и программисты. Если вы обычный пользователь с базовыми знаниями о том, как работает компьютер (как и большинство из нас, верно?), То для вас существуют менее сложные форматы.

    Несколько шагов к прозрачности

    Обычно все логотипы создаются с прозрачным фоном (при заказе у фрилансера или профессионального графического дизайнера), если вы заранее не согласились заполнить его каким-либо цветом.А если получился цветной логотип, не расстраивайтесь сразу. Хотите сделать его прозрачным? Добро пожаловать в знаменитый фотошоп! Есть много онлайн-видео, в которых рассказывается, как обрезать фон и сохранить результат в одном из форматов, о которых мы упоминали выше.

    Если вам так повезло, что у вас есть файл PSD (Adobe Photoshop), все намного проще. Откройте файл, отметьте все слои, кроме фона, нажав CTRL / CMD. Затем нажмите CTRL + C, создайте новый проект и нажмите CTRL + V.Теперь у вас есть прозрачный логотип, который вы хотели. А при желании вы можете редактировать цветовую палитру и добавлять недостающие элементы — YouTube с большим количеством обучающих видео к вашим услугам.

    Что делать, если у меня нет Photoshop или другого редактора?

    Вы хотите создать логотип и понимать, насколько он важен и необходим. Но, к сожалению, вы не пользуетесь никаким графическим редактором и не хотите платить фрилансерам за такую ​​услугу? Хотите сделать это сами, но не знаете как?

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

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

    Часто задаваемые вопросы

    Что такое логотип с прозрачным фоном?

    Краткое определение: Прозрачный логотип — это логотип с прозрачным фоном.Нет фона. PNG — самый популярный тип файлов для логотипов с прозрачным фоном. Эти файлы можно использовать для отображения миллионов цветов в файлах небольшого размера.

    Что означает прозрачный фон?

    Прозрачный означает изображение или графику. Четкое изображение может иметь такой же эффект, как и любое другое изображение. Одно и то же изображение выглядит по-разному на каждом фоне, но идентично.

    Я продуктовый и графический дизайнер с 10-летним стажем. Пишем о брендинге, создании логотипов и бизнесе.

    Как преобразовать фон изображения в прозрачный в PowerPoint

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

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

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

    Как преобразовать фон изображения в прозрачный в PowerPoint

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

    Чтобы сделать все изображение прозрачным в PowerPoint для Windows:

    1. Перейдите к презентации PowerPoint.
    2. Нажмите «Вставить», затем «Фигуры».
    3. Определитесь с формой из галереи.
    4. Затем нарисуйте фигуру примерно того же размера, что и изображение, которое вы собираетесь в нее вставить.
    5. Щелкните фигуру, затем выберите «Формат», «Контур фигуры», «Без контура».
    6. Щелкните фигуру правой кнопкой мыши и выберите «Форматировать фигуру».
    7. На панели «Формат фигуры» выберите значок «Заливка», затем «Текстура» или «Заливка рисунка».
    8. Нажмите кнопку «Вставить».
    9. В диалоговом окне «Вставить изображение» найдите файл изображения, который вы хотите вставить.
    10. Выберите изображение, затем нажмите кнопку «Вставить».
    11. На панели «Формат фигуры» используйте ползунок «Прозрачность» для изменения изображения.

    12. Кроме того, вы можете вставить число в поле рядом с ползунком: 0% — настройка по умолчанию, отображение полностью непрозрачно; 100% отображает полностью прозрачную.

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

    Чтобы сделать область фонового изображения прозрачной:

    1. Запустите PowerPoint и откройте презентацию.
    2. Дважды щелкните изображение, затем в «Работа с рисунками» выберите «Формат инструментов для рисунков», затем «Цвет».
    3. Выберите «Установить прозрачный цвет», затем, когда указатель изменится, щелкните цвет, который хотите сделать прозрачным.
    4. Если вы хотите отменить изменения цвета в группе «Настроить», выберите «Сбросить изображение».

    Чтобы сделать все изображение прозрачным в PowerPoint для macOS:

    1. Перейдите к презентации PowerPoint.
    2. Щелкните изображение, которое хотите сделать прозрачным.
    3. Щелкните вкладку «Формат изображения» или «Формат фигуры».
    4. Выберите «Прозрачность».
    5. В параметрах прозрачности щелкните предустановку или, чтобы получить другие варианты, выберите «Параметры прозрачности изображения» внизу.
    6. Панель «Формат изображения» откроется справа.
    7. Под «Прозрачность изображения» перетащите ползунок вправо, чтобы установить желаемый процент прозрачности, или введите значение в поле.
      • Процент прозрачности изменяется от значения по умолчанию 0% для полной непрозрачности до 100% для полной прозрачности.

    Чтобы сделать область фонового изображения прозрачной:

    1. Перейдите к презентации PowerPoint.
    2. Щелкните изображение, для которого нужно изменить прозрачность цвета.
    3. В категории «Формат изображения» нажмите «Цвет», затем «Установить прозрачный цвет».
    4. Щелкните цвет на изображении, который вы хотите сделать прозрачным.

    Как сделать фигуру прозрачной в PowerPoint

    1. Откройте PowerPoint.
    2. Нажмите «Вставить», затем «Фигуры».
    3. В раскрывающейся галерее выберите фигуру, которую нужно нарисовать до желаемого размера.
    4. Щелкните фигуру правой кнопкой мыши и выберите «Форматировать фигуру».»
    5. На панели откройте раздел« Заливка ».
    6. Затем переместите ползунок «Прозрачность» вправо, чтобы установить желаемую степень прозрачности.

    Как использовать инструмент «Удалить фон» в PowerPoint

    Чтобы удалить фон фотографии с помощью инструмента «Удалить фон»:

    1. Откройте PowerPoint и выберите свою фотографию.
    2. Щелкните «Работа с рисунками», вкладку «Формат», затем «Удалить фон».
    3. Из инструментов «Удаление фона»:
      • Выберите «Отметить области для сохранения», чтобы нарисовать разделы, которые нужно сохранить.
      • Выберите «Отметить области для удаления», чтобы обвести участки, которые нужно удалить.

    4. После этого нажмите «Сохранить изменения».
    5. Чтобы сохранить изображение отдельно, щелкните его правой кнопкой мыши и выберите «Сохранить как изображение».

    Прозрачность презентации в PowerPoint

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

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

    Как создавать прозрачные изображения для Tableau

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

    PNG — правильный формат изображения для прозрачных изображений.

    Иногда изображение требует редактирования, чтобы сделать его пригодным для использования. Часто простого «Сохранить как PNG» недостаточно. В этом может помочь PowerPoint.

    Используйте PowerPoint для создания прозрачных изображений для Tableau

    Для таких, как я, не являющихся естественными редакторами изображений, PowerPoint — замечательная вещь.

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

    Работая с изображениями, я обнаружил некоторые из новых (я думаю) функций PowerPoint, которые значительно упрощают редактирование изображений.

    Удалить фон в Powerpoint

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

    Удалите желтый фон с помощью PowerPoint.

    Для начала скопируйте изображение в слайд PowerPoint.

    Первое, что я хотел сделать, это убрать ярко-желтый цвет.

    Powerpoint имеет параметр «Удалить фон» в меню «Формат изображения».

    Меню «Формат изображения»

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

    Удаление фона удаляет пурпурный цвет.

    В меню «Удаление фона» есть инструменты, позволяющие пометить области для сохранения и пометить области для удаления.

    Меню удаления фона

    Я могу использовать их и сохранить верхнюю часть конверта, просто щелкнув фиолетовый треугольник в верхней части конверта.

    После того, как детали будут отмечены для сохранения / удаления, щелкните Сохранить изменения.

    Результат с помощью нескольких щелчков мышью:

    Конверт с удаленным цветом фона

    Другие бесплатные альтернативы удаления фона

    Вы также можете попробовать онлайн-альтернативы, например:

    Remove.bg

    Lunapic

    Gimp.org ( намного эффективнее, чем только удаление фона, но также и более сложный)

    Перекрасить в PowerPoint

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

    И снова PowerPoint приходит на помощь.

    Еще одна опция в меню «Формат изображения» — «Цвет» (да, намеренное американское написание для соответствия PowerPoint).

    Щелкните «Цвет», и PowerPoint изменит его цвет, предложив множество альтернативных вариантов.

    Раздел «Перекрасить» предлагает несколько вариантов цвета.

    Мне нравится синий, поэтому выберите один из вариантов синего. Это дает следующее:

    Отредактированное изображение с синим конвертом и голубой бумагой

    В PowerPoint его легко сохранить как PNG, что означает прозрачность в Tableau.

    Щелкните правой кнопкой мыши изображение на слайде PowerPoint и выберите «Сохранить как рисунок».

    Идеи дизайна для PowerPoint тоже отличные

    Мне также были нужны изображения для веб-сайта. Я подумал, что было бы интересно показать некоторые работы Tableau в виде изображения.

    В итоге коллажи не попали на веб-сайт, но ниже приведен пример того, что предлагали Идеи дизайна.

    Коллаж, созданный одним щелчком мыши с использованием идей дизайна PowerPoint

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

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

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

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

    Design Ideas содержит ряд предложений

    Это экономит много времени и усилий при проектировании.

    PowerPoint отлично подходит для настройки изображений.

    В заключение, PowerPoint значительно упрощает создание и редактирование изображений. Если вам нужно изменить изображения для панелей управления Tableau, это первое место, к которому я предлагаю обратиться.

    3 простых способа сделать фон вашего логотипа прозрачным в формате PNG — блог о дизайне логотипов

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

    Что такое прозрачный логотип и как его создать? Logaster поможет создать прозрачные индивидуальные логотипы для бренда в Интернете, прочтите статью, чтобы узнать, как создать логотип самостоятельно за несколько минут:
    https://www.logaster.com/blog/transparent-logo/

    Что такое прозрачный файл PNG?

    PNG относится к переносимой сетевой графике, это популярный формат изображений, поддерживающий прозрачный фон.На самом деле он создан для улучшения GIF (Graphics Interchange Format), который является еще одним форматом изображений, также поддерживающим прозрачный цвет. Однако PNG имеет несколько преимуществ перед GIF для веб-приложений, таких как поддержка прогрессивного отображения и лучшее сжатие, чем GIF.

    Метод 1. Сделайте фон вашего логотипа прозрачным с помощью PhotoShop

    Самый распространенный инструмент, используемый для обработки изображений, — это Photoshop от Adobe. Если на вашем компьютере установлен PhotoShop, просто следуйте простым шагам, показанным в следующем видео.

    Метод 2: Прозрачный логотип с помощью MS-Paint

    Microsoft Paint входит в стандартную установку MS Windows и может помочь вам сделать прозрачным фон вашего логотипа. Просто запустите программу Paint и выполните следующие несколько шагов:

    Шаг 1 : Откройте файл логотипа, который нужно сделать прозрачным, затем дважды щелкните его, чтобы он открылся в рабочей области Paint.
    Шаг 2: Увеличьте масштаб изображения логотипа, которое вы хотите сделать прозрачным.
    Шаг 3: Откройте меню «Изображение» в верхней части экрана и снимите флажок «Нарисовать непрозрачным».
    Шаг 4: Щелкните инструмент «Выбор произвольной формы» и нарисуйте линию вокруг области, которую нужно удалить с фотографии, сделав эту часть изображения прозрачной. Когда появится пунктирный прямоугольник или квадрат, нажмите клавишу «Удалить», чтобы сделать эту часть изображения прозрачной. Повторяйте этот процесс, пока не сделаете весь фон логотипа прозрачным.
    Шаг 5: Сохраните файл, щелкнув «Файл», затем «Сохранить как.»И сохраните файл в формате PNG.

    Метод 3: Мгновенное удаление фона с помощью clippingmagic

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

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

    Сохранить

    Сохранить

    Сохранить

    Сохранить

    Сохранить

    Создание изображений с прозрачным фоном

    Быстрые ссылки на процедуры на этой странице:

    Создание изображений с прозрачным фоном

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

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

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

    Для получения информации о формате файла GIF см. «Выбор формата файла, совместимого с Интернетом».

    Вы можете создать GIF с прозрачным фоном для использования на веб-странице.

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


    Для сохранения изображения GIF с прозрачным фоном

    1.

    Щелкните Файл Сохранить как .

    2.

    Введите имя файла в поле Имя файла .

    3.

    Выберите место для сохранения изображения.

    4.

    Выберите формат файла GIF из списка Сохранить как тип .

    6.

    В диалоговом окне Преобразовать в с палитрой настройте цветовую палитру и параметры.

    Для достижения наилучших результатов выберите None из списка Dithering и Websafe из списка Palette .

    8.

    В диалоговом окне Экспорт GIF включите один из следующих параметров:

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

    Можно также

    Пример цвета изображения, чтобы сделать его прозрачным

    В диалоговом окне Экспорт в GIF щелкните инструмент Пипетка и в первом окне предварительного просмотра щелкните цвет фона.

    Загрузить изображение в веб-браузер как чересстрочный GIF

    Установите флажок Чересстрочное изображение .

    Предварительный просмотр прозрачной области изображения

    Щелкните Preview . Прозрачный фон отображается в виде клетчатой ​​области. Прозрачные замаскированные области отображаются сплошным цветом.

    Создание изображений с прозрачным фоном

    .

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

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