Цифровые изображения — неотъемлемая часть Интернета, и без медиафайлов сложно создать какой-либо контент. Скромное неподвижное изображение — отличный способ придать дополнительный контекст вашему письму. Однако размер файла изображения может быть огромным без оптимизации. Сжатие с потерями и сжатие без потерь является распространенным соображением, потому что каждое из них может уменьшить размер изображения, хотя также необходимо учитывать компромиссы в отношении качества.
Почти всегда необходимо применить некоторое сжатие к изображению. Это поддерживает качество на том уровне, который вы указали как приемлемый, при сохранении размера файлов. Выбор правильного уровня сжатия зависит от ваших конечных целей и требований.
В этом посте мы рассмотрим сжатие с потерями и без потерь. Далее мы поговорим о том, как изображение «приходит в форму», что такое сжатие и многие другие аспекты оптимизации ваших изображений.
Содержание статьи
- 1 Различия между потерями и без потерь
- 2 Элементы цифрового изображения
- 3 Как работает оптимизация веб-изображений
- 4 За и против сжатия с потерями
- 5 Подпишитесь на рассылку новостей
- 6 Плюсы и минусы сжатия без потерь
- 7 Как выбрать между потерями и без потерь
- 8 Использование онлайн-сервиса сжатия для оптимизации изображений
- 9 Сводка
Различия между потерями и без потерь
Когда дело доходит до сжатия цифровых изображений, существует несколько различных форматов на выбор. Иногда они будут иметь другие названия в зависимости от многих факторов. Однако на базовом уровне вы найдете два типа:
- Сжатие с потерями: Цель состоит в том, чтобы обеспечить наименьший возможный размер файла для изображения. Таким образом, качество изображения часто занимает последнее место в списке приоритетов.
- Сжатие без потерь: Вы по-прежнему обнаружите значительное уменьшение размера файла с этим форматом сжатия, но изображение не будет страдать от артефактов и других проблем.
В большинстве случаев ваше решение о том, какой формат использовать, зависит от конечной цели: вам нужны крошечные файлы или вы сосредоточены на сохранении качества?
Сжатие с потерями навсегда удалит данные, которые считает ненужными, из изображения. Для этого используется множество различных методов, что приводит к гораздо меньшим размерам файлов.
При сжатии без потерь данные также удаляются, но при необходимости можно восстановить оригинал. Цель состоит в том, чтобы сохранить высокое качество, но уменьшить размер файла.
Есть несколько способов добиться этого, но результат часто один и тот же. Чтобы найти правильный вариант для ваших нужд, давайте сначала сделаем шаг назад и рассмотрим основы изображений и сжатия в целом.
Элементы цифрового изображения
Как и в случае с программным обеспечением и веб-разработкой, часто существует «стек» для передачи изображения с камеры в Интернет.
Изображение начинается как «сырые» данные (отсюда и название RAW). Это похоже на код приложения: фрагменты, строки и значения преобразуются в фон с цветом, заполнителями изображений, динамическими элементами и многим другим.
Для изображения файл RAW представляет несколько иное представление изображения в зависимости от производителя камеры, программного обеспечения для редактирования, алгоритма цветового пространства и многого другого. Оттуда вы редактируете изображение и экспортируете его в один из нескольких форматов файлов (подробнее об этом позже):
An пример редактирования файла RAW в Capture One.Стандартное цифровое изображение состоит из нескольких различных элементов:
- Тип файла: Различные типы обеспечивают качества, которые могут подходить или не подходить для окончательного изображения. Главное — выбрать наиболее подходящий тип файла для приложения.
- Разрешение: Вы часто будете видеть, что это выражается в мегапикселях (MP), но вы также будете использовать пиксели на дюйм (PPI) или точки на дюйм (DPI). Более высокое разрешение обеспечивает более высокое качество, но также увеличивает исходный размер файла
- Разрядность: Этот аспект определяет информацию о цвете в изображении. Низкая битовая глубина будет отображать только несколько цветов, в то время как высокая битовая глубина потенциально может отображать миллионы цветов одновременно. Как правило, чем выше, тем лучше.
- Размеры: Это физическое пространство, занимаемое изображением. Например, 1000 пикселей x 500 пикселей могут определять общий размер изображения.
- Цветовое пространство: Это алгоритм, определяющий отображение цветов. Каждое цветовое пространство настраивается по-разному, и часто это зависит от предпочтений фотографа.
.
В сочетании эти элементы обеспечивают итоговое изображение разного качества. Например, большая фотография в формате JPEG с высоким разрешением и глубиной цвета обеспечит высочайшее качество и резкость:
Изображение высокого качества.Напротив, даже изображение большого размера и с возможностью отображения большого количества цветов может выглядеть плохо при низком разрешении. :
Изображение с низкое качество.Этот баланс определяет, как вы обрабатываете основное изображение перед применением сжатия. Однако формат, который вы используете для изображения, имеет большую роль в конечном качестве.
Как работает оптимизация веб-изображений
Поскольку сжатие изображений в общих чертах работает одинаково, вы можете применять стандартные правила к способу оптимизации изображений для Интернета.
Мы освещаем многие из этих концепций в других местах блога Kinsta, но стоит дать краткое описание для справки:
- Используйте разрешение 72 PPI, так как это стандарт для Интернета. Вы можете использовать более высокое значение PPI/DPI по причинам архивации, но мы предполагаем, что вы публикуете в Интернете.
- Установите «длинный край» изображения на 2048 пикселей, так как это оптимально для многих различных приложений.
- Используйте 8-битную глубину цвета, если у вас есть такая возможность.
- Перед публикацией пропустите изображение через инструмент сжатия и оптимизации.
Это простой формат, который может дать вам стабильные результаты, хотя сжатие и оптимизация — это то, о чем мы поговорим в оставшейся части этой статьи.
С этой целью давайте рассмотрим преимущества и недостатки сжатия с потерями и без потерь.
Как сжатие изображений может помочь вашим веб-изображениям
В общих чертах, «сжатие» сжимает минимум и максимум ближе друг к другу. Например, сжатие увеличивает самую низкую громкость в музыке и уменьшает самую высокую. Это делает средний уровень громкости громче для слуха.
Для изображений сжатие — это скорее восстановительный процесс. Это означает, что больше внимания уделяется удалению данных из вашего изображения, чтобы уменьшить размер файла, сохраняя при этом максимально высокое качество.
Существует множество различных проприетарных алгоритмов, помогающих уменьшить размер файла изображения. Во многих случаях они являются собственностью конкретной компании. Вы найдете множество стандартов сжатия «с потерями» и «без потерь», каждый из которых имеет уникальный дескриптор:
Параметры сжатия в ShortPixel.При всем при этом применение сжатия изображений дает множество преимуществ, не являющихся исключительными для определенного формата:
- Вы можете уменьшить размер файлов, что повысит производительность вашего сайта.
- В результате у сервера вашего сайта будет меньше работы, что повлияет на производительность.
- Небольшие размеры файлов помогают снизить нагрузку на сервер. Таким образом, вы помогаете вносить свой вклад в устойчивое и этичное будущее.
- В зависимости от выбранного алгоритма и качества сжатия вы можете отображать почти идеальное и сравнимое качество.
Так же, как создание общедоступного изображения, игра с различными значениями сжатия, использование конкретной компании и выбор правильного алгоритма жизненно важны для получения результатов, которые вам подходят.
За и против сжатия с потерями
Сжатие с потерями уменьшает размер файла изображения почти до полного исключения всех других аспектов. Принцип работы алгоритма заключается в постоянном удалении данных. Это может быть настолько разрушительным, насколько это звучит.
Хотя мы не будем слишком углубляться в детали, знайте, что некоторые из удаленных сжатием данных с потерями видны на изображении. Идея состоит в том, чтобы предложить наилучшее представление исходного высококачественного изображения при меньшем весе, а это означает, что некоторые данные не будут включены.
В целом использование сжатия с потерями имеет несколько преимуществ:
- Размеры файлов будут небольшими — в некоторых случаях менее 10 килобайт (КБ).
- Потеря качества во многих случаях допустима, несмотря на артефакты.
Это подводит нас к недостаткам использования сжатия с потерями — качество изображения снижается при любой степени сжатия:
Ползунок сжатия для изображения JPEG.Вы обнаружите эти цветные полосы там, где цветовые оттенки не видны. визуализировать правильно — и в некоторых случаях будет заметна потеря четкости краев. На изображениях с меньшим количеством цветов этого будет меньше, но снижение четкости все равно будет присутствовать.
Кроме того, ухудшение качества изображения является постоянным свойством процесса сжатия. Это означает, что нет никакого способа отменить эффекты позже.
Несмотря на недостатки, сжатие с потерями отлично подходит для Интернета и производительности вашего сайта. Крошечные размеры файлов не всегда приводят к зернистости изображений, хотя вы можете (конечно) довести дело до крайности:
Пример чрезмерно сжатого изображения.Однако сжатие с потерями — не единственный вариант. Сжатие без потерь — альтернатива для владельцев сайтов, заботящихся о качестве.
Плюсы и минусы сжатия без потерь
Сжатие без потерь делает то, что указано на этикетке: оно максимально сжимает размер файла изображения, не влияя на видимое качество. Для этого удаляются метаданные изображения, которые могут занимать лишнее место:
Метаданные изображения. Алгоритм сжатия без потерь также ищет повторяющиеся последовательности пикселей, а затем кодирует ярлык для их отображения. Например, возьмите «Интерфейс командной строки». Вы часто будете определять его аббревиатуру один раз, а затем использовать «CLI» (или выбранную вами аббревиатуру), чтобы молниеносно ссылаться на нее
.
Сжатие без потерь работает точно так же, но менее разрушительно. Хотя удаление метаданных не будет обратимым, частичное сжатие будет обратимым, что делает его гибким алгоритмом для многих применений.
Плюсы использования сжатия без потерь заключаются в сохранении качества:
- Сжатие без потерь сохраняет максимальное качество изображения по сравнению со всеми другими алгоритмами.
- Lossless отлично подходит для архивных целей. Например, фотограф может сбалансировать ресурсы хранения с изображением, которое сохраняет больше всего данных.
- Сжатие без потерь является предпочтительным алгоритмом сжатия для изобразительного искусства: фотографии, графического дизайна, цифрового искусства и многого другого. Комбинируя алгоритм без потерь с надлежащей глубиной и разрешением, можно получить копию «один к одному».
Однако следует отметить, насколько хорошо сжатие без потерь подходит для определенных ниш: диапазон приложений невелик. Это снижает его общую доступность.
Вот некоторые другие недостатки сжатия без потерь, которые следует учитывать:
- Если на веб-сайте используется много изображений, сжатие без потерь может быть не оптимальным для их отображения. Это связано с тем, что в большинстве случаев в подобных ситуациях вам следует отдавать предпочтение файлам меньшего размера.
- Хотя сжатие уменьшает размер файла, алгоритмы без потерь не изменяют данные изображения так сильно, как с потерями. Из-за этого вы можете увидеть лишь незначительное уменьшение размера, а не экстремальные результаты похудения.
Далее мы рассмотрим самый быстрый (и потенциально лучший) способ сделать это.
Как выбрать между потерями и без потерь
Теперь вы понимаете разницу между сжатием с потерями и сжатием без потерь. Однако вы все еще можете не знать, какой алгоритм лучше всего использовать на вашем сайте.
Следует рассмотреть две ситуации:
- В большинстве случаев использования в Интернете приемлемо сжатие с потерями.
- Если вы хотите отобразить фотографию или сфотографированное искусство, сжатие без потерь подойдет вам лучше.
Эти соображения основаны на использовании одного из стандартных форматов веб-изображений, таких как JPEG, PNG или GIF. Однако ваши потребности в сжатии могут отличаться для более современных форматов, таких как HEIC и WebP.
Мы бы даже сказали, что если вы не размещаете фотографии на своем сайте, сжатие с потерями должно быть вашим выбором по умолчанию. WordPress сжимает изображения по умолчанию, что свидетельствует о том, что сжатие с потерями подходит практически для любого приложения.
Использование онлайн-сервиса сжатия для оптимизации изображений
Существует множество способов сжатия изображений перед их размещением на сайте. Например, вы можете применить сжатие на этапе редактирования. В любом случае это может быть побочным продуктом конвертации из форматов RAW.
Однако наиболее популярным выбором является один из многих онлайн-сервисов. Каждый из них будет предлагать набор алгоритмов и примерный пользовательский интерфейс (UI). Более того, у большинства из них есть бесплатный сервис, по крайней мере, для того, чтобы попробовать приложение, прежде чем совершить его.
В нашей статье об оптимизации изображений мы рассмотрим несколько вариантов, хотя это плагины для WordPress, которые подключаются к интерфейсу прикладного программирования (API). Хорошая новость заключается в том, что многие из этих плагинов также предоставляют онлайн-интерфейс. Например, рассмотрим ShortPixel:
Интерфейс ShortPixel.Здесь вы перетащите изображения в загрузчик, затем подождите, пока приложение сожмет и обработает их. Однако сначала вам нужно выбрать алгоритм , так как процесс начнется сразу.
Выбор прост: две формы сжатия с потерями («с потерями» и «глянцевая») и вариант без потерь. Интерфейс ShortPixel хорошо объясняет разницу между каждым алгоритмом, и вы можете загрузить изображения за считанные секунды.
Хотя оба приложения справятся с вашими требованиями, интерфейс Imagify выглядит более изящным и профессиональным, чем у ShortPixel. Здесь также есть три «уровня сжатия» — Нормальный, Агрессивный и Ультра:
Интерфейс Imagify.Небольшая разница здесь в том, что Imagify начинает со сжатия без потерь и работает до алгоритма с потерями с сильными артефактами. еще пара опций, которых нет в других решениях.
Для начала вы можете сохранить данные EXIF для своего изображения без изменений и даже изменить их размер после преобразования. Иногда это бесценно, особенно если вы хотите применить уровень сжатия, который в противном случае может удалить данные EXIF или ограничить изменение размера изображения.
Как и его мифический тезка, Kraken может обрабатывать ваши изображения и применять различные типы сжатия. Большинство пользователей выберут тип Lossy или Lossless.
Интерфейс Kraken.
Параметры режима Kraken Expert.Это позволяет вам настроить сжатие в соответствии с вашими потребностями, например, вы можете настроить уровни сжатия JPEG и PNG, выбрать сохранение метаданных изображения. , и даже работать с субдискретизацией цветности для дальнейшего изменения цветов.
Сводка
Изображения могут показаться простым аспектом вашего сайта: вы берете файл, загружаете его в WordPress, а затем добавляете блок изображения для его отображения.
Однако процесс подготовки изображения для Интернета включает в себя намного больше, чем вы можете себе представить. Выбранный формат сжатия может повлиять на размер файла, качество изображения и другие параметры.
В этом посте мы рассмотрели сжатие с потерями и без потерь и резюмировали, какой из них вам следует выбрать. Несмотря на баланс между качеством и размером, сжатие с потерями идеально подходит для большинства случаев использования в Интернете. Фотографы или те, кто обеспокоен изменением качества изображений, захотят использовать сжатие без потерь, хотя в отношении размера файла преимуществ меньше.
На какой стороне вы стоите в битве между сжатием с потерями и сжатием без потерь? Сообщите нам свои мысли в разделе комментариев ниже!
Экономьте время, деньги и повышайте производительность сайта с помощью:
- Мгновенная помощь от экспертов по хостингу WordPress, круглосуточно и без выходных.
- Интеграция с Cloudflare Enterprise.
- Глобальный охват аудитории благодаря 29 центрам обработки данных по всему миру.
- Оптимизация с помощью нашего встроенного мониторинга производительности приложений.
Все это и многое другое в одном плане без долгосрочных контрактов, сопровождаемой миграции и 30-дневной гарантии возврата денег. Ознакомьтесь с нашими планами или поговорите с отделом продаж, чтобы найти план, который подходит именно вам.
Загрузка...
