Полезная информация

Общайтесь со знакомыми и друзьями в нашем сообществе в Facebook.

№108-07-2005 23:19:45

Unghost
Призрак-админ
 
Группа: Administrators
Откуда: Moscow, Russia
Зарегистрирован: 08-10-2004
Сообщений: 11771

Изображения в Wiki - минимизация размера

Я заметил что некоторые скриншоты в Wiki выложены в формате JPEG, что на мой взгляд не совсем приемлемо. Этот формат хорош для фотографий, а не для скриншотов настроек расширений. Для них нужно использовать PNG.
Хочу рассказать как я делал скриншоты для справки Firefox с минимизацией размера файлов. Использовал русифицированный GIMP, а ниже приведу оригинальный tutorial - там есть и для Photoshop.
1) Жмете Print Screen (или Alt+Print Screen).
2) Загружаете GIMP.
3) В нем идете в меню Файл - Захватить из буфера обмена. Появится окошко с захваченным изображением.
4) Идете в меню Изображение - Режим - Индексированное
5) В нем выбираете: в "Общие параметры палитры" - "Создать оптимальную палитру". В "Параметры смешивания" - "Без смешивания цветов". В "Макс. количество цветов" - 255. Жмете OK.
6) Идете в Файл - Сохранить. Пишете имя файла с расширением png. Ставите максимальное сжатие.

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


Optimise the images

There are two steps to reducing the size of each image:
   1. Reducing the number of colours to fewer than 256;
   2. Compressing the resulting image as much as possible.

Reducing the number of colours

This step is very important: it is crucial that your chosen Image Manipulation package is flexible in its palettising options.
In Photoshop and its siblings (I used Photoshop Elements), you need to change the mode of the image (from the Image | Mode > menu). For each image:

   1. Choose Indexed Color (Indexed... in The GIMP), and a dialogue box will appear.
   2. Choose a Local palette (Perceptual, Selective or Adaptive are available). Your aim is to let the package choose the most appropriate set of colours itself. In The GIMP, choose Generate Optimum Palette.
   3. Set the number of colours - 128 is fine for Photoshop, but use 256 in The GIMP.
   4. Photoshop only: set the Forced colours to Black & White.
   5. Important: set the Dithering to None (No Colour Dithering in The GIMP). The images are of dialogue boxes, which contain large patches of identical pixels. By preventing dithering, you force the package to keep these large patches, which is good for compression.
   6. Photoshop only: if you check the Preview box, you can see the effects of your options as you change them.


Note: the smaller, icon-sized images compress better if left as True-colour images. If an image is larger than 30×30 pixels, use the above procedure.

Compressing the image files

Image manipulation packages tend to be rather poor at compressing PNG files well. Therefore, you'll need to recompress the images. When saving the files from your chosen Image Manipulation package, ensure they are saved as interlaced files.
If you are including the Help images in the download, you need only use pngout, a closed-source, freeware PNG image optimiser.
If you are having the images hosted by mozilla.org, you will want to save the larger files using interlacing, which allows a low-resolution image to appear quickly and be “upgraded” to the full resolution version as it downloads. For these larger files, you'll need pngrewrite and pngcrush, which are both open-source PNG image manipulators that preserve interlacing.

pngrewrite optimises the palettes of PNG images. Its syntax:

>pngrewrite file.png file_out.png

pngcrush recompresses PNG images, preserving interlacing. The syntax you want:

>pngcrush -e .c.png -brute -l 9 file_out.png

pngout also recompresses PNG images, but removes interlacing. The syntax you want:

>pngout /c3 /b2048 file.png file_out.png


Do not meddle in the affairs of Wizards, for they are subtle and quick to anger.

Отсутствует

 

№208-07-2005 23:44:48

Sergeys
Administrator
 
Группа: Administrators
Откуда: Moscow, Russia
Зарегистрирован: 23-01-2005
Сообщений: 14008
Веб-сайт

Re: Изображения в Wiki - минимизация размера

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


Через сомнения приходим к истине. Цицерон

Отсутствует

 

№309-07-2005 00:30:59

isn
Участник
 
