Image 透明单像素图像的最小文件大小

Image 透明单像素图像的最小文件大小,image,graphics,transparency,filesize,Image,Graphics,Transparency,Filesize,我正在寻找最小的(在文件大小方面)透明1像素图像 目前我有一个49字节的gif,这似乎是最流行的 但我记得很多年前有一个小于40字节的。可能是32字节 谁能做得更好?只要现代网络浏览器能够显示图形格式并尊重其透明度,图形格式就不重要了 更新:好的,我发现了一个42字节的透明单像素gif: UPDATE2:在某些客户端中,小于43字节的内容可能不稳定。不可能是这样。是43字节,稍微有点小。签出此文件(43字节)。小于49:D 见:,35B Perl(45B)中的备选方案: 运行它 $ per

我正在寻找最小的(在文件大小方面)透明1像素图像

目前我有一个49字节的gif,这似乎是最流行的

但我记得很多年前有一个小于40字节的。可能是32字节

谁能做得更好?只要现代网络浏览器能够显示图形格式并尊重其透明度,图形格式就不重要了

更新:好的,我发现了一个42字节的透明单像素gif:

UPDATE2:在某些客户端中,小于43字节的内容可能不稳定。不可能是这样。

是43字节,稍微有点小。

签出此文件(43字节)。小于49:D

  • 见:,35B

  • Perl(45B)中的备选方案:

运行它

$ perl tinygif > tiny.gif
$ ll tiny.gif
-rw-r--r--  1 stackoverflow  staff    45B Apr  3 10:21 tiny.gif
你不应该真的使用“间隔GIF”。它们是在90年代使用的;现在它们已经非常过时了,而且没有任何用途,它们导致了一些可访问性和兼容性问题


使用CSS。

我记得很久以前有一次,我试图创建尽可能最小的gif。如果你遵循标准,如果我没记错的话,大小是32字节。但是你可以“破解”这个规范,并拥有一个26-28字节,这将在大多数浏览器中显示。这个GIF并不完全“正确”,但有时会起作用。只需使用GIF头规范和十六进制编辑器。

以下是我在C#字节数组中使用的内容(避免文件访问)

在asp.net MVC中,可以这样返回

return File(TrackingGif, "image/gif");

为了扩展Jacob的字节数组答案,我为我在photoshop中制作的transparant1x1 gif生成了c#字节数组

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};

透明点,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字节:

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";
前两个是我不久前发现的(在timthumb脆弱性时代),我不记得它们的来源。我找到的最新的一个

备注:用于跟踪目的,而不是作为间隔。

是一种37字节的透明GIF,由gifsicle制成

在css ready base64格式中:

data:image/gif;base64,R0lGODlhAQABAHAAACH5BAUAAAAALAAAAAABAAEAAAICRAEAOw==

绝对最小的有效透明GIF为33字节。

data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEAAAAALAAAAAABAAEAAAIA

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 00
这过去是32字节,但事实证明,MacOS上的Safari需要一个额外的
0x00
字节,因为LZW数据中有这个字节

解释 实现尽可能最小的GIF取决于所使用的GIF规范的实现。在解码GIF文件时,Web浏览器通常都比较宽松。有一次,14个字节足够在Chrome中渲染一个透明的GIF,但它不再工作。您可能会发现一个GIF在一个浏览器中透明,但在另一个浏览器中为白色/黑色。例如,一个不同的22字节GIF在Chrome中仍然有效,但在现代Firefox中是不透明的白色。然后它甚至可能无法在Gimp、Paint和Photoshop等软件中打开。因此,一般来说,最好遵循这些标准,不要依赖老套的解决方案(尽管,2020年以后的间隔GIF几乎没有实际用途!)

按照规范,我发现最小的接近有效的透明GIF是32字节。“接近有效”,因为拖车和一些LZW数据可能会被丢弃,并且在几乎所有软件中仍然会打开。更严格地说,在编写Safari时,渲染需要33个字节,而严格有效的GIF将是37个字节,这将为LZW数据子块增加3个额外字节,为拖车增加1个字节

