Содержание

Растровый формат PNG | SEO-портал

PNG (Portable Network Graphics — портативная сетевая графика) — популярный в интернете растровый графический формат файлов, применяющий технологию сжатия без потерь и поддерживающий полупрозрачность (альфа-канал).

Формат PNG

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

Сделать картинку в формате PNG можно с помощью любого графического редактора (в том числе Paint и Photoshop).

Как сохранить картинку в формате PNG в Paint?

Процесс сохранения в формат PNG с помощью редактора Paint в Windows 10:

  1. Откройте файл изображения в Paint.

    Программа поддерживает изображения в форматах BMP, TIFF, PNG, GIF, JPEG.

  2. Кликните по вкладке Файл.

    Откроется контекстное меню.

  3. Выберите Сохранить как → Изображение в формате PNG.

    Откроется модальное окно выбора папки и названия для файла.

  4. Определите папку, введите название файла и нажмите Сохранить.

Как сохранить PNG-файл в Photoshop?

Процесс сохранения изображений в формате PNG с помощью редактора Adobe Photoshop CC 2015:

  1. Откройте файл изображения в Photoshop.

    Программа поддерживает изображения в самых разных графических форматах.

  2. Кликните по вкладке Файл.

    Откроется контекстное меню.

  3. Выберите Сохранить для Web (по умолчанию клавиши Alt + Ctrl + Shift + S).

    Откроется модальное окно сохранения.

  4. В правом верхнем углу диалогового окна из выпадающего списка выберите PNG-8 (палитра до 256 цветов) или PNG-24 (максимальная палитра цветов).

    Откроются дополнительные настройки формата PNG. Для PNG-24:

    Дополнительные настройки для PNG-8:

    • модель редукции цвета (способ определения цветов в палитру),
    • количество цветов в палитре,
    • определение модели дизеринга (способа сглаживания цветовых переходов),
    • степень дизеринга (0-100%),
    • цвет фона (при наличии прозрачности),
    • модель дизеринга прозрачности,
    • web-цвета (не актуально).
  5. Произведите необходимые настройки.

    Изменение изображения в зависимости от выставленных настроек можно контролировать в левой части окна.

  6. Кликните Сохранить….

    Откроется модальное окно выбора папки и названия для файла.

  7. Определите папку, введите название файла и нажмите Сохранить.

Как сохранить PNG-файл в Illustrator?

Программа Illustrator является графическим редактором компании Adobe, предназначенным для работы с векторной графикой. Функционал программы схож с функционалом Photoshop — для сохранения изображений в PNG-формате в «иллюстраторе» используйте аналогичную функцию «Сохранить для Web»:

  1. Откройте или создайте изображение в Adobe Illustrator.

    Программа поддерживает изображения в самых разных графических форматах.

  2. Кликните по вкладке Файл.

    Откроется контекстное меню.

  3. Выберите Сохранить для Web (по умолчанию Alt + Ctrl + Shift + S).

    Откроется модальное окно сохранения.

  4. В правом верхнем углу диалогового окна из выпадающего списка выберите PNG-8 (палитра до 256 цветов) или PNG-24 (максимальная палитра цветов).

    Откроются дополнительные настройки формата PNG (описаны выше в процессе сохранения PNG через «фотошоп»).

  5. Произведите необходимые настройки.

    Изменение изображения в зависимости от выставленных настроек можно контролировать в левой части окна.

  6. Кликните Сохранить….

    Откроется модальное окно выбора папки и названия для файла.

  7. Определите папку, введите название файла и нажмите Сохранить.

Алгоритм сжатия PNG

Главной отличительной особенностью формата PNG является сжатие без потерь данных: в зависимости от компрессора (сжимающей программы) можно уменьшить «вес» изображения в определённой степени.

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

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

Уменьшить размер файла

PNG можно с помощью ограничения цветовой палитры.

В зависимости от глубины цвета изображения в формате PNG, применяемые на веб-ресурсах, делят на 2 вида:

  1. PNG-8

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

  2. PNG-24

    Использует 24-битную глубину цвета и 8-битный альфа-канал (1 677 7216 цветов + канал прозрачности).

