Форматы изображений SVG, PNG и JPG: плюсы и минусы. Изображение в формате PNG – как открыть, редактировать и конвертировать файл Дополнительная помощь с файлами PNG
Файл PNG — растровое изображение, сохраненное в формате Portable Network Graphic. В каждом PNG-рисунке содержится палитра — набор используемых цветов. Для уменьшения размера файла применяется сжатие без потерь качества по алгоритму Deflate. Используется преимущественно в Интернете в качестве изображений для веб-страниц. Формат был разработан для замены GIF, который, помимо своих недостатков, до 2004 имел ограничения для использования в свободном программном обеспечении. Новый формат PNG решил эти проблемы. В частности, в нем реализована поддержка 8-битного альфа-канала и поддержка глубины цвета до 48 бит. В то время как в GIF-формате возможна только полная прозрачность и цветовая палитра ограничена всего 256 цветами (8 бит). Однако, в отличие от предшественника, этот формат не поддерживает анимацию. С этой целью был создан другой формат MNG. В файлах PNG также невозможно использование палитры CMYK, потому как этот формат не предназначен для профессиональной работы с графикой. Файлы PNG можно открыть в любом браузере и практически в любой программе для просмотра и редактирования изображений. В Windows файл с расширением PNG можно открыть двойным кликом мыши.
Расширение файла.png представляет собой рисунок PNG. Просмотр и обработка растрового изображения в формате PNG возможна с помощью следующих программ: Microsoft Windows Photos, Microsoft Windows Photo Viewer, Microsoft Paint, Adobe Photoshop CC. Также перечисленные программы могут конвертировать изображения, картинки и рисунки данного формата.
Файл формата PNG открывается специальными программами. Чтобы открыть данный формат, скачайте одну из предложенных программ.
Расширение PNG это формат файла, используемый для хранения изображений без потери качества. Это самый популярный формат фотографий в Интернете, специально разработанный для использования в Сети.
Файл с расширением файла PNG является файлом Portable Network Graphics . Формат использует сжатие без потерь и обычно рассматривается как альтернатива GIF. Но в отличие от GIF, в файлах PNG не поддерживается анимация.
Формат PNG имеют как фотографии в оттенках серого, так и полноцветные, поддерживаются прозрачные слои. Сжатие PNG обычно лучше того, которое используется в GIF. JPG иногда имеет больше преимуществ перед PNG, но после такого сжатия могут возникать дефекты в изображениях с текстом или вокруг высококонтрастных областей.
Как открыть файл PNG
Чтобы открыть PNG файлы, можно использовать любой интернет-браузер или графический редактор. И платформа ОС Windows, и Mac OS имеют встроенные механизмы для просмотра таких изображений.
Для чего предназначен формат PNG?
Программа Png — Просмотр фотографий Windows по умолчанию часто используется для открытия файлов PNG, поскольку это системная программа Windows. Но существует много других способов их просмотра.
Все браузеры (например, Chrome, Firefox, Internet Explorer и т. д.) будут автоматически просматривать файлы PNG, которые вы открываете в Интернете, а это означает, что не нужно загружать на компьютер каждый PNG файл, который вы хотите посмотреть. Вы также можете использовать браузер для открытия уже имеющихся на компьютере PNG файлов при помощи комбинации клавиш Ctrl + O. Большинство таких программ также поддерживают drag-and-drop, поэтому можно просто перетащить PNG файл в браузер, чтобы открыть его.
Также существует несколько автономных вариантов для открытия таких изображений - это специальные графические редакторы. Несколько популярных — XnView, IrfanView, FastStone Image Viewer, Google Drive, Eye of GNOME и gThumb. Для редактирования PNG файлов можно использовать практически любую из перечисленных программ, приложения Paint и Paint.NET , популярную утилиту GIMP, а также всем известный Adobe Photoshop.
Конвертация PNG
Файлы изображений можно преобразовывать различными способами, например, конвертировать в png и из него с помощью различных программ и онлайн сервисов. Например, это позволяет делать редактор Png — Фотоконвертер.
Файл изображения, который хранится в формате Portable Network Graphic (PNG). Содержит битовую матрицы цветов и использует компрессию без потерь, близкую к файлу.GIF, но без ограничений в копировании. Обычно используется для хранения графики веб-изображений.
Формат PNG (читается как пнг) создавался в ответ на ограничения формата GIF, преимущественно чтобы увеличить поддержку цветов и предоставить формат изображений без патентной лицензии. В дополнение к этому в то время как файлы GIF поддерживают только непрозрачные или полностью прозрачные пиксели, изображения PNG могут включать в себя 8-битовый канал прозрачности, который позволяет изменять цвета от непрозрачных до прозрачных.
Изображения PNG нельзя анимировать как изображения GIF. Но связанный с ними формат.MNG может быть анимационным. Изображения PNG не предоставляют поддержку CMYK, поскольку не предназначены для использования в сфере профессиональной графики. Изображения PNG поддерживаются большинством веб-браузеров.
Mac OS X 10.4 и последующие версии хранят скриншоты в качестве файлов PNG. Ubuntu Linux также хранит печатные скриншоты в формате PNG.
MIME-тип: image/png
Скачать программу для формата PNG
В этой статье я хочу рассказать об одной очень неприятной особенности «Фотошопа», которая проявляется при сохранении прозрачных изображений в PNG24. Возьмем исходное изображение и скопируем какой-нибудь фрагмент в PNG24. Я это сделал так: с помощью инструмента Polygonal Lasso выделил фрагмент, скопировал и вставил в новый документ, после чего сохранил через Save for Web:
PNG24, 456 Кб
Как мы выяснили в первой части, в PNG24 изображение, по сути, состоит из двух слоев: RGB, содержащего данные о цвете каждого пикселя, и альфа-канала с информацией об их прозрачности.
Графический формат PNG: обработка и просмотр
Логично предположить, что в абсолютно прозрачных областях должен быть какой-нибудь один цвет, чтобы эффективнее упаковать изображение. Однако вот что сохранил «Фотошоп» в RGB-слое (я это увидел через редактор Seashore):
И невооруженным глазом видно, что остались большие фрагменты абсолютно ненужной информации:
Если не хочется пользоваться другими редакторами (например, в Adobe Fireworks такого недостатка я не заметил), предлагаю простой способ устранения этого дефекта в «Фотошопе». Наша задача — заменить всю информацию в абсолютно прозрачных областях каким-нибудь одним цветом (желательно черным, чтобы не сомневаться в том, что эти области будут иметь наименьший вес в байтах).
1. Откроем пример в «Фотошопе» и выделим изображение на слое: Ctrl+клик по маленькому изображению слоя в палитре Layers.
2. Перейдем в режим быстрой маски (клавиша Q).
3. С помощью Image → Adjustments → Threshold оставим только те пиксели маски, цвет которых был черным. Для этого перетащим ползунок в крайнее левое положение.
4. Выходим из режима быстрой маски (клавиша Q) и инвертируем выделение (Select → Inverse или Ctrl+Shift+I). Выделенными остались только абсолютно прозрачные пиксели.
5. Заливаем выделенную область черным цветом (способов много, например, через Edit → Fill).
6. Снова инвертируем выделение и добавляем слою маску (иконка в палитре слоев).
7. Теперь делаем Save for Web и смотрим, как изображение чудесным образом «похудело» на 122 КБ.
Еще раз повторю, что все действия очень удобно записываются в Actions, после чего выполняются одним нажатием клавиши.
Продолжение будет.
Общаясь со своими коллегами на различных семинарах и в студии, я пришел к выводу, что для многих единственным преимуществом формата PNG является наличие честной полупрозрачности. Если поискать в интернете информацию об этом формате, несложно заметить, что веб-разработчики разделились на два лагеря. Первые пишут о том, какой этот формат замечательный, оперируя чисто техническими данными, непонятными обычным кодерам и дизайнерам (к примеру, о превосходстве deflate-алгоритмов сжатия над LZW), другие же оставляют комментарии разной степени глупости о бесполезности PNG, не потрудившись даже вникнуть в суть вещей, описанных в спецификации.
Попробуем разобраться, какие преимущества дает этот формат, чтобы научиться ими пользоваться при подготовке иллюстраций для веба.
Начнем с терминологии. Предполагаю, что большинство читателей пользуются фотошопом и встречали там названия PNG-8 и PNG-24. Это не два разных формата, а всего лишь вариации одного и того же PNG. Формат позволяет хранить три типа изображений: greyscale (для описания изображения используется один канал — белый), indexed-colour (используется палитра цветов, как в GIF) и truecolor (используется три канала — RGB).
Самое главное преимущество формата PNG — это, конечно же, новые алгоритмы сжатия. Все помнят, что GIF эффективно сжимает только горизонтальные одноцветные области? Про это ограничение теперь можно забыть:
|
GIF, 2568 байт |
PNG-24, 372 байта |
Вторым важным преимуществом является фильтрация строк (scanline filtering, или delta filters), благодаря которой PNG-упаковщик может получить гораздо более удобные данные для сжатия.
Рассмотрим на примере, как они работают. Возьмем изображение 5×5 пикселей с горизонтальным градиентом и схематично отобразим, как оно может быть сохранено в файле (каждое число — уникальный цвет).
Как видно из примера, GIF-кодировщик отдал бы на сжатие строки, которые плохо упаковываются по горизонтали (потому что одинаковые цвета распространяются по вертикали). А вот как может преобразовать эти данные PNG-кодировщик:
Перед каждой строкой появилась цифра 2. Это — фильтр, который был применен к строке. В данном случае это фильтр Up, который говорит декодеру: «Для текущего пикселя возьми значение пикселя выше и прибавь к нему текущее значение». В нашем случае это 0, потому что цвета текущего и верхнего пикселей не отличаются. А эти данные можно эффективней упаковать, если у нас достаточно большое изображение.
Почему я написал может ? Потому что в нашем идеализированном случае более эффективной была бы такая схема:
Тут применен фильтр 1 под названием Sub, который говорит декодеру: «Возьми значение пикселя левее текущего и прибавь ему текущее значение». В данном случае 1.
После фильтрации все строки (вместе со значениями фильтров) объединяются в одну последовательность, которая затем сжимается deflate-алгоритмами (их обсуждение выходит за рамки этой статьи).
Проверим работу фильтров:
Внимательный читатель может заметить, что фильтры применяются не ко всему файлу целиком, а к строкам.
Файл формата PNG - что это?
Это значит, что каждая строка может иметь свой фильтр. Получается, что способов фильтрации одного изображения может быть 5 высота картинки. В общем-то, задача хорошего кодировщика как раз заключается в том, чтобы подобрать такие значения фильтров, при которых объем файла будет минимальным. К сожалению, фотошоп не всегда хорошо справляется со своей работой, поэтому на помощь приходят различные утилиты вроде OptiPNG и PNGCrush, которые в большое количество проходов подбирают разные способы фильтрации и стратегии сжатия данных, значительно сокращая тем самым объем некоторых сложных изображений. Однако стоит помнить, что эти программы не гарантируют уменьшение объема для каждого файла, они всего лишь пытаются найти оптимальный способ кодирования данных.
Еще один больной укол фотошопу за то, что он не умеет сохранять изображения в greyscale-режиме, то есть не умеет понижать глубину цвета. Тут нас опять спасут вышеозначенные утилиты, которые по возможности снижают глубину цвета, не ухудшая при этом качества картинки.
|
PNG-24 (фотошоп → truecolor), |
PNG-24 (фотошоп + OptiPNG → greyscale), |
Преимущества greyscale над truecolor очевидны: к примеру, белый цвет в первом случае записывается (в десятичной системе счисления) числом 255, а во втором — 16777215.
Теперь, вооружившись знаниями о хранении данных в формате PNG, мы можем применять их в подготовке изображений для веба. Об этом — в следующих статьях.
PNG (Portable Network Graphics) - графический формат растрового типа, содержащий 8-битную цветовую палитру. Разработанный для PNG-файлов алгоритм сжатия Deflate уменьшает размер сохраняемого изображения без потери качества итоговой картинки.
В этой статье вы также узнаете чем открыть файл PNG.
Характеристика
PNG – второе по популярности интернет-форматом после JPG.
Среди прочих достоинств стоит отметить:
- чересстрочную верстку;
- встроенную программную коррекцию цветовой палитры и гаммы.
Последняя позволяет вшить в изображение все необходимые параметры отображения, чтобы оно на всех экранах выглядело так, как задумывал автор.
У формата 2 версии:
- PNG-8 (индексная цветовая гамма схожа с таковой в GIF);
- PNG-24 (полноценная и полноцветная палитра, имитирующая JPEG).
История возникновения
В 1995 году, в эпоху развития свободного интернета, резко встал вопрос о проприетарности сложного формата GIF. Был необходим столь же надежный но бесплатный и свободный формат для обмена графическими данными во всемирной паутине. В это время на международном консорциуме W3C были представлены спецификации PNG 1.0, утвержденные уже в 1996.
Формат создавался как альтернатива GIF. Последний до 2004 года был «закрытым», т. е. имел ряд ограничений для вольного использования (требовал авторских прав владельца при сохранении, патентные лицензии при размещении). PNG лишили подобных недостатков, при этом реализовали поддержку глубины цвета до 48 бит и 8-битного альфа-канала для передачи картинки.
Разработчикам удалось создать плавную прозрачность цветов, невозможную в GIF. В последнем палитра ограничена 8-битным каналом (256 цветов) и поддержкой лишь полной прозрачности.
Чем открыть файлы формата PNG
Сегодня графический формат без проблем демонстрируется в интернет-обозревателе и стандартных средствах для просмотра графики. Если говорить более развернуто - картина следующая: для работы с форматом в каждой ОС предусмотрен свой инструментарий. Рассмотрим подробно, чем открыть формат PNG.
Онлайн
Для просмотра файлов в интернете используйте следующее ПО:
Windows 7-10
ОС семейства Windows открывают PNG-формат следующим способом:
- средство просмотра фотографий;
- MS Paint;
- веб-браузер (только для просмотра).
Android
Мобильная ОС располагает такими средствами:
iOS
Мобильная кот для Apple работает с PNG-файлами с помощью такого ПО.
Файл PNG (с англ. Portable Network Graphic) относится к растровым изображениям. Формат PNG содержит определенную палитру цветов, применяемых в рисунке. Подобный графический формат довольно часто применяют в сети Всемирной паутины при наделении веб-страниц различными изображениями. Благодаря использованию алгоритма сжатия Deflate, растровые изображения, имеющие расширение файла PNG, доступны для сжатия без явных потерь качества.
Разработали данный формат файла, чтобы заменить формат GIF, ведь последний длительное время требовал наличия платного программного обеспечения. Среди владельцев веб-ресурсов, изображения PNG славятся отменными характеристиками на фоне подобных форматов. PNG поддерживает глубину цвета в пределах до 48 бит. Основное отличие GIF заключается в том, что такой графический файл ограничивается лишь 8 битами (всего 256 цветов). Следует знать, что в отличие от GIF, PNG не обладает поддержкой анимационных эффектов.
Открыть файл, имеющий расширение PNG, можно при помощи фактически любой программы просмотра. В операционной системе Windows, открыть PNG возможно посредством простого двойного щелчка мыши для просмотра изображений. Такой формат изображений запускается и в любых веб-браузерах. Если пользователю необходимо изменить сохранённое изображение в PNG версии, достаточно воспользоваться утилитами редактирования изображений, такими как Adobe Photoshop или Microsoft Windows Photos, а также Corel PaintShop либо ACD Systems.
Данное расширение файла пользуется большой популярностью и несет в себе всю необходимую графическую информацию для полноцветных изображений хорошего качества.
Растровый графический формат PNG появился в качестве своеобразного майдана свободных разработчиков против технологической олигархии, стяжательства и жажды наживы, душивших развитие интернета.
В середине девяностых годов прошлого века во всю бушевала Первая интернет-революция. Консорциум всемирной сети W3C в результате бескровного переворота сместил законно избранное (путем подкупа электората) Временное представительство в лице Microsoft и Netscape. Последние оказались неспособны договориться о стандартах и поставили молодую цифровую цивилизацию на грань браузерной войны.
Назрела насущная необходимость введения всеобщей унификации интернет-технологий. Однако существовавший к тому времени формат графики GIF имел маленький, но существенный недостаток – у него была коммерческая лицензия, в том числе на технологию сжатия данных.
Как водится, платить никто не хотел, поэтому, чтобы избежать хаоса во всемирной сети, когда сайты одного разработчика невозможно просмотреть на браузерах другой, группа добровольных программистов создала спецификацию PNG, которая оказалась не хуже GIF, а по некоторым характеристикам имела значительные преимущества.
Технические особенности формата PNG
В общем-то, если присмотреться, PNG отличается от GIF примерно, как MS Office отличается от LibreOffice. В основе растровая графика со сжатием, индексированная цветовая палитра. Тем не менее, разработчики PNG учли ошибки GIF и сумели избавить новую технологию от гнетущих проблем прошлого.
- Схема сжатия данных в PNG обеспечивала восстановление исходного изображения совершенно без потерь независимо от степени сжатия.
- Больший уровень сжатия данных.
- Допускалось использование неограниченного числа цветов в изображении. Это позволило обеспечить качество и реализм картинки почти на уровне фотографического формата JPEG .
- Поддержка многоуровневой прозрачности слоев.
- Формат PNG позволяет сохранять все промежуточные стадии редактирования изображения и восстановление любого шага без потерь в качестве.
Были попытки создать версии этого формата с возможностью анимации, но они оказались уже не востребованы – в начале 21 века истек срок лицензии и формат графики GIF стал бесплатным для использования с любыми целям.
Сфера применения PNG
Portable Network Graphics переводится примерно как "переносимая сетевая графика". Даже в названии проекта заметно подражание GIF – "графический формат для обмена по сетям".
Чтобы откреститься от темного прошлого, создатели PNG распространили в интернете рекурсивный акроним "Ping is Not a GIF" – "Пинг это не GIF".
Пинг – британское произношение PNG, в американском английском скорее звучит как Пи-эн-джи, для русскоязычного наблюдателя -пээнгэ.
На деле революционный формат упаковки графики оказался очень неплох и сегодня является самый популярным для подготовки изображений к публикации на сайтах, в блогах и социальных сетях благодаря своим выдающимся качествам.
- Кросс-платформенность – одинаково хорошо читается всеми типами современных браузеров и графических редакторов.
- Имеет маленький вес при высоком качестве изображения.
- Легко поддается сжатию в широком ранге без потери качества.
Однако при размещении фотографий на сайтах для просмотра на экранах компьютерных мониторов, особенно на маленьких дисплеях мобильных устройств, пользователи не заметят никакой разницы между фотографией в формате PNG и JPEG. Точнее, чтобы заметить разницу нужно либо пристально всматриваться, либо быть профессиональным фотографом.
Для сайтов важнее небольшой вес картинок, чтобы не замедлять загрузку веб-страниц.
Если учитывать статистику, что в среднем на сайтах посетители проводят всего несколько секунд, а контент не подробно изучается, а поверхностно сканируется быстрым взглядом – то качество изображения PNG оказывается оптимальным.
Преимущества PNG перед JPEG
В процессе многократных сжатий и редактирования изображения в файлах JPEG приобретают искажения, появляются цветовые ореолы, возможно выпадения пиксельных блоков.
Если необходимо опубликовать на странице сайта очень четкую схему, с разборчивыми мелкими деталями, инфографику – здесь PNG показывает значительно лучшие результаты, чем JPEG, который оптимально подходит для упаковывания изображений, в которых основным требованием является реализм – фотографии природных пейзажей, животных, людей.
Возможность создания прозрачных слоев делает формат PNG незаменимым для разработки логотипов, иконок, символов, кнопок.
В PNG есть функция хранения метаданных – дата, время, место создания изображения, сведения об авторе, правообладателях и прочее. Это полезно помнить, когда вы собираетесь публиковать заимствованную в интернете картинку. Чтобы Google не смог выявить дубликат – нужно удалить метаданные из файла (при помощи графического редактора).
Бесплатный онлайн конвертер изображений в PNG
На данном сайте вы можете без проблем преобразовать практически любое изображение в формат PNG, при этом вы можете установить глубину цвета от 1бита до 64бит, а так же выставить уровень сжатия.
Заметьте, что для того чтобы получить в полученном изображении у вас сохранилась прозрачность нужно использовать глубину с цвета RGBA. В данном случае буква А означает - альфа-канал, т.е. прозрачный.
Оптимизация PNG
Не все программы делают PNG с минимальным размером файла. Поэтому перед публикацией картинки на сайте рекомендуется её оптимизировать. Для этих целей вы можете использовать различные утилиты, или использовать наш онлайн-сервис для оптимизации . Просто выберите изображение и нажмите "Оптимизировать".
Компьютерная графика сейчас заполонила все вокруг, даже фотографии мы смотрим уже чаще на экране монитора, телефона или телевизора, чем на бумаге. Но вот что самое интересное – способы хранения этих изображений очень разные. Существуют десятки форматов хранения изображения, каждый со своими достоинствами и недостатками, но наиболее эффективными и популярными из них остаются те, которые дают наилучшее качество и притом файл получается небольшого объема. Одним из таких форматов является формат PNG. Что это за формат и откуда он взялся?
Вкратце о самой причине появления этого формата хранения изображений…
4 января 1995 года была высказана идея создания бесплатного формата взамен платного GIF-а, а уже в декабре того же года новый формат PNG был уже готов и предложен на рассмотрение. Формат GIF в то время позволял получать очень маленькие файлы, которые было удобно использовать на сайтах. Но бывший бесплатным GIF неожиданно стал платным - владелец патента на него, компания «Unisys Corporation», вознамерилась брать деньги за каждое изображение, которое использует этот формат. Это и стало причиной разработки бесплатного формата, который получил название PNG – аббревиатура от английского выражения «portable network graphics». Как видно из названия, предназначен он для применения в сети, ввиду файлов небольшого объема, что позволяет быстрее загружать страницы с графикой.
Какие же достоинства и недостатки имеет формат PNG по сравнению с другими, особенно с главным своим конкурентом – форматом GIF? Отличий очень много, но обо всем по порядку…
В формате PNG используется алгоритм сжатия под названием Deflate, который сам по себе является свободно распространяемым, то есть абсолютно бесплатным. Этот алгоритм работает по принципу обычного архиватора, эффективно сжимающего информацию о цветовой гамме каждого пиксела, и именно он позволяет получать довольно небольшой файл. Кроме того, в этом формате можно сохранять полноцветные изображения, то есть те, в которых используется до 48 бит на каждый пиксел – а это очень большая цветовая гамма, даже больше, чем способен воспринимать глаз человека. Формат GIF же позволяет использовать только 256 цветов и оттенков – достаточно для простейших картинок, но очень мало для фотографического качества.
В форматах PNG, GIF и TIFF используется так называемый альфа – канал. Это значит, что можно делать некоторые участки картинки прозрачными. При этом в формате GIF это сделано очень просто – просто один из цветов на выбор назначается прозрачным и при просмотре изображения его просто не видно – так можно делать прозрачный фон. Формат TIFF более продуман в этом плане, но его очень редко используют – слишком уж большой размер файлов получается. А вот в формате PNG альфа – канал сделан с умом – там прозрачность не только есть, но имеет еще и 256 градаций яркости. То есть можно легко сделать переход от полностью прозрачного фона к полноцветному изображению, и получить при этом красивые эффекты. Особенно красиво это выглядит на сайтах. Если же прозрачность не нужна, можно просто ее не использовать при сохранении картинки и получить файл еще меньшего объема.
К сожалению, формат PNG имеет один недостаток, не очень существенный – он не позволяет сохранять последовательность изображений, так называемую анимацию. GIF же позволяет это делать. Произошло это потому, что на момент создания нового формата анимация практически нигде не применялась, да и не было в 1995 году особой потребности в красочных сайтах, поэтому анимацию исключили из проекта, как ненужную. Сегодня нишу анимации заняла технология Flash, которой никакой обычный графический формат не конкурент.
Если формат PNG так хорош, то почему он не стал сверхпопулярным? Ответ прост – его слабо поддержали разработчики остальных программ. Особенно повлияло то, что большинство пользователей Интернета пользовались браузером Internet Explorer, а он-то и «не понимал» изображения в формате PNG, хотя разработчики других браузеров сразу же встроили в них такую поддержку. Ситуация исправилась, только когда появился Internet Explorer 7, но время «раскрутки» уже давно прошло.
Сегодня формат PNG входит в тройку самых популярных и рекомендуемых форматов в веб – технологиях, наряду с форматами GIF и JPG. И, если не считать отсутствие анимации недостатком, то он выигрывает по все параметрам по сравнению с другими. Качественное изображение без потерь качества, небольшой файл, плавные переходы к прозрачному фону, да еще и без нарушения чьих – либо авторских прав – что еще нужно для счастья разработчику сайтов?
