Каков «оптимальный» размер файла изображений JPEG относительно их размеров?

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Окончательный размер зависит от этих 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 при вырезании новых файлов изображений. Однако есть и другие минифайеры, которые могут еще больше сократить размер файла.

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

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

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

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

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

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

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

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

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

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

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

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. Если это требуется, рекомендуется всегда повторно сохранять данные в соответствии с исходными настройками сжатия.

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

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

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