«Оптимальный» размер изображения JPEG с точки зрения его размеров

Question

Я планирую написать скрипт, который будет сканировать более 100 000 изображений JPEG и повторно сжимать их, если они «слишком большие» с точки зрения размера файла. Сценарии - это простая часть, но я не уверен, как классифицировать изображение как «слишком большое».

Например, существует изображение размером 2400x600 пикселей с размером файла 1,81 МБ. Команда Photoshop «Сохранить для Интернета» создает файл размером 540 КБ с качеством 60 и одинаковыми размерами. Это около 29% от исходного размера.

Теперь я думаю об использовании этих чисел в качестве ориентира. Что-то вроде 540 КБ / (2400 * 600/1 000 000) = 375 КБ на мегапиксель. Любое изображение большего размера считается большим. Это правильный подход или есть лучший?

Редактировать 1: изображения должны быть оптимизированы для отображения на веб-сайтах.

Редактировать 2: я могу определить желаемое качество печати, экспериментируя, мне нужно знать, большие ли изображения с точки зрения размера файла с размерами w.r.t и нужно ли сохранять в более низком качестве.

Answer 1

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

Вместо этого рассмотрите следующие варианты:

• Достаточный подход. Используйте параметр качества, который вы считаете приемлемым, например 75. Сравните размер результата с исходным изображением и сохраните меньший файл. См. Какое качество выбрать при конвертации в JPG?

• Используйте минимизатор JPEG , например JPEGmini или jpeg-recompress из jpeg-archive . По сути, они предназначены для того, чтобы делать то, что вы пытаетесь сделать, но с большей осведомленностью о внутренностях алгоритма JPEG.

• Создание миниатюр различных размеров , как подсказывает Натанкахилл , с точки зрения веб-разработчика.

Answer 2

Нет. Это неправильный подход.

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

Сделайте тест. Возьмите полностью белый файл того же размера 2400x600px и сохраните его как JPG.

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

Окончательный размер зависит от 3 факторов:

• Размер пикселя
• Настройки сжатия
• Содержание (детализация и сложность изображения)

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

---

Но я понимаю вашу проблему.

Без анализа текущей компрессии изображения сложно определить «оптимальный» вес (относительно наблюдателя или использования изображений)

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

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

Answer 3

Веб-разработчик здесь. Вот как я подхожу к этому:

1. Определите размеры отображаемого изображения и требуемое разрешение экрана.

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

2. Используйте скрипт для создания новых файлов изображений.

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

lena.jpg (Original, 2000x3000)
lena-thumb.jpg (100x150)
lena-thumb@2x.jpg (200x300)
lena-product.jpg (400x600)
lena-product@2x.jpg (800x1200)

3. Сжать.

Сценарий миниатюр должен указывать сжатие jpg при вырезании новых файлов изображений. Однако существуют и другие минифайеры, которые могут еще больше сократить размер файла.

Answer 4

В в среднем , точка обзора JPEG составляет около один бит на пиксель .

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

У вас также есть проблемы, не имея несжатое эталонное изображение для сравнения с, так что вы на самом деле не знаете точно, что это текущее качество изображения у вас есть, и сколько еще вы можете понизить качество, до сих пор приемлемый. Качество может быть определено в определенной степени по таблицам квантования в JPEG, но это также не надежный метод (в частности, оценка качества ImageMagick очень неверна для JPEG с настраиваемыми оптимизированными таблицами квантования).

Сказав это, есть разумный практический подход:

1. Выберите максимальную настройку качества JPEG, которая вас устраивает (где-то в диапазоне от 70 до 85).
2. Повторное сжатие изображений до этого уровня качества.
3. Если повторно сжатое изображение меньше более чем на ~ 10% , то сохраняйте повторно сжатое изображение.

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

Answer 5

Хотя @ в ответе Рафаэля объясняются входы и выходы сжатия JPEG, я постараюсь ответить на ваш веб-сайт и загрузить проблемные сообщения.

Использование изображения на веб-сайте (для дизайна или контента) будет диктовать некоторые императивы: для чего будет использоваться мое изображение? Логотип, фотография обложки, миниатюра, фотография в сообщении в блоге, полноэкранное фото для галереи ... Кроме того, если вы используете его для нескольких целей (например, фотография и миниатюра галереи), вы хотите отклонить ее во всех необходимых размерах. Однако, если вы не создаете свой собственный веб-сайт, большинство современных веб-сервисов будут генерировать изображения меньшего размера из вашей большой картинки для использования на месте.

Теперь, когда вы знаете цель своего изображения, веб-сайту (или CMS или front-end Framework) всегда будет требоваться максимальный размер в пикселях, чтобы ваше изображение соответствовало. Максимальный размер логотипов может составлять 600x600 пикселей, максимальный размер фона - 1280 x 720 пикселей, фотография содержимого для полноэкранного дисплея 1920 x 1080 или собственное разрешение камеры для абсолютного сохранения деталей. Проверьте правильный размер с веб-сайта, на который вы хотите загрузить. Вы хотите соответствовать как минимум одному из максимального требуемого размера пикселя, в зависимости от соотношения, которое вы хотите достичь. Осторожно, некоторые службы обрезают и растягивают ваше изображение, если соотношение сторон не совпадает. В этом случае вам придется повторно наложить изображение, чтобы оно соответствовало требуемому максимальному размеру и соотношению.