Группа: Extensions
Откуда: Пенза
Зарегистрирован: 18-10-2004
Сообщений: 179
Веб-сайт

Re: Изображения в Wiki - минимизация размера

OptiPNG и pngquant неплохие оптимизаторы.
см. также png_feature

Отсутствует

 

№409-07-2005 01:08:28

lcraFTl
Участник
 
Группа: Extensions
Откуда: Latvia
Зарегистрирован: 17-01-2005
Сообщений: 1461

Re: Изображения в Wiki - минимизация размера

А я просто беру в Paint кидаю Print screen и сохраняю в PNG, думаете без сжатия Paint сохраняет? :D

Отсутствует

 

№509-07-2005 13:52:44

vladmir
SeaMonkey - вот это браузер
 
Группа: Extensions
Откуда: НН
Зарегистрирован: 16-10-2004
Сообщений: 4630

Re: Изображения в Wiki - минимизация размера

lcraFTl
А там в настройках этого Paint нигде дефолтных установок для сохранения нет?
Кинь сюда ссылочку на типичный скрин (уже выложенный) посмотрю для расширения кругозора.
Мне кажется часто gif оптимальнее.

Отсутствует

 

№609-07-2005 14:32:15

Balancer
Участник
 
Группа: Members
Зарегистрирован: 10-11-2004
Сообщений: 898
Веб-сайт

Re: Изображения в Wiki - минимизация размера

vladmir пишет

Мне кажется часто gif оптимальнее.

Очень редко. А так - GIF умер почти. Только 8-битный, без прозрачности и, главное, коммерческий формат. Едва жив пока только за счёт анимации.


... чтобы понять рекурсию, нужно сперва понять рекурсию ...

Отсутствует

 

№709-07-2005 17:49:31

lcraFTl
Участник
 
Группа: Extensions
Откуда: Latvia
Зарегистрирован: 17-01-2005
Сообщений: 1461

Re: Изображения в Wiki - минимизация размера

vladmir
Там вобще никаких установок нету, поэтому я не знаю как он сохраняет, но сохраняет качественно.
http://forum.mozilla.ru/uploaded/desktop.PNG
http://forum.mozilla.ru/uploaded/mostly_cristal.PNG
http://forum.mozilla.ru/uploaded/truelaunchbar.PNG

Отсутствует

 

№809-07-2005 19:33:08

isn
Участник
 
Группа: Extensions
Откуда: Пенза
Зарегистрирован: 18-10-2004
Сообщений: 179
Веб-сайт

Re: Изображения в Wiki - минимизация размера

lcraFTl
Прочитай статью сначала, выше давал ссылку. Дело в том, что даже последний Gimp 2.2.8 не имеет достаточного количества настроек сжатия png, не то что какой-то там paint.

httр://forum.mozilla.ru/uploaded/desktop.PNG
httр://forum.mozilla.ru/uploaded/mostly_cristal.PNG
httр://forum.mozilla.ru/uploaded/truelaunchbar.PNG

Исходный размер файлов: 134.4, 51.5 и 78.4 кб
После optipng -o7 101.5, 41.7 и 56.9 кб соотв. без изменения качественных характеристик.
После pngquant 256 49.1, 20.9 и 25.1 кб.

Отсутствует

 

№909-07-2005 20:02:50

lcraFTl
Участник
 
Группа: Extensions
Откуда: Latvia
Зарегистрирован: 17-01-2005
Сообщений: 1461

Re: Изображения в Wiki - минимизация размера

isn

Это ты Gimp'ом так сжал? У меня нету его, надо будет попробовать, а как по качеству картинки после сжатия?

Отсутствует

 

№1009-07-2005 21:07:45

Sergeys
Administrator
 
Группа: Administrators
Откуда: Moscow, Russia
Зарегистрирован: 23-01-2005
Сообщений: 14008
Веб-сайт

Re: Изображения в Wiki - минимизация размера

Чем больше степень сжатия тем ниже качество любого изображения (справедливо для большинства форматов). Другое дело, что этого достаточно, чтобы этого не было "заметно". Не зависимо какой программой выполнено сжатие, если в самом формате есть определенные параметры, то не создав новый формат, добится одного и того же результата (качества), с большим или меньшим сжатием, не получится. И PNG  - это формат использующий алгоритм сжатия Deflate, что позволяет ему сжимать растровые изображения не только по горизонтали, но и по вертикали. Это обеспечивает более высокую степень компрессии (сжатия).


