ダミーに使う最小のインライン画像 （data-url base64）

Tweet

238

Lazy Load 等で何かのアクションがあってから画像を読み込ませるようにする

遅延の動作を行い、サイトのファーストビューが早く表示されるようにしたり

無駄に、画像の読み込みをしないように色々対策を行いますが、その際に imgタグにはダミーとなる画像を設定しておかないと、HTMLの構文的にはよろしくないのでインライン画像を使ってダミーとするのが主流です

そこで、インライン画像も

サイズが小さければ小さいほどいいので

調べてみました

現在最も最小で見つけたのがこちら 42文字

ただ、モバイル向けではうまくいかないとか

data:image/gif;base64,R0lGODlhAQABAAAAACw=

無色透明で 74文字

data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==

data-url での最小の画像につてこちらのページで色々、議論されています

http://stackoverflow.com/questions/9126105/blank-image-encoded-as-data-uri

Tweet

短縮URL:

2015年01月16日 WEB制作系 base64インライン画像 data-url