这是通过以下步骤完成的,每个组件可以分解如下:

  • 文件签名/版本,6字节
  • 逻辑屏幕描述符,7字节
  • 可选:全局颜色表,6字节
  • 可选:图形控件扩展,8字节²
  • 图像描述符,10字节
  • LZW子块图像数据,1-4字节³
  • 可选:拖车(
    0x3B
    ),1字节⁴ 通过在
    ²这是大多数软件透明度所必需的
    ³只需要2或3个字节的LZW数据,这些字节几乎可以是任何内容。尽管严格要求仅使用
    0x02
    的第一个字节。在某些情况下(Safari),可能需要终止字节
    0x00

    ⁴ 拖车可以在没有不良影响的情况下拆除

    大多数GIF软件都要求提供全局/局部颜色表。进一步减少(例如删除全局颜色表)可能在某些浏览器中起作用,但其效果通常是特定于实现的。编辑:有一种方法可以禁用全局颜色表,它似乎不会导致任何问题

    其他例子: 有效的示例必须在所有支持GIF(绘画、Photoshop、Gimp)的应用程序以及浏览器中打开

    以下33个字节在所有情况下都是不透明的白色(3个额外的LZW字节):

    47 49 46 38 37 61 01 00 01 00 80 01 00 FF FF FF 00
    00 00 2C 00 00 00 00 01 00 01 00 00 02 02 44 01
    
    data:image/gif;base64,R0lGODdhAQABAIABAP///wAAACwAAAAAAQABAAACAkQB
    
    47 49 46 38 37 61 01 00 01 00 80 01 00 FF FF FF 00 
    00 00 2C 00 00 00 00 01 00 01 00 00 02
    
    data:image/gif;base64,R0lGODdhAQABAIABAP///wAAACwAAAAAAQABAAAC
    
    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,R0lGODlhAQABAAAAACwAAAAAAQABAAAC
    
    以下30个字节在所有情况下都应该是不透明的白色,但在Chrome中是透明的(可能是Chrome中的bug):

    47 49 46 38 37 61 01 00 01 00 80 01 00 FF FF FF 00
    00 00 2C 00 00 00 00 01 00 01 00 00 02 02 44 01
    
    data:image/gif;base64,R0lGODdhAQABAIABAP///wAAACwAAAAAAQABAAACAkQB
    
    47 49 46 38 37 61 01 00 01 00 80 01 00 FF FF FF 00 
    00 00 2C 00 00 00 00 01 00 01 00 00 02
    
    data:image/gif;base64,R0lGODdhAQABAIABAP///wAAACwAAAAAAQABAAAC
    
    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,R0lGODlhAQABAAAAACwAAAAAAQABAAAC
    
    以下24个字节在Chrome中呈现为透明的GIF,在Firefox中呈现为白色,在Photoshop/Paint/Gimp中呈现为黑色(有效的GIF,但缺少颜色信息——无法预测):

    47 49 46 38 37 61 01 00 01 00 80 01 00 FF FF FF 00
    00 00 2C 00 00 00 00 01 00 01 00 00 02 02 44 01
    
    data:image/gif;base64,R0lGODdhAQABAIABAP///wAAACwAAAAAAQABAAACAkQB
    
    47 49 46 38 37 61 01 00 01 00 80 01 00 FF FF FF 00 
    00 00 2C 00 00 00 00 01 00 01 00 00 02
    
    data:image/gif;base64,R0lGODdhAQABAIABAP///wAAACwAAAAAAQABAAAC
    
    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,R0lGODlhAQABAAAAACwAAAAAAQABAAAC
    

    我认为这是最令人难忘的1x1(38字节):

    根据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>
    
    GIF标题
    偏移长度内容
    0 3字节“GIF”
    3字节“87a”或“89a”
    6.2字节
    8.2字节
    
    第一个
    %01%00
    是宽度=0x0001

    请注意,1px是
    %01%00
    等于0x0001

    %00%01
    否则将为0x0100

    二是身高,同上

    接下来的3个字节你们可以输入任何东西,浏览器可以解析它

    e、 g.
    /
    ,,
    ++

    最后一个字节必须是:

    顺便说一下,如果您在3个字节处使用
    //
    \\\\