Через сомнения приходим к истине. Цицерон

Отсутствует

 

№1110-07-2005 01:17:11

Unghost
Призрак-админ
 
Группа: Administrators
Откуда: Moscow, Russia
Зарегистрирован: 08-10-2004
Сообщений: 11771

Re: Изображения в Wiki - минимизация размера

Прочитай статью сначала, выше давал ссылку. Дело в том, что даже последний Gimp 2.2.8 не имеет достаточного количества настроек сжатия png, не то что какой-то там paint.

    httрhmm/forum.mozilla.ru/uploaded/desktop.PNG
    httрhmm/forum.mozilla.ru/uploaded/mostly_cristal.PNG
    httрhmm/forum.mozilla.ru/uploaded/truelaunchbar.PNG

Исходный размер файлов: 134.4, 51.5 и 78.4 кб
После optipng -o7 101.5, 41.7 и 56.9 кб соотв. без изменения качественных характеристик.
После pngquant 256 49.1, 20.9 и 25.1 кб.

Это не имеет никакого отношения к данному топику. Все вышеприведенные картинки - снимки рабочего стола в truecolor.
Я говорил о скриншотах расположенных в Wiki (в основном скриншоты настроек). Для них 255 цветов - более чем достаточно. А можно и меньше.


Do not meddle in the affairs of Wizards, for they are subtle and quick to anger.

Отсутствует

 

№1210-07-2005 01:24:25

Unghost
Призрак-админ
 
Группа: Administrators
Откуда: Moscow, Russia
Зарегистрирован: 08-10-2004
Сообщений: 11771

Re: Изображения в Wiki - минимизация размера

Сейчас сделал снимок окна настроек Firefox и прогнал через Gimp 2.0.2 - 10333 байт.
Прогнал через optipng -o 9 - 10321 байт.

И давайте не углубляться здесь в очередную holy war. Им место во Флейме.


Do not meddle in the affairs of Wizards, for they are subtle and quick to anger.

Отсутствует

 

№1310-07-2005 09:33:03

vladmir
SeaMonkey - вот это браузер
 
Группа: Extensions
Откуда: НН
Зарегистрирован: 16-10-2004
Сообщений: 4630

Re: Изображения в Wiki - минимизация размера

Balancer

без прозрачности

Это у тебя какой-то спец-gif - у нормального gif прозачность есть, разумеется, но в данном случае не имеет значения, поскольку нужны квадратные области без прозрачности.
Меня почему-то мало интересуют рассуждения вокруг да около - важно что даёт лучший результат.
lcraFTl

Там вобще никаких установок нету

Всё для блага человека - чтобы не мучиться с выбором.

но сохраняет качественно

Так об чём и спич - качественно - значит тяжело, а нужно минимально-качественно.
Вообще-то, надеялся на рабочие картинки - по теме. Для рабоч стола размер не так важен.
Если цветов всего несколько (окно настроек) gif даёт минимальные размеры.
Но я пока не повозился с png в этом аспекте - позже доложу.

Отсутствует

 

№1410-07-2005 17:33:56

vladmir
SeaMonkey - вот это браузер
 
Группа: Extensions
Откуда: НН
Зарегистрирован: 16-10-2004
Сообщений: 4630

Re: Изображения в Wiki - минимизация размера

Одну картинку попробовал. Сохранил окно настроек в Gax pro в тифе, открыл в Фотошопе, сохранил через Save for web. Действительно в PNG-8 при одинаковом качестве есть некоторый выигрыш по весу по сравнению с GIF.
для темы Pinball достаточно 6 цветов

http://forum.mozilla.ru/uploaded/optimized-gif.gif

http://forum.mozilla.ru/uploaded/optimized-png.png

Отсутствует

 

Board footer

Powered by PunBB
Modified by Mozilla Russia
Copyright © 2004–2020 Mozilla Russia GitHub mark
Язык отображения форума: [Русский] [English]