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

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

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

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

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

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

Форматы растровых файлов

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

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

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

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

CMYK против RGB

Все растровые изображения могут быть сохранены в одной из двух основных цветовых моделей: CMYK и RGB.

CMYK используется для печати и основан на четырех цветах: сyan, мagenta, уellow и keу (black). Эти цвета представляют четыре типа чернила, которые будут комбинироваться в процессе печати. Файлы, сохраненные в этом формате, будут оптимизированы для физической печати.

RGB основан на цветовой модели света, которая включает red, green и blue. Это три основных цвета света, которые объединяются в другие цвета. Файлы, сохраненные в этом формате, будут оптимизированы для Интернета, мобильных телефонов, фильмов и видео – всего, что появляется на экране.

С потерями или без потерь

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

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

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

Формат JPEG / JPG

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

Вы должны использовать JPEG, когда…

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

Не используйте JPEG, когда…

• Вам нужна веб-графика с прозрачностью. JPEG не имеет прозрачного канала и будет иметь сплошной цвет фона. GIF и PNG – ваши лучшие варианты для прозрачности.
• Вам нужно многоуровневое редактируемое изображение. JPEG – это плоский формат изображения, означающий, что все изменения сохраняются в один слой и не могут быть отменены. Рассмотрите PSD (Photoshop) файл для полностью редактируемого изображения.

Формат GIF

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

Вы должны использовать GIF, когда…

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

Не используйте GIF, когда…

• Вам нужно фотографическое качество изображения. Хотя GIF-изображения могут иметь высокое разрешение, они имеют ограничение в 256 цветов (если вы не знаете несколько трюков). Фотографии, как правило, имеют тысячи цветов и будут выглядеть плоскими и менее яркими (а иногда странными из-за цветовых полос) при преобразовании в GIF.
• Вам нужно напечатать изображение. Из-за цветового ограничения большинству напечатанных фотографий не хватает глубины. Если вам нужно распечатать фотографии, используйте TIFF, PSD и JPG.
• Вам нужно многоуровневое редактируемое изображение. GIF – это плоский формат изображения, означающий, что все изменения сохраняются в один слой изображения и не могут быть отменены.

Формат PNG

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

Вы должны использовать PNG, когда…

• Вам нужна качественная прозрачная веб-графика. Изображения PNG имеют переменный «альфа-канал», который может иметь любую степень прозрачности (в отличие от GIF-файлов, которые имеют только прозрачность вкл/выкл). Кроме того, с большей глубиной цвета у вас будет более яркое изображение, чем с GIF.
• У вас есть иллюстрации с ограниченными цветами. Хотя любое изображение будет работать, файлы PNG лучше всего использовать с небольшой цветовой палитрой.
• Вам нужен маленький файл. Файлы PNG могут уменьшаться до невероятно маленьких размеров, особенно изображения простых цветов, форм или текста. Это делает его идеальным типом файлов изображений для веб-графики.

Не используйте PNG, когда…

• Вы работаете с фотографиями или произведениями искусства. Благодаря высокой глубине цвета PNG формат легко обрабатывает фотографии с высоким разрешением. Однако, поскольку это веб-формат без потерь, размеры файлов, как правило, становятся
  очень большими. Если вы работаете с фотографиями в Интернете, используйте JPEG.
• Вы имеете дело с печатным проектом. PNG графика оптимизирована для экрана. Вы можете определенно распечатать PNG, но вам лучше использовать файл JPEG (с потерями) или TIFF.

Формат TIFF / TIF

TIFF – это растровый формат без потерь, обозначающий тегированный формат файла изображения. Из-за его чрезвычайно высокого качества, формат, в основном, используется в фотографии и настольных издательских системах. Скорее всего, вы столкнетесь с файлами TIFF при сканировании документа или фотосъемке с помощью профессиональной цифровой камеры. Обратите внимание, что файлы TIFF также можно использовать в качестве «контейнера» для изображений JPEG. Эти файлы будут намного меньше, чем традиционные файлы TIFF, которые обычно очень большие.

Вы должны использовать TIFF, когда…

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

Не используйте в TIFF, когда…

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

Формат RAW

RAW содержит необработанные данные, полученные цифровой камерой или датчиком сканера. Обычно изображения обрабатываются (с поправкой на цвет, баланс белого, экспозицию и т.д.), а затем преобразуются и сжимаются в другой формат (например, JPEG или TIFF).

Необработанные изображения хранят необработанные и обработанные данные в двух отдельных файлах, поэтому у вас остается максимально возможное качество изображения, которое вы можете редактировать без разрушения с помощью приложения для редактирования фотографий, такого как Photoshop. Существуют десятки «сырых» форматов, но некоторые типичные форматы: CRW (Canon), NEF (Nikon) и DNG (Adobe).

Вы должны использовать RAW, когда…

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

Не используйте RAW, когда…

• Вы работаете с веб-графикой. RAW построен для редактирования фотографий. Когда вы будете готовы представить свои фотографии для Интернета, конвертируйте их в JPEG.
• Вы готовитесь распечатать свои фотографии. Многие принтеры не принимают необработанные форматы, поэтому сначала преобразуйте их в JPEG или TIFF.

Формат PSD

PSD – это запатентованный многослойный формат изображений, обозначающий PhotoShop Document. Это оригинальные файлы дизайна, созданные в Photoshop и полностью редактируемые с несколькими слоями и настройками изображения.

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

Вы должны использовать PSD, когда…

• Пришло время ретуши фотографий. Нужно покрасить фото? Или добавить слой текста? PSD = фотографии.
• Вам нужно отредактировать обложку для цифровых или печатных изданий. Это может быть фотография, картина, рисунок или что-то ещё. Photoshop – это правильный инструмент, чтобы убедиться, что каждая линия, тень и текстура на месте.
• Вам нужны цифровые изображения для Интернета, такие как изображения в социальных сетях, рекламные баннеры, заголовки сообщений электронной почты, видео и т.д. Создание этих изображений в Photoshop обеспечит их правильный размер и оптимизацию для Интернета.
• Вы должны создать макет веб-сайта или приложения. Слои позволяют легко перемещать элементы пользовательского интерфейса.
• Вы хотите начать рабоут с анимацией и видео. Фотошоп позволяет легко нарезать простые видеоклипы и добавлять графику, фильтры, текст, анимацию и многое другое.

Не используйте PSD, когда…

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

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

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

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

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

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

Adobe Illustrator – это стандартный редактор изображений, который используется для создания, дизайна и редактирования векторных изображений (хотя он также может обрабатывать растровые изображения).

Формат PDF

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

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

Как Adobe Photoshop, так и Illustrator могут экспортировать напрямую в PDF, что облегчает публикацию и подготовку к печати.

Вы должны использовать PDF, когда…

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

Не используйте PDF, когда…

• Вам нужно отредактировать свой дизайн. PDF-файлы являются отличными контейнерами, но для использования элементов нужны отдельные приложения. Вы можете редактировать растровые изображения в Photoshop, а векторную графику – в Illustrator. Когда вы закончите, вы можете объединить их в PDF для удобства просмотра.

Формат EPS

EPS – это формат изображения, обозначающий Encapsulated PostScript. Хотя он используется, в основном, в качестве векторного формата, файл EPS может включать в себя как векторные, так и растровые данные изображения. Как правило, файл EPS включает в себя один элемент дизайна, который можно использовать в более крупном проекте.

Вы должны использовать EPS, когда…

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

Не используйте EPS, когда…

• Вы имеете дело с фотографиями или произведениями искусства. EPS может обрабатывать растровые изображения, но этот тип файла изображения предназначен для векторов. Работайте с PSD, TIF или JPEG, когда у вас есть фотопроект.
• Вам необходимо отобразить изображение онлайн. Сначала экспортируйте в JPEG, PNG или GIF.