Экспортируя изображение из полноцветного PNG-24 в индексированный PNG-8 можно добиться значительного уменьшения размера файла («веса» изображения):

В приведённых выше примерах можно заметить значительную разницу в размере файлов в зависимости от глубины цвета. Также очевидна нехватка цветов: на 256-цветном варианте можно рассмотреть «гранулы», которые становятся значительно более заметны в 128-цветном варианте из-за явного недостатка цветов в палитре.

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

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

Применяйте PNG-8 только если максимума в 256 цветов будет достаточно для изображения.

В случаях, когда картинка использует до 256 цветов, ограничение палитры может существенно уменьшить «вес» изображения, ни как не отражаясь на качестве его детализации:

Зависимость «веса» от глубины цвета для PNGЗависимость «веса» от глубины цвета для PNG

Преимущества формата PNG

  • Cжатие без потерь в качестве детализации.
  • Нет ограничений в глубине цвета.
  • Применение индексированной палитры (8 бит).
  • Регулировка размера файла в зависимости от палитры.
  • Применение канала прозрачности (альфа-канала).

Недостатки формата PNG

Рекомендации по применению формата

При использовании и оптимизации изображений в формате PNG для вашего сайта руководствуйтесь следующими рекомендациями:

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

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

Чем открыть файл в формате PNG на компьютере?

Открыть файлы в формате PNG можно с помощью любых программ для просмотра изображений (в том числе стандартные приложения

Windows), всех современных интернет-обозревателей (браузеров), а также векторных и растровых графических редакторов.

Какой программой можно открыть файл PNG?

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

  • Microsoft Paint,
  • GIMP,
  • Adobe Photoshop,
  • Adobe Illustrator,
  • CorelDRAW,
  • Corel Photo Paint,
  • и др.
Как открыть файл PNG в «фотошопе»?

Чтобы открыть любое изображение в формате PNG (а также в любом другом графическом формате) в Photoshop откройте программу и воспользуйтесь функцией Файл → Открыть… (клавиши Ctrl + O). Таким же способом это можно сделать в любом другом графическом редакторе.

Как сохранить (создать) PNG-файл?

Ответ здесь.

Как изменить формат изображения на PNG?

Изменить формат картинки (фотографии или рисунка) на PNG можно с помощью функции экспорта в графических редакторах или через онлайн-конвертеры.

Например, программа Microsoft Paint позволяет перевести картинку в формат PNG с помощью функции «Сохранить как» следующие графические форматы: BMP, TIFF, PNG, GIF.

Как сжать изображение в формате PNG?

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

) или воспользоваться онлайн-компрессором tinypng.com.

Как уменьшить (изменить) размер файла в формате PNG?

Уменьшить размер PNG-файла можно следующими способами:

  1. изменив глубину цвета с 24-х до 8-бит,
  2. уменьшив количество индексированных цветов при 8-битной глубине цвета,
  3. отключив альфа-канал прозрачности,
  4. удалив мета-данные.

Все эти действия разом можно совершить при помощи онлайн-компрессора tinypng.com или частично с помощью функции «Сохранить для Web» в графических редакторах от компании Adobe (Photoshop и Illustrator).

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

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

В этой статье мы расскажем, как сделать прозрачность в Фотошопе.

Первый шаг – это создание файла. Для этого откройте Adobe Photoshop и в меню «Файл» (File) вверху страницы выберите «Создать» (New).

Затем в появившемся окне «Новый документ» (New Document) создайте файл нужного размера, и убедитесь, что разрешение документа составляет 72 пикселя на дюйм (поскольку файл предназначен для использования в веб). А также, что вы выбрали значение «Прозрачный» (Transparent) в выпадающем списке «Содержимое фона» (Background Contents).

