SVG最適化ツール

グラフィックの見た目を損なわずに、SVGコードをクリーンアップしてファイルサイズを削減。

SVGコードを貼り付けて、最適化を実行してください。

入力されたSVGコードの最適化はすべてブラウザ上で行われます。BroBroGoにデータがアップロードされることはありません。

よくある質問

どのようなデータが削除されますか？

コメント、メタデータ、エディタ用ネームスペース、属性間の不要なスペース、未使用のネームスペースを削除し、カラーコードを同等の短い表現に変換します。viewBox、ID、ラベル、およびジオメトリ形状はそのまま保持されます。

すべてのSVGを最適化できますか？

標準的なインラインSVGコードに対応しています。ドキュメントタイプ（DOCTYPE）やカスタムエンティティ宣言が含まれるSVGは、解析の安全性を確保するため処理がブロックされます。これらの宣言を削除してから再度お試しください。

グラフィックの見た目に影響はありますか？

この最適化ツールは、パスの書き換え、IDのリネーム、viewBoxの削除、座標精度の丸め処理などを回避します。デザインワークフローのためにコメントやメタデータが必要な場合は、元のファイルのバックアップを保管しておくことをおすすめします。

BroBroGo 編集チームが執筆・確認しています。最終更新日:

SVGファイル軽量化の仕組みとウェブパフォーマンスへの影響

SVG（Scalable Vector Graphics）はXMLベースのベクター画像フォーマットであり、解像度に依存しない鮮明な描画を可能にします。しかし、グラフィックエディタから書き出された生のSVGコードには、ウェブ上での表示には直接関係のない不要なデータが多く含まれています。

これらの不要なデータを削除し、コードをクリーンアップすることは、ウェブサイトの読み込み速度向上に直結します。特にインラインSVGとしてHTMLに直接埋め込む場合、ファイルサイズを削減することで、ブラウザのHTML解析時間を短縮し、ユーザー体験（UX）を向上させることができます。

安全なクリーンアップで削除される要素と保持されるデータ

本ツールは、グラフィックの見た目や構造を損なうことなく、コードの冗長な部分のみを排除する「ロスレス（無劣化）」な最適化を行います。

削除されるデータ

  • XMLコメントおよびメタデータ
  • グラフィックエディタ固有のネームスペース（エディタ用ネームスペース）
  • 属性間の不要なスペース
  • 使用されていないネームスペース
  • カラーコード（同等のより短い表現への変換）

保持されるデータ

  • viewBox 属性
  • 各要素の id 属性
  • ラベル
  • ジオメトリ（形状データ）

パスの書き換え、IDのリネーム、viewBox の削除、および座標精度の丸め処理は回避されるため、既存のCSSやJavaScriptによる制御が崩れる心配はありません。

XMLエンティティ解析におけるセキュリティ制限

ウェブアプリケーションにおいてXMLデータを解析する際、外部エンティティの参照やドキュメントタイプ（DOCTYPE）の宣言を許可することは、セキュリティ上のリスクを伴います。

安全性を確保するため、本ツールではドキュメントタイプやカスタムエンティティ宣言が含まれるSVGコードの処理をブロックする仕様を採用しています。これらの宣言が含まれるファイルを最適化する場合は、あらかじめテキストエディタ等で該当箇所を削除してから入力する必要があります。

ブラウザ内処理によるプライバシー保護

入力されたSVGコードの最適化はすべてブラウザ上で行われます。BroBroGoにデータがアップロードされることはありません。外部サーバーにデータを送信することなく処理が完結するため、機密性の高いグラフィックデータであっても安心して処理を実行できます。

ツールのエラーメッセージと対処方法

最適化の実行中に問題が発生した場合、以下のエラーメッセージが表示されます。

発生するエラー・状態 表示されるメッセージ 原因と対処法
入力エリアが空の状態で実行 最初にSVGコードを貼り付けてください。 SVGコードを入力エリアに貼り付けてから再度実行してください。
SVG要素が存在しない <svg> 要素が見つかりませんでした。 入力されたコードが正しいSVGフォーマットであるか確認してください。
DOCTYPEやカスタムエンティティの検出 このSVGにはドキュメントタイプまたはカスタムエンティティが含まれています。最適化する前にこれらを削除してください。 セキュリティ制限のため処理がブロックされました。該当する宣言を削除してください。
規定の文字数制限を超過 このSVGはサイズが大きすぎます。{max} 文字未満に抑えてください。 ツールが許容する最大文字数制限を超えています。ファイルサイズを小さくしてください。
処理時間が15秒を超過 処理に時間がかかりすぎたため中断されました。より小さいSVGファイルでお試しください。 最適化処理がタイムアウトしました。より軽量なSVGコードで試行してください。
サイズ削減が発生しなかった 最適化されました。安全なクリーンアップ設定では、これ以上のサイズ削減はありませんでした。 すでに十分に最適化されているコードです。
その他の解析失敗 このSVGを最適化できませんでした。 コードの記述に不正な箇所がないか確認してください。

なお、最適化の処理中に、入力内容をクリアしたり変更したりすると、実行中のプロセスは即座に終了します。

よくある質問（FAQ）

どのようなデータが削除されますか？

コメント、メタデータ、エディタ用ネームスペース、属性間の不要なスペース、未使用のネームスペースを削除し、カラーコードを同等の短い表現に変換します。viewBox、ID、ラベル、およびジオメトリ形状はそのまま保持されます。

すべてのSVGを最適化できますか？

標準的なインラインSVGコードに対応しています。ドキュメントタイプ（DOCTYPE）やカスタムエンティティ宣言が含まれるSVGは、解析の安全性を確保するため処理がブロックされます。これらの宣言を削除してから再度お試しください。

グラフィックの見た目に影響はありますか？

この最適化ツールは、パスの書き換え、IDのリネーム、viewBoxの削除、座標精度の丸め処理などを回避します。デザインワークフローのためにコメントやメタデータが必要な場合は、元のファイルのバックアップを保管しておくことをおすすめします。

XML整形・検証ツールブラウザ上でXMLの整形、軽量化、および構造チェックを行います。HTML整形・圧縮ツール乱雑なHTMLを整形して読みやすく。本番用の軽量化や、タグのエラーチェックもこれ一つで。CSS整形・圧縮ツール乱雑なCSSを整形して読みやすく。ルールの順序を崩さない安全モード搭載の圧縮機能で、本番用コードもスマートに書き出し。