SVGビューアー＆最適化ツール — ファイルを軽量化

Illustrator・Figma・InkscapeからエクスポートされたSVGファイルには多くの場合、不要なメタデータが数十キロバイト含まれています。最適化ツールはそれを削除して40〜70%ファイルサイズを削減します。

最適化されるもの

エディタメタデータ（バージョン・ファイル名）、XMLコメント、未使用の定義と名前空間、冗長なスタイル属性、パス座標の過剰な小数精度。いずれもブラウザには不可視ですが、ファイルを肥大化させます。

インラインSVG vs. 外部ファイル

インラインSVGはCSSとJSによるアニメーションが可能で追加HTTPリクエストが不要。外部SVGファイル（<img>経由）はキャッシュ可能。アニメーション可能なアイコンにはインライン、再利用可能な静的画像には外部を使用。

SVGのアクセシビリティ

スクリーンリーダー用の代替テキストとして<title>要素を追加。role="img"とaria-labelledbyを使用。装飾的なSVGにはaria-hidden="true"を設定。アクセシブルなSVGはSEOとユーザー体験の両方を改善します。