*Перед тем, как сделать PNG с прозрачностью в Фотошопе, нужно уточнить, что в этом примере мы создаем изображение для загрузки в качестве фона для сайта, поэтому размер документа задан следующим образом: ширина 3000 пикселей, высота 1730 пикселей, что является рекомендуемыми размерами для загрузки HD изображений:


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

Затем в панели «Слои» (Layers) убедитесь, что работаете на прозрачном слое, а не на фоновом:


После того, как вы завершили создание и готовы сохранить прозрачное изображение, в зависимости от используемой версии Photoshop, в меню «Файл» (File) вы можете использовать один из возможных вариантов:

Сейчас мы расскажем, как сделать прозрачность картинки в Фотошопе, который вышел раньше CC 2015. В этих версиях используют метод «Сохранить для Web» (Save for Web & Devices), чтобы сохранить и оптимизировать PNG изображения для использования в вебе. Чтобы воспользоваться этим методом, просто зайдите в меню «Файл» (File), и далее – «Сохранить для Web» (Save for Web & Devices):


Затем в появившемся окне выберите PNG-24 из выпадающего меню возможных значений, а потом убедитесь, чтобы выбраны опции «Прозрачность» (Transparency) и «Преобразовать в sRGB» (Convert to sRGB). Это подтверждает, что изображение будет содержать прозрачный фон и его цветовой режим будет преобразован в sRGB, рекомендованное цветовое пространство для веб.


Поля «Размер изображения» (Image Size) автоматически заполняются значениями, которые вы задали, когда создавали файл. Но если вы хотите изменить размер файла перед сохранением, то можно сделать это сейчас.

Чтобы сохранить изображение, нажмите кнопку «Сохранить» (Save) внизу окна.

Перед тем, как сделать прозрачность фото в Фотошопе, нужно знать, что с версии CC 2015 опция «Сохранить для Web» (Save for Web & Devices) в меню «Файл» (File) помечена как Legacy (устаревшая). И замещена на новую опцию «Экспорт» (Export), которая предлагает идентичную функциональность с более быстрым сохранением в файле меньшего размера и в лучшем качестве. Чтобы воспользоваться опцией «Экспорт», нажмите меню «Файл» (File), а затем — «Экспортировать как» (Export As).

Примечание: Adobe по-прежнему предлагает опцию «Сохранить для Web» (Save for Web & Devices) в Photoshop CC 2015, и она доступна через меню Файл > Экспорт (File > Export) или при использовании комбинации клавиш Command+Option+Shift+S (для Mac) или Ctrl+Alt+Shift+S (для ПК):


Затем в появившемся окне выберите PNG из выпадающего меню «Формат» (Format) и убедитесь, что выбраны опции «Прозрачность» (Transparency) и «Преобразовать в sRGB» (Convert to sRGB).

Поля «Размер изображения» (Image Size) и «Размер холста» (Canvas Size) должны автоматически заполниться значениями, которые вы задали, когда создавали файл. Но при желании можно изменить эти параметры перед тем, как сделать эффект прозрачности в Фотошопе:


Когда закончите, нажмите «Экспортировать все» (Export All).

Данная публикация представляет собой перевод статьи «How can I create a PNG with transparency in Adobe Photoshop (CC and higher)?» , подготовленной дружной командой проекта Интернет-технологии.ру

Из JPG в PNG

Сервис позволяет произвести преобразование (конвертировать) из формата JPG в формат PNG

JPEG – это наиболее распространенный и популярный формат растрового изображения. Свое название форма получил по аббревиатуре от названия организации-разработчика Joint Photographic Experts Group. Файлы такого формата используются сегодня во всех цифровых фотоаппаратах и камерах. Они имеют хорошую степень сжатия и поддерживают глубину цвета в 24 бит. Поскольку такое сжатие существенно уменьшают размер изображения практически без потери качества, формат JPEG широко распространен в Интернете. Однако чем сильнее сжатие, тем хуже качество. К тому же формат JPEG не поддерживает опцию прозрачности.

PNG – это формат растрового изображения, разработчиком которого является компания PNG Development Group. Название PNG – это аббревиатура от Portable Network Graphic. Этот формат изображений используется, прежде всего, в Интернете для размещения на веб-страницах, поскольку файлы PNG применяют сжатие по алгоритму Deflate, не теряя качества. Разработка данного формата была предпринята для того, чтобы заменить формат GIF, к которому было немало претензий. Качество изображения и характеристики у PNG оказались намного лучше, однако в отличие от GIF он не поддерживает анимацию и использует палитру CMYK.

Отзывы

отлично
good
збс
Очень долго конвертит, через ФШ быстрее сделать
Топовый конвертер, очень быстро, без всего лишнего. Лучший среди остальных!
Ваще супер!
Спасибо! Супер!
круто
Делаю рекламы и иногда файл с фото скачивается не в том формате… Лучший сайт для решения этой проблемы.
Делаю рекламы и иногда файл с фото скачивается не в том формате… Лучший сайт для решения этой проблемы

Другие сервисы

Как сделать формат PNG для картинки

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

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

Как сделать формат PNG с помощью стороннего программного обеспечения

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

Давайте рассмотрим самый популярный фоторедактор Adobe Photoshop, который может помочь в достижении данной задачи. Следуйте инструкции представленной ниже.

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

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

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

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

Заключение

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

Онлайн конвертер в PNG (JPG в PNG, GIF в PNG, BMP в PNG и др.)

Настройки для формата PNG Глубина цвета: 64 (True color, RGBA)48 (True color, RGB)32 (True color, RGBA, transparent)24 (True color, RGB)8 (Indexed)4 (Indexed)1 (Mono) bpp
степень сжатия 0 — None1 — Lowest23456789- Highest Обратите внимание! PNG конвертер имеет скрытые настройки, не доступные в выбранном формате. В поле «настройки для формата PNG» вы не видите часть настроек, это связано с тем, что они не доступны при указанном сочетании. Меняя глубину цвета на индексированные цвета (8 бит и меньше) вы получите доступ к настройкам для более гибкой настройки индексных форматов.

О формате

Формат хранения сжатых растровых изображений PNG является одним из основных в веб-графике. Полное название Portable Network Graphics (переносимая сетевая графика). Создан в 1995 году на базе GIF. От предшественника выгодно отличается тем, что распространяется бесплатно, используется свободно, без лицензии. Этот фактор сразу увеличил его востребованность.

После JPG формат PNG является вторым по популярности среди всех графических форматов. Слово Network указывает на его применение. PNG создавался чтобы файлы с таким расширением легко распознавались разными операционными системами и без искажения открывались браузерами. Формат используют для редактирования графики, передачи изображений по сети и отображения картинок, фотографий, графических элементов на страницах сайтов и облачных Drive-хранилищ. 

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

Преимущества.

Хранит сжатую графическую информацию, поэтому мало весят по сравнению с несжатыми: например, с BMP. Для открытия и просмотра содержимого изображений вам точно не придётся искать и устанавливать на ПК различные программы. Поддержка данного формата есть во всех ОС и во всех программах, которые умеют работать с графикой, если это конечно не специализированные программы. Например, Windows по умолчанию файлы открываются «Просмотр фотографий». А, например, просто перетащив изображение в браузер — он его покажет. 

Достоинства PNG:

  • Благодаря алгоритму сжатия Deflate, размер файлов можно уменьшать многократно, при этом качество не теряется. (Для справки: этот алгоритм используют архиваторы ZIP для компрессии данных).
  • Глубина цветопередачи от 1 до 64 бит позволяет задать оптимальный размер изображения: монохромное, полутоновое с оттенками серого, индексированное цветное и полноцветное.
  • Многоуровневая прозрачность — 8-битный альфа-канал, а это значит, что у пользователя есть 256 уровней от максимальной непрозрачности до полной прозрачности. Даже подобной возможности нет в JPEG.
  • Встроенная программная коррекция палитры позволяет вшить определённые параметры, чтобы картинка на любом дисплее выглядела одинаково — такой, как её создал автор (авторские права также указывают внутри метаданных).
  • Большинство графических программ поддерживает этот формат. Скриншоты, сделанные разными приложениями обычно сохраняются с расширением PNG.

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

Отличия от других форматов

Если сравнивать PNG с другими графическими форматами, в чём-то он уступает, в чём-то их превосходит.

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

Если вам нужно выполнить преобразование JPG в PNG, TIFF в PNG или BMP в PNG вы можете это сделать без каких либо ограничений на нашем сервисе.

Применение формата

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

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

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

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

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

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

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

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

Оптимизация PNG онлайн.

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

Конвертер PNG файлов онлайн, бесплатное преобразование изображений в PNG

Расширение файла .png
Категория файла images
Описание PNG – растровый графический формат, разработанный в качестве альтернативы GIF, который обладал коммерческой лицензией. В его основе находятся лучшие возможности предшественника, в том числе сжатие без потерь и поддержка прозрачного фона. Технология PNG обеспечивает сохранение всех этапов редактирования и восстановление шага с сохранением качества. Однако она не позволяет сохранять в одном файле сразу несколько картинок, что ограничивает ее использование при разработке анимированных изображений.
Технические детали Расширение PNG было предложено как инструмент, помогающий передавать и хранить изображения во Всемирной сети. Технология ограничивается 8-битным каналом прозрачности, благодаря чему можно корректировать цвета от непрозрачных до прозрачных. Она поддерживает 24-битовые цвета RGB, соответствующие картинки и оттенки серого. Правда, в качестве непрофессионального формата PNG не может отображать другие цветовые пространства. Открыть такие файлы позволяют большинство программ, также они запускаются в любых браузерах. Изображения отличаются небольшим весом при хорошем качестве.
Программы

Apple Preview

Microsoft Windows Photos

Adobe Photoshop CC

Corel Paint Shop Pro

Microsoft Windows Photo Gallery Viewer

Основная программа Microsoft Paint
Разработчик PNG Development Group (donated to W3C)
MIME type

image/png

Как создать файл PNG в Adobe Photoshop

Бенджамина Марторелла 26 июля 2020 г.

Что такое файл PNG?

Вас смущает, что такое файл PNG? Если так, то это вполне понятно, потому что фотографам доступно множество форматов файлов изображений. Самые распространенные из них: Jpeg, GIF, TIFF и, конечно же, PNG.

Еще сложнее то, что у каждого есть своя цель. В этой статье мы рассмотрим формат PNG.Вы узнаете, что такое файл PNG, для чего он нужен и как его создать.

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

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

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

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

Еще одним преимуществом PNG является то, что он поддерживает оттенки серого и цветовые пространства PNG-8, PNG-24 и PNG 32, что дает ему возможность отображать широкий диапазон цветов.

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

Еще один плюс формата PNG в том, что он не содержит патентов, что означает, что любой может использовать его без лицензии.

Какие программы открывают файлы PNG?

Многие программы открывают файлы PNG. К ним относятся программы просмотра фотографий по умолчанию, программы редактирования фотографий, такие как Lightroom и Photoshop, а также веб-браузеры. В любой из этих программ вы можете просмотреть PNG-файл, выбрав «открыть» в раскрывающемся меню или просто перетащив его в программу или в веб-браузер.

Если у вас еще нет Photoshop и Lightroom, вы можете получить их через Adobe Creative Cloud Plan всего за 9 долларов.99 / месяц.

Самые простые способы создания файла PNG в Adobe Photoshop

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

Шаги по созданию файла PNG в Photoshop:

1. Самый простой способ — просто «Сохранить как»

  • Нажмите Файл в верхнем меню, затем выберите Открыть
  • Выберите файл изображения и щелкните Открыть
  • Щелкните Файл в верхнем меню, затем выберите Сохранить как
  • В диалоговом окне выберите PNG в меню Формат

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

2. Создание прозрачного изображения Photoshop

  • Откройте файл, повторив шаги, описанные в п. 1.
  • Откройте панель слоев, если она еще не видна справа. Для этого щелкните Window , затем выберите Layers .
  • Щелкните слой Background на панели «Слои», а затем щелкните OK в появившемся диалоговом окне.Это разблокирует слой, позволяя вам изменить его.
  • Щелкните раскрывающееся меню Непрозрачность на панели «Слои» и выберите процентное значение ниже 100%. Чем ниже вы опустите, тем прозрачнее будет изображение.
  • Щелкните Файл в верхнем меню, выберите «Сохранить как» и выберите PNG в раскрывающемся меню. Теперь у вас есть прозрачное изображение Photoshop.

3. Удалите фон, чтобы изолировать объект.

  • Откройте файл, повторив шаги, указанные в пункте 1.
  • Добавьте слой прозрачности: в верхнем меню щелкните Layer , затем выберите New . Теперь вы увидите новый пустой слой на панели «Слои», который выглядит как серо-белая шахматная доска. Photoshop автоматически делает его прозрачным.
  • Перетащите новый слой под слой фонового изображения на панели слоев.
  • Щелкните новый слой , чтобы выбрать его.

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

  • Выберите тему: На панели инструментов слева выберите инструмент Magic Wand Tool .
  • Щелкните Выберите Subjec t в верхней части окна. Photoshop автоматически выбирает то, что, по его мнению, является объектом (объектами). Вы увидите, что вокруг выделения «маршируют муравьи».
  • Удалите фон: щелкните Выберите в верхнем меню, затем выберите Обратный .Таким образом выбирается область изображения, которую вы хотите удалить вокруг объекта.
  • Нажмите Удалите на клавиатуре. Теперь виден серо-белый узор в виде шахматной доски на прозрачном фоне.
  • Нажмите Command (Control на ПК) + D , чтобы убрать марширующих муравьев.

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

Преимущества и недостатки файлов PNG

Вы прочитали в начале этой статьи, что такое файл PNG и для чего он используется. Вы также узнали о некоторых его преимуществах, включая сжатие без потерь (данные не теряются, а качество изображения остается прежним) и что он поддерживает PNG-8 (256 цветов), PNG-24 (более 16 миллионов цветов) и PNG-32. (PNG 24 + 8 для прозрачного фона) цветовых пространств.

Другие преимущества включают широкий диапазон прозрачности от невидимого (0%) до полностью видимого (100%), вы можете добавлять метаданные и создавать файлы PNG с несколькими слоями.Кроме того, файлы PNG могут сжиматься на 10–30% больше, чем файлы GIF.

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

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

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

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

Если вы нашли эту статью полезной, подпишитесь на нас в Twitter и Facebook , чтобы узнать больше о наших бесплатные руководства по WordPress и другие ресурсы.

Используете WordPress и хотите получить Envira Gallery бесплатно?

Envira Gallery помогает фотографам создавать красивые фото и видео галереи всего за несколько кликов, чтобы они могли демонстрировать и продавать свои работы.

.

Как сделать анимированный PNG?

Помимо GIF, ezgif также позволяет создавать и редактировать (с некоторыми ограничениями) анимированные изображения PNG (APNG), WebP и FLIF. В настоящее время эти форматы менее популярны и поддерживаются не всеми веб-браузерами и программами просмотра изображений, но они предлагают много преимуществ в отношении качества изображения, альфа-прозрачности и размера файла по сравнению с GIF.

На данный момент APNG кажется лучшим выбором среди альтернатив GIF, поскольку он имеет самую широкую поддержку в веб-браузерах.APNG поддерживается современными версиями Chrome, Firefox, Safari и Opera, охватывающими более 80% настольных и 70% мобильных пользователей во всем мире. В отличие от WebP, анимированный PNG сохраняет некоторую степень обратной совместимости со старыми браузерами без поддержки APNG, они будут отображать первый кадр, как любой другой неанимированный файл PNG. Подробнее о форматах анимированных изображений »

Если эта анимация работает у вас, ваш браузер поддерживает APNG: APNG demo - bouncing ball

Если вы хотите создать анимированный PNG, у нас есть несколько вариантов для вас:

A) преобразование GIF в анимированный PNG

Если у вас уже есть анимированный файл GIF, его очень легко преобразовать в PNG.Просто загрузите GIF и нажмите кнопку «Конвертировать».

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

B) создание анимированного PNG из отдельных файлов изображений

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

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

C) преобразование видео в PNG

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

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

,

Создание прозрачного изображения (PNG или GIF) с помощью предварительного просмотра для Mac OS X

Make a transparent image Make a transparent image

Очень легко сделать изображение прозрачным с помощью приложения Preview, встроенного приложения для редактирования изображений, которое поставляется со всеми компьютерами Mac с Mac OS X. Обратите внимание, что создание прозрачных изображений PNG или GIF таким образом лучше всего работает с изображениями с униформой. цвета в области, которую вы хотите сделать прозрачной. Чем сложнее изображение и цветовые вариации, тем больше работы вам потребуется с инструментом альфа, чтобы сделать часть изображения прозрачной.

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

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

  1. Открыть изображение в превью
  2. Щелкните значок «Панель инструментов» на панели инструментов приложения «Предварительный просмотр», чтобы открыть инструменты редактирования изображений.
  3. The toolbox button reveals editing tools in Preview on Mac The toolbox button reveals editing tools in Preview on Mac

  • Для более ранних версий Mac OS X Preview: щелкните маленький значок ручки на панели инструментов, чтобы открыть инструменты редактирования изображений.

The toolbox button reveals editing tools in Preview on Mac The toolbox button reveals editing tools in Preview on Mac

  • Выберите инструмент «Instant Alpha», который выглядит как волшебная палочка в строке меню инструментов редактирования (в более ранних версиях предварительного просмотра он содержался в раскрывающемся меню «Выделение», если изображение меньше определенной ширины).
  • Alpha tool Alpha tool

  • Щелкните и удерживайте ту часть изображения, которую хотите сделать прозрачной, и, продолжая удерживать, переместите курсор вверх или вниз, чтобы выбрать большую или меньшую часть изображения, чтобы сделать прозрачным — все, что красное, станет прозрачным
  • Alpha Tool Alpha Tool

  • Нажмите кнопку «Удалить» или перейдите в меню «Правка» и выберите «Вырезать», чтобы удалить все, что было выделено красным с помощью инструмента «Альфа» (примечание: если исходное изображение было в формате, не поддерживающем прозрачность, вам будет предложено преобразовать документ, выберите «Преобразовать», чтобы продолжить », как и ожидалось.
  • Повторите, если необходимо, для других частей изображения, которые вы хотите сделать прозрачными
  • Чтобы сделать более мелкие детали прозрачными, можно увеличивать и уменьшать масштаб изображения с помощью клавиш Command + Plus и Command + Minus.

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

    Экспорт изображения как прозрачный PNG или GIF

    Файлы

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

    Сохранение прозрачного PNG
    • Перейдите в «Файл» и выберите «Экспорт».
    • В раскрывающемся меню выберите «PNG» и установите флажок рядом с «Альфа», чтобы изображение оставалось прозрачным.
    • Сохраните как обычно, сохраните расширение файла .png

    Make a transparent PNG Make a transparent PNG

    Сохранение как прозрачный GIF
    • Перейдите в раздел «Файл» и выберите «Экспорт», затем, удерживая клавишу Option, щелкните меню форматов файлов, чтобы отобразить «GIF» в качестве параметра.
    • Установите флажок «Альфа», чтобы сохранить прозрачность изображения, затем сохраните как обычно с.расширение gif

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

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

    Таким образом, вы можете создавать прозрачные изображения в Preview для Mac практически с любой версией приложения, независимо от того, используете ли вы современную версию macOS или более раннюю версию Mac OS X, приложение Preview может легко создавать прозрачные файлы GIF и прозрачные файлы PNG. ,Просто не забудьте искать кнопку Toolbox в современных предварительных версиях и кнопку Pen в более ранних предварительных версиях.

    Связанные

    ,