...домашняя лабораторная работа...
House laboratory work

This page in English

   *.gif, *.png or *.jpeg ?

   Вот и выплыл один вопросик, который думаю требует небольшого экспериментального подтверждения и исследования. Ситуация: Допустим, что есть возможность получить две цветные картинки в разных форматах. Картинки небольшие, размером 120х90 пиксел. Вопрос, в этой ситуации, какой формат лучше взять для интернета - *.jpg, *.png или *.gif?
   Возможно где то этот вопрос и освещался, но во время своих "пробежек" по просторам "Интернет" я на подобные документы не наталкивался. Целью небольшого лабораторного инструментального исследования стало:

  •    В каком формате картинка будет меньше размером (размер изображения 120-90 пиксел)?
  •    В каком формате будет качество изображения лучше (размер изображения 120-90 пиксел)?
  •    Насколько зависит размер файла от количества деталей на изображении (размер изображения 120-90 пиксел)?

   Линейный размер у всех картинок одинаковый - 120х90 пиксел.
   Была сделана сделана сцена в 3D Studio Max.
   В качестве первого, простейшего случая, была сделана сделана сцена, в которой присутствует два источника света (Omni, Target Direct), направленная камера и примитив (Box), с вывернутыми нормалями (применён модификатор Flip), который выполняет роль тестового помещения.
   Последовательно в сцену добавлялись детали, накладывались материалы. Рендер проводился в формат *.tga (Targa) картинкой размером 640х480 пиксел. Потом изображение уменьшалось в размере до 120-90 пиксел и исходная картинка из *.tga конвертировась в *.jpeg при помощи ACDSee 32 v2.41. В формат *.png, *.gif изображение преобразовывалось при помощи Corel PHOTO-PAINT 7.
   В формате *.jpeg - степень сжатия 86, в формате *.png при выведении фильтра выбрана "черезстрочная" развёртка, в формате *.gif цветовая палитра преобразована в 8-ми разрядную, палитра - "оптимизированная", "без смешивания", "прозрачность" отсутствует.
   Может возникнуть естественный вопрос - почему я не привожу изображений в формате *.tga? Ответ прост - ежели обратиться к предыдущей статье - *.jpeg - Степень сжатия картинки и её качество, то будет понятно, что при выбранной степени сжатия - качество практически не страдает.
   Результаты приведённой работы приведены в таблице. Следует заметить, что для форматов *.tga и *.jpeg использована политра в 16 миллионов цветов, в то время как для *.gif и *.png - 256 цветов.
   Размерность файлов передалал из кБит в Биты, для более точного отображения зависимости размера файла от формата и "наполненности" картинки.
 
*.jpeg Описание *.gif *.png

*.jpeg - 976 B 		   Файл - simpl_0m.*
   Как видно из картинок, особой разницы в качестве, в данном конкретном случае, не заметно. Зато заметна разница в размерах файлов!
  • *.tga - 43 218 B;
  • *.jpeg - 976 B;
  • *.gif - 6 445 B;
  • *.png - 6 600 B;

*.gif - 6 445 B
*.png - 6 600 B

*.jpeg Описание *.gif *.png

*.jpeg - 1 554 B 		   Файл - simpl_1m.*
   Задача усложняется - добавился один предмет и его тень.
   Разница в качестве не заметна ? ... Не тут-то было! Видно, что на картинке в формате *.jpeg по границе кубика присутствует размытие!
  • *.tga - 43 218 B;
  • *.jpeg - 1 554 B;
  • *.gif - 6 262 B;
  • *.png - 6 206 B;

*.gif - 6 262 B
*.png - 6 206 B

*.jpeg Описание *.gif *.png

*.jpeg - 1 893 B 		   Файл - simpl_2m.*
   Задача усложняется - добавилось ещё два предмета, и их тени.
   Разница в качестве - если присмотреться, то видно на предыдущей и текущей картинках в формате *.jpeg размытия по границе объектов!
  • *.tga - 32 418 B;
  • *.jpeg - 1 893 B;
  • *.gif - 6 176 B;
  • *.png - 6 118 B;

*.gif - 6 176 B
*.png - 6 118 B

*.jpeg Описание *.gif *.png

*.jpeg - 2 110 B 		   Файл - simpl_22m.*
   Добавился ещё один предмет и его тень.
   Разница в качестве - в формате *.jpeg размытие по границе объектов осталось...
  • *.tga - 32 418 B;
  • *.jpeg - 2 110 B;
  • *.gif - 6 087 B;
  • *.png - 6 089 B;

*.gif - 6 087 B
*.png - 6 089 B

*.jpeg Описание *.gif *.png

*.jpeg - 2 588 B 		   Файл - simpl_3m.*
   Теперь раскрасили стены. С созданием растровой карты не стал упражняться, просто применил многокомпонентный материал.
   Разница в качестве - в формате *.jpeg размытие по границе объектов осталось, ко всему ещё и размыло границы цветов на стенах, появился "шум" в общей палитре картинки...
  • *.tga - 32 418 B;
  • *.jpeg - 2 588 B;
  • *.gif - 5 718 B;
  • *.png - 5 600 B;

*.gif - 5 718 B
*.png - 5 600 B

*.jpeg Описание *.gif *.png

*.jpeg - 2 985 B 		   Файл - simpl_4m.*
   Добавлено зеркальное отражение пола.
   Разница в качестве - в формате *.jpeg съедает мелкие детали, шум остался неизменным.
  • *.tga - 32 418 B;
  • *.jpeg - 2 985 B;
  • *.gif - 5 597 B;
  • *.png - 5 792 B;

*.gif - 5 597 B
*.png - 5 792 B

*.jpeg Описание *.gif *.png

3 508 B 		   Файл - simpl_4m.*
   Карта зеркального отражения сделана "ретрейсом", теперь в ней отражаются и стены. Добавлен ещё один объект.
   Разница в качестве - в формате *.jpeg, субъективно, размытие ещё больше усилилось, но "шум" немного уменьшился.
  • *.tga - 43 218 B;
  • *.jpeg - 3 508 B;
  • *.gif - 7 057 B;
  • *.png - 7 105 B;

*.gif - 7 057 B
*.png - 7 105 B
 

   Вывод:
   Рекордсменом по минимизации файла безусловно является формат *.jpeg. Размер файла получается практичесски в два раза меньше, чем у *.gif и *.png! Одно огорчает, что при принятом размере картинки 120х90 пиксел размытие краёв у деталей изображения принимает решающее значение.
   Соответственно, если допускает требование к быстроте загрузки страницы, лучше применить *.gif или *.png - качество картинки будет гораздо лучше!
   Другой вариант - если у вас большое количество маленьких картинок, тогда за счёт применения формата *.jpeg возможно или ускорить загрузку, или уменьшить занимаемое место практичесски в два раза.
   Остался вопрос, а как отразится на качестве изображения преобразование в разную палитру цветов и разные формы *.gif? Это будет рассмотрено в следующий раз.

С Уважением,
Редактирование тэгов и оформление: Сергей Бутович (Sergey Butovich)   my homepage
В случае обнаружения "багов" на этом сайте, пишите: sergeb2@narod.ru
Хостинг от uCoz