CSS データ URI 変換
スタイルシートを貼り付けるか、ファイルを選ぶか、リモートの CSS ファイルの URL を入力します。変換ツールはすべての url(...) 参照を見つけ、サイズ上限より小さいリソースをダウンロードして Base64 データ URI に置き換えます。
| リソース | サイズ | 結果 |
|---|
CSS 画像のインライン化が効果的な場合
外部画像は 1 つごとにリクエストが発生します。小さなアイコンを Base64 データ URI としてインライン化すれば、そのリクエストをなくしてちらつきも防げます。数 KB を超えると、33% のサイズ増加とキャッシュが効かなくなるデメリットが利点を上回るため、この変換ツールにはサイズ上限があります。結果を gzip や Brotli で配信すれば、Base64 の増加分の大部分を取り戻せます。
よくある質問
CSS の画像はすべてインライン化すべきですか？
いいえ。インライン化するのは小さなアイコンや背景だけにしてください。大きな画像は CSS を肥大化させ、表示をブロックし、個別にキャッシュできません。
コメント (0)
「CSS データ URI 変換」についての質問、アイデア、不具合はありますか？コメントを残したり、ツールを評価したり、他の人に返信したりできます。
まだコメントはありません。最初のフィードバックをお寄せください！