web-dev-qa-db-ja.com

透明な単一ピクセル画像の最小ファイルサイズ

（ファイルサイズの点で）最小の透明な1ピクセルの画像を探しています。

現在私は49バイトのGIFを持っていますが、これは最も人気があるようです。

しかし、私は何年も前に、40バイト未満のサイズがあったことを覚えています。 32バイトでした。

誰もがうまくできる？最新のWebブラウザーが表示して透明性を尊重できる限り、グラフィックス形式は関係ありません。

[〜＃〜] update [〜＃〜]：OK、42バイトの透明な1ピクセルのgifが見つかりました： http： //bignosebird.com/docs/h3.shtml

UPDATE2：一部のクライアントでは、43バイト未満のものは不安定になる可能性があります。それをすることはできません。

imagegraphicstransparencyfilesize
62
zaf

これをチェックアウト blank.gif ファイル（43バイト）。 49未満：D

20
gmunkhbaatarmn

これが 2バイト透過 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ファイルのデコードに関しては、通常、Webブラウザーは寛大です。あるブラウザでは透明として機能し、別のブラウザでは白/黒として機能する非常に小さなGIFを見つけることがあります。また、Gimp、Paint、Photoshopなどのソフトウェアでは開かない場合もあります。

最も小さいnear-valid透過GIFは32バイトです。トレーラーと一部のLZWデータは破棄でき、実質的にすべてのソフトウェアで開くことができるため、「ほぼ有効」。

これは GIF spec に従って行われ、各コンポーネントは次のように分解できます。

  1. ファイルの署名/バージョン、6バイト
  2. 論理画面記述子、7バイト
  3. オプション：グローバルカラーテーブル、6バイト¹
  4. オプション：グラフィックスコントロール拡張機能、8バイト²
  5. Image Descriptor、10バイト
  6. LZWデータ、1-4バイト³
  7. オプション：Trailer（0x3B）、1バイト⁴

（グローバルカラーテーブルは、 論理画面記述子 で無効にすることで安全に削除できます
²これは、ほとんどのソフトウェアの透過性のために必要です
³LZWデータは3バイトのみ必要で、バイトはほとんど何でもかまいません。 0x02の最初のバイトのみが厳密に必要ですが。
⁴トレーラーは悪影響を与えることなく削除できます。

ほとんどのGIFソフトウェアには、グローバル/ローカルカラーテーブルが必要です。一部のブラウザでは、さらに削減（グローバルカラーテーブルの削除など）が機能する場合がありますが、その効果は通常、実装によって異なります。 編集：グローバルカラーテーブルを無効にする flag があり、問題が発生することはないようです。

その他の例：

次の24バイトはChromeでは透明なGIFとしてレンダリングされますが、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=
81
bryc

これは私が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");
27
Jacob

ジェイコブのバイト配列の答えを拡張するために、フォトショップで作成したtransparant 1x1 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};
18
Michiel Cornille

http://polpo.org/blank.gif は、gifsicleで作成された37バイトの透明GIFです。

CSS対応のbase64形式：

data:image/gif;base64,R0lGODlhAQABAHAAACH5BAUAAAAALAAAAAABAAEAAAICRAEAOw==
14
polpo

  • 参照： 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
7
miku

透明なドット、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";

私が少し前に見つけた最初の2つ（timthumbの脆弱性の時代に）で、ソースを覚えていません。私が見つけた最新のもの here 。

PS：スペーサーとしてではなく、トラッキングの目的で使用してください。

4
s3v3n

これは最も印象的な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になります。

2番目は高さと同じです。

次の3バイトは何でも入力でき、ブラウザはそれを解析できます

例えば///または!!!または,,,または;;;または+++

最後の1バイトは：;,!

ちなみに、サイズの横にある3バイトで///または\\\を使用する場合

ページタイトルには最後の文字が表示され、それ以外の場合はgif,...が表示されます

chromeでテスト済み、Firefoxは両方とも機能し、IEは機能しません

1
user3896501

昔、私は可能な限り最小のgifを作成しようとしたことを覚えています。あなたが標準に従うならば、私が正しく覚えているならば、サイズは32バイトです。しかし、仕様を「ハック」して26〜28バイトにすることができ、ほとんどのブラウザで表示されます。このGIFは完全に「正しい」わけではありませんが、機能することがあります。 GIFヘッダー仕様とHEXエディターを使用するだけです。

0
Ross

http://www.maproom.co.uk/0.gif 43バイトで、少しひげをそります。

0
Dested

「スペーサーgif」は実際には使用しないでください。それらは90年代に使用されました。現在、これらは非常に古く、まったく目的がなく、いくつかのアクセシビリティと互換性の問題を引き起こしています。

CSSを使用します。

0
Thomas Bonini