Форматы изображений для веба

Виды графики

Термотрансферная бумага и как делать перенос изображений

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

Векторная графика

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

Плюсы:

Изображения такого формата можно многократно увеличивать и уменьшать, не беспокоясь за качество
Размер файла никак не зависит от объема и сложности картинки
Удобно использовать для изготовления полиграфической печатной продукции
Картинку легко видоизменять (как отдельные части, так и изображение в целом)

Минусы:

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

Растровая графика

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

Плюсы:

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

Минусы:

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

Векторные форматы файлов

Форматы а0, а1, а2, а3, а4, а5, а6 размеры в сантиметрах

PDF

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

Уникальность формата PDF, в том, что с ним могут работать как специальные приложения типа Acrobat, а также Microsoft. Это весьма доступный формат по причине его универсальности. Многие программы работают с ним.

SVG

Если расшифровать формат SVG, он будет означать «масштабируемая векторная графика». Предназначен для разработки и описания двухмерных векторных изображений, а при добавлении скрипта и 3D анимированные изображения. Так как формат SVG относится к векторным изображениям, у него возможно увеличить какую угодно часть не потеряв в качестве изображения.

Преимущество его в том, что текст в этом формате является текстом, и потому он индексируется поисковыми машинами.

EPS

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

Твитнуть
Поделиться
Поделиться
Отправить
Класс!
Отправить

Другие статьи

Фото на документы

Форматы и размеры бумаги

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

Для российского или заграничного паспорта соотношение сторон фотографии должно быть 35 на 45 мм;
Фото на пенсионное и водительское удостоверения, медицинскую книжку, студенческий билет, разрешение на работу и т. п. имеет размеры 30 на 40 мм.;
Параметры снимка для личного дела составляют 40 на 60 мм.

Portable Document Format (PDF)

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

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

Какой формат изображения лучше?

Формат JPEG

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

Формат JPEG для цифровых камер

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

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

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

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

Формат TIFF

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

Формат TIFF позволяет сохранять несколько слоев, что очень удобно при дальнейшем редактировании, и в отличии от JPEG может иметь разрядность 8 или 16 на канал. TIFF является наиболее универсальным, и как правило используется для хранения оригиналов изображений, которые в дальнейшем можно редактировать. Но имейте в виду что браузеры не отображают TIFF файлы.

Формат GIF

Данный формат разработала компания CompuServe в 1987 году для первых 8-битных видеокарт компьютера и предназначался для передачи по dial up (модемному) соединению. В свое время он был самым распространенным форматом в интернете. GIF использует компрессию без потерь LZW, и очень хорошо сжимает изображения, в которых много однородных заливок (баннеры, таблицы, логотипы, схемы).

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

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

Формат PNG

Был создан сравнительно недавно для замены устаревшего GIF (браузеры показывают оба формата), и в некоторой степени более сложного TIFF формата. PNG является растровым форматом с использованием сжатия без потерь, не поддерживает анимацию и может иметь 48 битную глубину цвета.

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

Типов файлов в зависимости от цели использования:

	Фотографические изображения	Графика, логотипы
Свойства	Фотографии 24-битный цвет и 8-бит ч/б	Графика с множеством сплошных цветов, с небольшим количеством цветов (до 256 цветов), с текстом или линиями
Лучшее качество	TIFF или PNG (со сжатием без потерь)	PNG или TIFF (со сжатием без потерь)
Наименьший размер файла	JPEG с высоким коэффициентом качества	TIFF или GIF или PNG (графика / логотипы без градиентов)
Cовместимость (PC, Mac, Unix)	TIFF или JPEG	TIFF или GIF
Худший выбор	GIF 256 цветов (очень ограничен цвет, и размер файла больше чем 24 -разрядного JPEG)	Сжатие JPEG добавляет артефакты, смазывается текст и края линий

Следует ли волноваться о потере качества изображения

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

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

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

Для получения высокого качества изображения следует сохранять в формате JPEG с максимально возможным уровнем качества или использовать формат TIFF.

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

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

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