Формат AI

AI – это собственный векторный формат изображений, который обозначает Adobe Illustrator. Формат основан на стандартах EPS и PDF, разработанных Adobe. Как и эти форматы, AI-файлы являются векторным форматом, хотя они могут также включать встроенные или связанные растровые изображения.

AI-файлы могут быть экспортированы как в PDF, так и в EPS-файлы (для удобства просмотра и печати), а также в JPEG, PNG, GIF, TIFF и PSD (для использования в Интернете и дальнейшего редактирования).

Вы должны использовать ИИ, когда…

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

Не используйте AI, когда…

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

Стандартные растровые форматы — КиберПедия

Навигация: Главная Случайная страница Обратная связь ТОП Интересно знать Избранные Топ: Проблема типологии научных революций: Глобальные научные революции и типы научной рациональности… Марксистская теория происхождения государства: По мнению Маркса и Энгельса, в основе развития общества, происходящих в нем изменений лежит. .. Отражение на счетах бухгалтерского учета процесса приобретения: Процесс заготовления представляет систему экономических событий, включающих приобретение организацией у поставщиков сырья… Интересное: Уполаживание и террасирование склонов: Если глубина оврага более 5 м необходимо устройство берм. Варианты использования оврагов для градостроительных целей… Искусственное повышение поверхности территории: Варианты искусственного повышения поверхности территории необходимо выбирать на основе анализа следующих характеристик защищаемой территории… Что нужно делать при лейкемии: Прежде всего, необходимо выяснить, не страдаете ли вы каким-либо душевным недугом… Дисциплины: Автоматизация Антропология Археология Архитектура Аудит Биология Бухгалтерия Военная наука Генетика География Геология Демография Журналистика Зоология Иностранные языки Информатика Искусство История Кинематография Компьютеризация Кораблестроение Кулинария Культура Лексикология Лингвистика Литература Логика Маркетинг Математика Машиностроение Медицина Менеджмент Металлургия Метрология Механика Музыкология Науковедение Образование Охрана Труда Педагогика Политология Правоотношение Предпринимательство Приборостроение Программирование Производство Промышленность Психология Радиосвязь Религия Риторика Социология Спорт Стандартизация Статистика Строительство Теология Технологии Торговля Транспорт Фармакология Физика Физиология Философия Финансы Химия Хозяйство Черчение Экология Экономика Электроника Энергетика Юриспруденция