Тогда на веб-сайте может быть установлен лимит размера файла (или нет), в зависимости от цели изображения. Что касается времени загрузки страницы, чем легче, тем лучше. В вашем примере изображения с высоким разрешением с разрешением 2400x600px размер от 300 до 500 КБ - это абсолютно точный размер для загрузки. Изображения с содержимым (например, фотографии) могут быть более тяжелыми, если это требуется для целевого изображения (например, полноэкранный режим), вплоть до исходного разрешения вашей камеры, если это необходимо. Если нет указаний, предельный размер файла может быть трудно угадать, так как он может зависеть от оборудования аудитории (мобильный, настольный компьютер ...), качества сети страны аудитории ... Для достижения максимального качества и обслуживания обрабатывайте фотографии по очереди, чтобы получить минимальный размер файла без видимых артефактов. Для удобства или скорости обработки, изменение размера скрипта с использованием общего удовлетворительного уровня сжатия (около 70 должно быть в порядке). Или, в конце концов, найдите промежуточную область, в которой вы обрабатываете свои плоские цветные изображения вместе с высоким уровнем сжатия и ваши детализированные изображения во второй партии с более низким уровнем сжатия. @ xiota's answer также может быть тем инструментом, который вам нужен. Установите свой собственный стандарт здесь.

TL; DR цель изображения на веб-сайте - это ключ для изменения размера / сжатия.

Answer 6

Вы рассчитываете средний сжатый размер пикселя изображения. Если вы поделите его на необработанный размер пикселя (обычно 3 октета для 24-битного RGB), вы получите коэффициент сжатия.

Это хороший показатель, который дает вам информацию о состоянии сжатия изображения, но недостаточно оценить, достаточно ли сжато изображение или нет, потому что степень сжатия зависит не только от профиля сжатия (алгоритм = JPEG , качество = 60/100), но также и на потенциал сжатия изображения: разные изображения с одинаковым необработанным размером и одним и тем же профилем сжатия будут давать разный размер JPEG, потому что изображения более или менее легко сжимать (пустое изображение очень легко сжимать, белого шума нет).

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

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

Существует множество инструментов для повторного сжатия нескольких файлов, вы также можете создавать собственные сценарии, используя правильный технический стек (в основном C ++ и libjpeg), он может быть чертовски быстрым даже для> 100 тыс. Файлов.

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

Answer 7

For example there is a 2400x600px image with a file size of 1.81MB.
Photoshop's save for web command creates a 540KB file at 60 quality and same dimensions.    
This is about 29% of original size.

Исходный несжатый размер составляет 2400 x 600 x 3 = 4 320 000 байт (4,1 МБ), поскольку 24-битный цвет равен , всегда три байта данных RGB на пиксель . Обойти эту абсолютную истину невозможно.

Однако размер JPG также зависит от детализации изображения. Большие гладкие области (например, небо или окрашенные стены) сжимаются лучше, но области с большей детализацией (например, дерево, полное листьев) также не сжимаются. Так что абсолютного числового показателя не существует.

Но 540 КБ - это 0,540 / 4,1 = 13% от исходного размера 4,1 МБ . Это может быть 29% от предыдущего размера JPG, но это 13% от исходного несжатого размера. Так что это 1/8 от исходного несжатого размера, который обычно считается «приличным» качеством. Не оптимальное, не максимальное качество, но в целом приличное, возможно, достаточно хорошее для некоторых применений. Просто говорю, это уже мало.

Чем больше файл JPG, тем лучше качество изображения, а чем меньше, тем меньше качество изображения. Вы должны решить, что достаточно хорошо, но JPG никогда не бывает «слишком большим», так как качество изображения снижается при сжатии JPG. 24-битный цвет имеет три байта на каждый пиксель без сжатия.

Таким образом, решение заключается в том, хотите ли вы, чтобы оно было маленьким или если вы хотите, чтобы оно было хорошим.

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

JPG-артефакты обычно показывают два пути: видимые блоки 8x8 пикселей одного цвета в гладких областях без деталей или в виде видимых неровных краев вокруг краев деталей.

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

Answer 8

Photoshop «Save for Web» на самом деле является довольно хорошим компромиссом между размером файла и качеством, поэтому, если у вас нет более специфических требований, вы должны пойти на это. типичный совет для веб-разработчиков - придерживаться диапазона качества 50-70%. Конечно, есть исключения: вам понадобится 90-95% качества логотипа компании, который должен всегда выглядеть великолепно (или даже конвертировать его в формат без потерь), и достигать 30% на большом, но едва ли видимый фон страницы.

Также не забудьте изменить масштаб изображения. Изображение с разрешением 2400x600 будет отлично смотреться на дисплее 4K, но его масштаб будет изменен на меньших экранах, что приведет к потере полосы пропускания данных без визуального улучшения для пользователя. Проверьте шаблон веб-сайта, который вы будете использовать, чтобы определить оптимальную ширину изображений. Как правило, на момент написания статьи это будет где-то около 1200-1300 пикселей (см. Самое популярное разрешение здесь ).

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