Совместимость с форматом RAW. Файлы RAW не стандартизированы для разных производителей. Например, программное обеспечение Nikon не может читать файлы Canon и наоборот. Кроме того, не все программы просмотра и редактирования изображений могут открывать все файлы RAW. Если у вас есть новая камера, которая только что была выпущена, вам, возможно, придется подождать некоторое время, чтобы компании-разработчики догнали и обновили свое программное обеспечение, чтобы ваши файлы RAW можно было открывать и обрабатывать.

Невозможность обмена. Вам придется конвертировать файлы RAW в совместимый формат, такой как JPEG или TIFF, прежде чем вы сможете передать их своим друзьям и клиентам, поскольку у них может не быть надлежащих инструментов для их просмотра.

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

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

Это изображение было снято в формате RAW, а затем преобразовано в JPEG с помощью Adobe Photoshop Lightroom

Бедуины со своими верблюдами. Это изображение было снято в формате RAW и преобразовано в JPEG после небольшой обработки

NIKON Z 7 + NIKKOR Z 24-70 мм f / 4 S @ 70 мм, ISO 100, 1/2000, f / 8,0

Что такое векторные изображения

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

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

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

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

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

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

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

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

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

Векторные форматы

К самым распространенным форматам вектора относятся:

AI (Adobe Illustrator);
CDR (CorelDRAW);
CMX (Corel валютный);
SVG (масштабируемая векторная графика);
CGM Computer Graphics Metafile;
DXF AutoCAD.

Самые популярные программы для работы с векторамиAdobe Illustrator, CorelDRAW и Inkscape.

JPEG

Наиболее распространённый формат изображений JPEG (или JPG) является стандартом организации Joint Photographic Experts Group и часто используется для публикации фотографий и изображений текста в интернете. Формат поддерживает 24 бита на пиксель, по 8 для зелёного, синего и красного, что делает этот формат «truecolor», который может отображать более 16 000 000 цветов.

Хакатон Tour.Hack

Ивент перенесён на 26–27 сентября, Новосибирск, беcплатно

tproger.ru

События и курсы на tproger.ru

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

JPEG высокого качества (качество установлено на 100), размер: 471 КБ

JPEG среднего качества (установлено качество 50), размер: 68 КБ

JPEG низкого качества (качество установлено до 20), размер: 32 КБ

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

GIF

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

Особенности

Количество цветов в изображении может быть от 2 до 256, но это могут быть любые цвета из 24-битной палитры.
Файл в формате GIF может содержать прозрачные участки. Если используется отличный от белого цвета фон, он будет проглядывать сквозь «дыры» в изображении.
Формат поддерживает покадровую смену изображений, что делает его популярным для создания баннеров и простой анимации.
Использует свободный от потерь метод сжатия.

Область применения

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

Основные понятия растра и вектора

Векторная графика

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

Основное достоинство – масштабируемость без потерь качества. Недостаток – возрастающая нагрузка на компьютер при использовании большого количества деталей и элементов.

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

Также основное достоинство векторной графики – удобное преобразование векторов в пути инструмента (лазера или фрезы). Таким образом с помощью векторов легко задать пути движения для ЧПУ станка.

Растровая графика

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

Основные характеристики растровой графики — это разрешение (dpi) и размер в мм.

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

Во-первых, при увеличении масштаба теряется качество.

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

Растровый формат идеален для хранения и обработки фотографий и сложных изображений.

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

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

Однако при обработке двуслойных материалов (двуслойные пластики, анодированный алюминий) вне зависимости от мощности будет либо снят верхний слой, либо не снят.

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

1. двуцветным (dither), где оттенок области определяется концентрацией точек на площади. Модулировать мощность согласно индексу пикселя, где белый цвет равен 0, а крайний черный – 255.

Тогда задаётся соответствие белого цвета минимальной мощности, а черного – максимальной.

2. Второй способ возможен при управлении контроллером мощностью БВН не аналоговым сигналом, а ШИМ (цифровой).

PSD

Этот тип файла Adobe Photoshop использует по умолчанию для сохранения данных. Большим преимуществом файлов PSD есть то, что они позволяют проводить манипуляции на определенных отдельных слоях, а не на самом изображении

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

Но помните, что как только слои PSD-файла будут объединены (этот процесс по сути сливает все слои), то это нельзя будет отменить, так что убедитесь, что сохранили ваш файл как PSD перед тем, как объединить слои.

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

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

Недостатки

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

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

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