⇐ ПредыдущаяСтр 23 из 28Следующая ⇒   В файлах растровых форматов запоминаются: • размер изображения — количество пикселей в рисунке по горизонтали и вертикали; • битовая глубина — число битов, используемых для хранения цвета одного пикселя; • данные, описывающие рисунок (код цвета каждого пикселя рисунка). В файлах растровой графики разных форматов эти характеристики хранятся различными способами. В § 21 на рис. 4.12 показан код растрового изображения буквы «К» в форме двоичной матрицы. Однако память компьютера линейна, т. е. представляет собой непрерывную цепочку битов. Схематическое изображение расположения в памяти растрового кода буквы «К» показано на рис. 4.23. Здесь каждая клетка — бит памяти. Белая клетка — ноль, черная — единица.     Изображения фотографического качества, полученные с помощью сканеров с высокой разрешающей способностью, часто требуют нескольких мегабайтов памяти. Например, если размер изображения 1766 х 1528, а количество используемых цветов — 224 = 16 777 216, то объем растрового файла составляет около 8 Мб. Эта величина получается путем вычисления следующего выражения: 1766 х 1528 х 24 / 8 / 1024 / 1024. Решением проблемы хранения растровых изображений является сжатие, т. е. уменьшение размера файла за счет изменения способа организации данных. Никому пока не удалось даже приблизиться к созданию идеального алгоритма сжатия. Каждый алгоритм хорошо сжимает только данные определенной структуры. Разные графические форматы отличаются разными способами (алгоритмами) сжатия. К стандартным растровым графическим форматам относятся: BMP(Windows device independent BitMap),PCX(Picture any (X) image), GIF(Graphic Interchange Format), TIFF(Tagged Image File Format),JPEG( Joint Photographic Experts Group) и др. Форматы BMPи PCXжелательно использовать в тех случаях, когда изображение содержит большие области однотонной закраски. Это связано с тем, что алгоритм сжатия, включенный в эти форматы, заменяет последовательность повторяющихся величин (в нашем случае — наборы битов для представления пикселей) парой — величиной и числом ее повторений. В формате BMP изображение можно сохранять и без сжатия. В формате GIFрекомендуется сохранять изображения с ограниченным количеством цветов (до 256). Данные в этом формате сжимаются всегда, так как алгоритм сжатия включен в формат файла. Различные варианты формата TIFFиспользуют разные методы сжатия. Это означает, что возможна ситуация, когда файл в формате TIFF не может быть прочитан в некоторой графической программе, работающей с другой версией этого же формата. Другими словами, не все форматы TIFF одинаковы. Но, несмотря на эту проблему, TIFF является одним из самых популярных растровых форматов. Формат JPEGразработан специально для эффективного хранения изображений фотографического качества. Сжатие по методу JPEG сильно уменьшает размер файла с растровым рисунком. Высокая степень сжатия достигается за счет сжатия с потерями, при котором теряется часть исходной информации. Пользователю предоставляется возможность контролировать уровень потерь, указывая степень сжатия. Если сохраняемое изображение — фотография, предназначенная для высокохудожественного издания, то ни о каких потерях не может быть и речи, так как рисунок должен быть воспроизведен как можно точнее. Если же изображение — фотография, которая будет размещена на поздравительной открытке, то потеря части исходной информации не имеет большого значения. Экспериментально можно определить допустимый уровень потерь для конкретного изображения. Стандартные графические форматы позволяют осуществлять обмен данными между различными приложениями.   Собственные форматы графических приложений   Собственный формат — частный и наиболее эффективный формат для хранения файлов отдельного графического приложения. Например, собственный форматCorelDRAW — CDR,Adobe Photoshop — PSD,Fractal Design Painter— RIFF,Paint (стандартная программа Windows) — BMP.   Коротко о главном   Формат графического файла — способ представления графических данных на внешнем носителе. Существуют стандартные графические форматы и собственные форматы графических приложений. Файлы векторного формата содержат описания рисунков в виде набора команд для построения простых геометрических объектов. В файлах растрового формата запоминается размер изображения, битовая глубина, а также код цвета каждого пикселя изображения. Стандартные растровые графические форматы: BMP, PCX, GIF, TIFF, JPEG и др. Стандартные векторные форматы: WMF, EPS, DXF, CGM и др.   Вопросы и задания   1. Почему необходимо иметь общие графические форматы для различных приложений? 2. Как можно уменьшить размер растрового файла? 3. Какой формат разработан специально для хранения фотографий? 4. Чем различаются форматы TIFF? 5. Когда целесообразно сохранять изображения в формате BMP; в формате JPEG? 6. Какова особенность формата GIF?   ЕК ЦОР: Часть 1, дополнение к главе 4. ЦОР №1,2.               § 24 Что такое мультимедиа   Основные темы параграфа: ■ что такое мультимедиа; ■ области использования мультимедиа; ■ представление результатов компьютерного моделирования; ■ реклама. Что такое мультимедиа   Мультимедиа — сравнительно молодая отрасль новых информационных технологий. Дословный перевод термина «мультимедиа» означает «многие среды» (multi — много, media — среда). Под этим термином понимается одновременное воздействие на пользователя по нескольким информационным каналам. При этом пользователю, как правило, отводится активная роль. Большинство знакомых вам игровых программ относится к мультимедийным продуктам. В таких играх сочетаются разнообразные формы подачи информации с диалоговым управлением. Красочное оформление, стереофоническое звуковое сопровождение, движущиеся персонажи — все это создает иллюзию реальности происходящих на экране событий. Кроме того, с помощью мыши или джойстика играющий может перемещать на экране фигурки людей, запускать ракеты и многое другое.   ⇐ Предыдущая18192021222324252627Следующая ⇒ Поперечные профили набережных и береговой полосы: На городских территориях берегоукрепление проектируют с учетом технических и экономических требований, но особое значение придают эстетическим. .. Опора деревянной одностоечной и способы укрепление угловых опор: Опоры ВЛ — конструкции, предназначен­ные для поддерживания проводов на необходимой высоте над землей, водой… Индивидуальные и групповые автопоилки: для животных. Схемы и конструкции… Кормораздатчик мобильный электрифицированный: схема и процесс работы устройства… 

