本文へスキップ

SVG最適化

SVGのコメントとメタデータを整理します。画像とコードを確認し、パスとIDを維持したSVGを保存できます。

UTF-8のSVGは200,000文字、ファイルは800KBまでです。

結果

SVGコードを貼り付けるかファイルを選択してください。

コメントとXML宣言を削除します。パス・ID・テキスト内の空白は維持し、容量が減らない場合もあります。

ファイルはこの端末の中だけで処理され、サーバーには送信されません。 仕組みを見る

SVGコードを整理して小さなベクターファイルにする図

SVGコードを整理して保存

UTF-8のSVGを開くかコードを貼り付け、「SVGを最適化」を押します。元と結果のバイト数を比較し、画像とコードを確認してSVGを保存します。ファイルは800KB、コードは200,000文字までです。

最適化する項目

コメントとXML宣言を削除し、ブラウザーのXMLシリアライズ機能でコードを整えます。メタデータ削除ではmetadata要素とInkscape・Sodipodiの編集属性も削除します。パス座標・ID・viewBox・テキスト内の空白は維持します。パス結合や座標の丸めは行いません。

対応範囲と確認

スクリプト・style要素・アニメーション・画像要素(image・feImage)・外部参照・別名前空間の要素には対応しません。外部ファイルに依存しない静的SVGを使い、スタイルは個別属性か安全なインライン形式で指定してください。結果が元より小さくならない場合もあります。実際に使う大きさと背景でも画像を確認してください。

参考資料

よくある質問

SVGZやPNGで保存できますか?

いいえ。結果は非圧縮のSVGファイルです。PNG変換やgzip圧縮のSVGZは提供しません。

IDを短くしないのはなぜですか?

IDはグラデーション・クリッピング・アクセシビリティラベル・外部CSSから参照される場合があります。参照を壊さないようIDを保持します。

最終更新日: