наименьший размер файла для прозрачного однопиксельного изображения
Я ищу наименьшее (с точки зрения размера файла) прозрачное изображение размером 1 пиксель.
В настоящее время у меня есть gif размером 49 байт, который кажется самым популярным.
Но я помню, что много лет назад у меня был один, который был меньше 40 байт. Возможно, 32 байта.Может ли кто-нибудь сделать лучше? Графический формат не вызывает беспокойства до тех пор, пока современные веб-браузеры могут отображать его и уважать прозрачность.
UPDATE : Хорошо, я нашел 42-байтовый прозрачный одиночный пиксель gif: http://bignosebird.com/docs/h3.shtml
UPDATE2 : похоже, что все, что меньше 43 байт, может быть нестабильным в некоторых клиентах. Этого не может быть.
11 ответов:
Проверьте это
blank.gif
файл (43 байта). Менее 49 :D
Вот 32-байтовый прозрачный GIF, который (должен) работать везде
data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEAAAAALAAAAAABAAEAAAI= 47 49 46 38 39 61 01 00 01 00 00 00 00 21 F9 04 01 00 00 00 00 2C 00 00 00 00 01 00 01 00 00 02
Объяснение
Достижение минимально возможного GIF зависит от реализации спецификации GIF, которая используется. Веб-браузеры обычно снисходительны, когда речь заходит о декодировании GIF-файлов. Вы можете найти действительно маленький GIF, который работает как прозрачный в одном браузере, но белый/черный в другом. И он может даже не открываться в таких программах, как Gimp, Paint и Photoshop.
Самый маленький почти допустимый прозрачный GIF равен 32 байтам. "Почти действительный", потому что трейлер и некоторые данные LZW могут быть отброшены, и он все равно будет открыт практически во всех программах.
Это делается с помощью GIF spec , и каждый компонент может быть разбит следующим образом:
- сигнатура файла / версия, 6 байт
- логический дескриптор экрана , 7 байт
- необязательно: глобальная таблица цветов , 6 байтов1
- необязательно: расширение графического Управления , 8 bytes2
- дескриптор изображения , 10 байт
- LZW Data , 1-4 bytes3
- необязательно: прицеп (
0x3B
), 1 byte⁴1 глобальную таблицу цветов можно безопасно удалить, отключив ее в дескрипторе логического экрана
2 это необходимо для прозрачности в большинстве программ
3 требуется только 3 байта данных LZW, и эти байты могут быть практически любыми. Хотя строго требуется только первый байт0x02
.
Трейлер можно извлечь без вредных последствий.Большинство программного обеспечения гиф требуют, чтобы присутствовать глобальная/локальная таблица цветов. Дальнейшие сокращения (например, удаление глобальной таблицы цветов) могут работать в некоторых браузерах, но их эффекты обычно зависят от реализации. Edit: существует флаг для отключения глобальной таблицы цветов, и это, кажется, не вызывает никаких проблем.
Другие Примеры:
Тот самый следующие 24 байта отображаются как прозрачный GIF в Chrome, однако он непрозрачно белый в Firefox:
47 49 46 38 39 61 01 00 01 00 00 00 00 2C 00 00 00 00 01 00 01 00 00 02 data:image/gif;base64,R0lGODlhAQABAAAAACwAAAAAAQABAAA=
следующие 14 байт раньше работали только в Chrome, но больше нет:47 49 46 38 39 61 01 00 01 00 00 00 00 2C data:image/gif;base64,R0lGODlhAQABAAAAACw=
Вот что я использую в массиве байтов C# (избегает доступа к файлам)
static readonly byte[] TrackingGif = { 0x47, 0x49, 0x46, 0x38, 0x39, 0x61, 0x1, 0x0, 0x1, 0x0, 0x80, 0x0, 0x0, 0xff, 0xff, 0xff, 0x0, 0x0, 0x0, 0x2c, 0x0, 0x0, 0x0, 0x0, 0x1, 0x0, 0x1, 0x0, 0x0, 0x2, 0x2, 0x44, 0x1, 0x0, 0x3b };
В asp.net MVC это может быть возвращено следующим образом
return File(TrackingGif, "image/gif");
Чтобы расширить ответ Джейкоба на массив байтов, я сгенерировал массив байтов c# для транспаранта 1x1 gif, который я сделал в photoshop.
static readonly byte[] TrackingGif = { 0x47, 0x49, 0x46, 0x38, 0x39, 0x61, 0x01, 0x00, 0x01, 0x00, 0x81, 0x00, 0x00, 0xff, 0xff, 0xff, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x21, 0xff, 0x0b, 0x4e, 0x45, 0x54, 0x53, 0x43, 0x41, 0x50, 0x45, 0x32, 0x2e, 0x30, 0x03, 0x01, 0x01, 0x00, 0x00, 0x21, 0xf9, 0x04, 0x01, 0x00, 0x00, 0x00, 0x00, 0x2c, 0x00, 0x00, 0x00, 0x00, 0x01, 0x00, 0x01, 0x00, 0x00, 0x08, 0x04, 0x00, 0x01, 0x04, 0x04, 0x00, 0x3b};
Http://polpo.org/blank.gif составляет 37 байт прозрачный gif, сделанные с gifsicle.
В css-готовом формате base64:
data:image/gif;base64,R0lGODlhAQABAHAAACH5BAUAAAAALAAAAAABAAEAAAICRAEAOw==
Смотрите: http://www.google-analytics.com/__utm.gif , 35B
Альтернатива в Perl (45B):
## tinygif ## World's Smallest Gif ## 35 bytes, 43 if transparent ## Credit: http://www.perlmonks.org/?node_id=7974 use strict; my($RED,$GREEN,$BLUE,$GHOST,$CGI); ## Adjust the colors here, from 0-255 $RED = 255; $GREEN = 0; $BLUE = 0; ## Set $GHOST to 1 for a transparent gif, 0 for normal $GHOST = 1; ## Set $CGI to 1 if writing to a web browser, 0 if not $CGI = 0; $CGI && printf "Content-Length: %d\nContent-Type: image/gif\n\n", $GHOST?43:35; printf "GIF89a\1\0\1\0%c\0\0%c%c%c\0\0\0%s,\0\0\0\0\1\0\1\0\0%c%c%c\1\ +0;", 144,$RED,$GREEN,$BLUE,$GHOST?pack("c8",33,249,4,5,16,0,0,0):"",2,2,4 +0;
Запустите его ...
$ perl tinygif > tiny.gif $ ll tiny.gif -rw-r--r-- 1 stackoverflow staff 45B Apr 3 10:21 tiny.gif
Прозрачная точка, 43 байта:
echo "\x47\x49\x46\x38\x39\x61\x1\x0\x1\x0\x80\x0\x0\xff\xff\xff\xff\xff"; echo "\xff\x21\xf9\x04\x1\x0a\x0\x1\x0\x2c\x0\x0\x0\x0\x1\x0\x1\x0"; echo "\x0\x2\x2\x4c\x1\x0\x3b";
Оранжевая точка, 35 байт:
echo "\x47\x49\x46\x38\x37\x61\x1\x0\x1\x0\x80\x0\x0\xfc\x6a\x6c\x0"; echo "\x0\x0\x2c\x0\x0\x0\x0\x1\x0\x1\x0\x0\x2\x2\x44\x1\x0\x3b";
Без таблицы цветов (возможно, окрашенной в черный цвет), 26 байт:
Первые два я нашел некоторое время назад (во времена уязвимости timthumb), и я не помню источников. Последний я нашел здесь. P.S.: использовать в целях слежения, а не в качестве спейсеров.echo "\x47\x49\x46\x38\x39\x61\x1\x0\x1\x0\x0\xFF"; echo "\x0\x2C\x0\x0\x0\x0\x1\x0\x1\x0\x0\x2\x0\x3B";
Я думаю, что это самый запоминающийся 1x1 (38 байт):
data:image/gif,GIF89a%01%00%01%00///;
Согласно спецификации заголовка GIF:
GIF Header Offset Length Contents 0 3 bytes "GIF" 3 3 bytes "87a" or "89a" 6 2 bytes <Logical Screen Width> 8 2 bytes <Logical Screen Height>
Первый
%01%00
- ширина = 0x0001Обратите внимание, что 1px
%01%00
равно 0x0001Не
%00%01
иначе это будет 0x0100Вторая-высота, такая же, как и выше
Следующие 3 байта вы можете ввести что угодно, браузер может разобрать его
Например
///
или!!!
или,,,
или;;;
или+++
Последний байт должен быть:
;
,
!
Кстати, если вы используете
///
или\\\
на 3 байта рядом с размеромЗаголовок страницы будет отображать последний символ, в противном случае будет отображаться
gif,...
Проверено с Chrome, Firefox оба работали, IE не работает
Http://www.maproom.co.uk/0.gif - это 43 байта, немного бреется.
На самом деле вы не должны использовать "spacer gif". Они использовались в 90-х годах; сейчас они очень устарели, и у них нет никакой цели вообще, и они вызывают несколько проблем доступности и совместимости.
Используйте CSS.
Я помню, как однажды, давным-давно, я попытался создать самый маленький gif. Если вы следуете стандарту, если я правильно помню, размер составляет 32 байта. Но вы можете "взломать" спецификацию и иметь 26-28 байт, что будет показано в большинстве браузеров. Этот GIF не совсем "правильный", но иногда работает. Просто используйте спецификацию заголовка GIF и шестнадцатеричный редактор.