новый код — Растровые изображения для Интернета: форматы и параметры оптимизации

Растровые изображения: изображения, состоящие из отдельных пикселей или «точек» цвета, представлены в трех основных форматах для Интернета: JPEG, GIF и PNG. Каждый из этих форматов имеет определенную цель, использование и ограничения.

GIF (формат обмена графикой)

Логотип НАСА , хороший пример правильного использования формата GIF

Мнемоника:

« G IF для G графики».

Глубина цвета:

8 бит (256 цветов)

Используется для:

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

Сжатие:

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

Оптимальные настройки:

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

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

Старайтесь поддерживать значение параметра «Web Snap» на уровне 100 % или близком к нему.

Старайтесь не отключать «дизеринг».

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

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

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

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

Прозрачность:

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

Другие характеристики:

Можно анимировать.

JPEG (Объединенная экспертная группа фотографов)

Фотография Кристин Адамс, сохраненная в формате JPEG

Мнемоника:

«J P EG для фотографий P ».

Глубина цвета:

24-бит (16 777 216 цветов)

Используется для:

Фотографии

Сжатие:

Использует сжатие с потерями. Технически: блоки пикселей 8 × 8 преобразуются с помощью функции дискретного косинуса в квантованную матрицу коэффициентов. Менее технически: JPEG могут выглядеть «блочными» при более высоких коэффициентах сжатия.

Оптимальные настройки:

• Игнорировать предварительные настройки «Низкий», «Средний», «Высокий».
• Установите ползунок «качество» как можно ниже . 20 — хорошее начало, но в некоторых случаях вы можете снизить от 10 до 15.
• Думайте о ползунке не как о «качестве», а как о сжатии , с высоким сжатием влево и низким вправо.
• Оценка визуального качества изображения при нормальном разрешении (т. е. без увеличения). Если качество приемлемое, оставьте положение ползунка там, где оно есть (или даже переместите его на ступеньку ниже). В противном случае переместите ползунок вверх на с небольшим шагом (шаги 5 или 10), пока качество не станет приемлемым.
• Не добавляйте метаданные, если вы активно не используете их в качестве средства подписи к изображению с помощью PHP или части карты сайта.
• Убедитесь, что вы конвертируете изображение в sRGB.
• Включите «прогрессивный режим» для изображений размером более 10 КБ: он обычно будет тем меньше, чем меньше размер файла, и изображение будет «загружаться быстрее», но при этом лучше выглядеть на дисплеях с высокой плотностью, таких как устройства Apple на базе Retina. .
• «Размытие» обычно не требуется, но может быть полезно, если изображение уже было размыто с самого начала. Более высокие уровни размытия позволят алгоритму сжатия JPEG еще больше уменьшить размер файла.

PNG (Portable Network Graphics)

Значок Google Maps, хороший пример формата PNG

Мнемоника:

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

Глубина цвета:

8, 16, 24 или 32 бита

Используется для:

Сжатие без потерь графики или фотографий. Изображения, для которых требуется альфа-маска. Теоретически можно анимировать в формате APNG. Часто меньший размер файла, чем GIF, и, следовательно, часто лучшая альтернатива (SVG — еще одна возможность).

Сжатие:

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

Оптимальные настройки:

8-битные файлы PNG соответствуют рекомендациям по оптимизации для файлов GIF. 24-битные PNG соответствуют применимым значениям оптимизации для JPEG.

Прозрачность:

8-битная альфа-маска (256 уровней серого, как в PhotoShop). Не поддерживается Internet Explorer до IE8.

После прохождения рабочего процесса мы обсудили: создание исходного изображения с максимально возможным разрешением и глубиной цвета; сохранил его в папке originals на вашем сайте; уменьшение размера изображения, устранение лишних пикселей; и сохраняя изображение в формате GIF, JPEG или PNG с оптимизированными настройками, вы готовы добавить на свою страницу окончательное готовое изображение для Интернета. (Вам не нужен PhotoShop для оптимизации изображений: онлайн-ресурсы, такие как Kraken, также могут хорошо сжимать ваши файлы.)

«Что насчет формата X?»

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

Нравится этот кусок? Я приглашаю вас подписаться на меня на twitter.com/dudleystorey, чтобы узнать больше.

Файл растрового изображения (BMP), версия 5

Описание

BMP — это простой формат файлов растровых графических изображений, разработанный для хранения растровых цифровых изображений независимо от устройства отображения, первоначально и главным образом в операционных системах Microsoft Windows и OS/2. Этот формат иногда называют устройством-независимым растровым изображением (DIB), поскольку при загрузке в память с помощью программного обеспечения Windows изображение хранится в виде структуры DIB. Несколько обратно совместимых версий были представлены с новыми версиями Windows. По состоянию на конец 2011 года текущей версией BMP является версия 5, представленная в Windows 9.8 в 1998 году. Это описание сосредоточено на версии 5, но относится и к более ранним версиям, поскольку структура осталась прежней для обеспечения обратной совместимости. В статье Википедии о BMP есть таблица, описывающая различия между версиями. Цитата из части 1 статьи Дэвида Чарлэпа 1995 года в журнале Dr. Dobbs’s Journal: «В отличие от других форматов файлов изображений, таких как GIF (формат файла обмена графическими данными CompuServe) и JPEG (Объединенная группа экспертов по фотографии), формат файла BMP не был разработан для переносимости. Вместо этого он был разработан для простой работы с Windows API с использованием тех же структур, которые приложения Windows используют для управления растровыми изображениями в памяти. По мере изменения API менялся и формат файла BMP». BMP используется в основном для значков, снимков экрана и других целей в Windows. Формат файла BMP версии 5 позволяет хранить двухмерные цифровые изображения произвольной ширины, высоты и разрешения, как монохромные, так и цветные, с различной глубиной цвета (1, 4, 8, 16, 24, 32 или 64 бита на пиксель). ). Цвета могут быть проиндексированы. Дополнительные функции включают сжатие (специальные алгоритмы сжатия без потерь, которые быстро распаковываются), альфа-каналы и цветовые профили ICC. На практике большинство изображений BMP несжаты, а изображения 16 и 32 бита на пиксель всегда несжаты. Структура файла BMP включает два заголовка. Первый — это 14-байтовый BITMAPFILEHEADER. Здесь указывается тип файла растрового изображения, размер файла и положение (смещение) в файле, где начинаются данные пикселей. Этот заголовок просто позволяет проверить тип файла и его повреждение. Второй заголовок, обычно известный как заголовок DIB, предоставляет техническую информацию, необходимую для визуализации изображения, такую ​​как количество бит на пиксель, высоту и ширину изображения в пикселях, метод сжатия. Добавить комментарий Отменить ответ Ваш адрес email не будет опубликован. Обязательные поля помечены * Комментарий * Имя * Email * Сайт