00

結論から

  • SVGは、拡大縮小できる2次元の図形、文字、埋め込みラスター画像を表すXMLベースの画像・デザイン形式であり、処理コンテキストによってはスクリプトや外部参照を含められます。
  • 信頼できる.svgはブラウザーで直接開くか、HTML画像として表示します。後者には安全な画像処理モードが想定されています。WindowsとMacではブラウザーを指定し、スマホではSVG対応が明記されたブラウザーやビューアーを使います。.svgzが未対応なら先に展開します。スクリプト、外部参照、アニメーション、操作機能の可否は処理コンテキストで異なります。
  • 入手元が不明なSVGは、能動的な機能を持ち得るコンテンツとして扱ってください。スクリプト、onclickなどのイベント属性、任意のURI、外部メディアを含む可能性があり、悪意あるXMLエンティティ展開がメモリーを消費する場合もあります。スクリプト、外部参照、操作を無効にする制限付きコンテキストを選びます。表示できても内容の信頼性は証明されません。
01

SVG・SVGZファイルの識別、安全に配慮した開き方と変換

Scalable Vector Graphics(SVG)は、2次元グラフィックスをXMLで記述します。ベクター図形、文字、埋め込みラスター画像、グループ化、スタイル、変換、合成に対応します。単独の文書、HTML内のコンテンツ、別のXML言語への埋め込みとして利用できます。SVGZはSVGをgzip圧縮したものです。

元ファイルは残す

ラスター画像が必要ならSVGをPNGまたはJPEGに変換できますが、拡大縮小や編集が重要なら元のSVGを残してください。ラスター化ではXMLベクターオブジェクト、解像度に依存しない編集性、DOM操作、スクリプト、SVGアニメーションは維持されません。SVGZからSVGへの展開では、元の文書を画像上の損失なく保持できます。

02

開き方

信頼できる.svgはブラウザーで直接開くか、HTML画像として表示します。後者には安全な画像処理モードが想定されています。WindowsとMacではブラウザーを指定し、スマホではSVG対応が明記されたブラウザーやビューアーを使います。.svgzが未対応なら先に展開します。スクリプト、外部参照、アニメーション、操作機能の可否は処理コンテキストで異なります。

中身を見たいだけ

信頼できる.svgはブラウザーで直接開くか、HTML画像として表示します。後者には安全な画像処理モードが想定されています。WindowsとMacではブラウザーを指定し、スマホではSVG対応が明記されたブラウザーやビューアーを使います。.svgzが未対応なら先に展開します。スクリプト、外部参照、アニメーション、操作機能の可否は処理コンテキストで異なります。

誰かに送りたい

ラスター画像が必要ならSVGをPNGまたはJPEGに変換できますが、拡大縮小や編集が重要なら元のSVGを残してください。ラスター化ではXMLベクターオブジェクト、解像度に依存しない編集性、DOM操作、スクリプト、SVGアニメーションは維持されません。SVGZからSVGへの展開では、元の文書を画像上の損失なく保持できます。

03

安全チェック

入手元が不明なSVGは、能動的な機能を持ち得るコンテンツとして扱ってください。スクリプト、onclickなどのイベント属性、任意のURI、外部メディアを含む可能性があり、悪意あるXMLエンティティ展開がメモリーを消費する場合もあります。スクリプト、外部参照、操作を無効にする制限付きコンテキストを選びます。表示できても内容の信頼性は証明されません。

こんなときは、いったん手を止める

送り主が分からない、拡張子が二重になっている、中身が拡張子と合わない——一つでも当てはまるなら、開く前に確かめてください。

04

変換するときは

ラスター画像が必要ならSVGをPNGまたはJPEGに変換できますが、拡大縮小や編集が重要なら元のSVGを残してください。ラスター化ではXMLベクターオブジェクト、解像度に依存しない編集性、DOM操作、スクリプト、SVGアニメーションは維持されません。SVGZからSVGへの展開では、元の文書を画像上の損失なく保持できます。

変換する前に

元ファイルではなくコピーを変換し、変換後に画質・メタデータ・レイアウトを元と見比べてください。

05

よくある質問

SVGファイルとは何で、何に使われますか?

SVGは2次元グラフィックス用のXML文書です。拡大縮小できるベクター図形、文字、埋め込みラスター画像、スタイル、変換、合成を記述し、単独またはHTMLや別のXML内で利用できます。

ブラウザーでSVGファイルを開くにはどうすればよいですか?

信頼できる.svgをブラウザーで開きます。単独表示や動的コンテキストではスクリプト、外部参照、アニメーション、操作が許可される場合があります。HTML画像としての利用には安全な画像処理が想定されるため、不明なファイルでは制限付きコンテキストを選びます。

WindowsでSVGファイルを開くにはどうすればよいですか?

.svgを開くアプリとしてWebブラウザーを選びます。.svgzを受け付けない場合は、gzipの包みを先に展開して元のSVGを取り出してください。

MacでSVGファイルを開くにはどうすればよいですか?

SVG対応ブラウザーで.svgを開きます。出所不明ならスクリプト、外部参照、操作を無効にするコンテキストを使い、必要に応じて.svgzを先に展開します。

スマホでSVGファイルを開くにはどうすればよいですか?

SVG対応が明記されたモバイルブラウザーまたはビューアーを使います。利用できる機能は異なり、.svgzは表示前に展開が必要な場合があります。

SVGファイルが開けない、または正しく表示されないのはなぜですか?

アプリがSVGに対応していない、ファイルが圧縮されたSVGZである、または処理コンテキストがスクリプト、外部参照、操作、一部のアニメーションを無効にしている可能性があります。拡張子を確認し、.svgzを展開してから対応ビューアーを試してください。

SVGとSVGZの違いは何ですか?

SVGはXMLグラフィックス文書で、SVGZは同種のSVGコンテンツをgzipで包んだものです。SVGZを展開すれば画像上の損失なくSVGを取り出せます。直接的な互換性ならSVG、gzip対応環境ならSVGZを選びます。

SVGをPNGまたはJPEGに変換すると何が失われますか?

ラスター化で残るのは描画された画像であり、元のSVG機能ではありません。XMLベクターオブジェクト、解像度に依存しない編集性、DOM操作、スクリプト、SVGアニメーションが失われます。必要ならSVGも保管してください。

SVGファイルにスクリプトは含まれますか?また、不明なSVGは安全ですか?

SVGにはスクリプト、イベント属性、外部参照、任意のURIを含められます。XMLエンティティや参照先メディアもリスクになり得ます。安全とは決めつけず、能動的・外部コンテンツを無効にする制限付きコンテキストで開くか変換してください。

SVGのMIMEタイプは何ですか?マジックナンバーはありますか?

登録済みMIMEタイプはimage/svg+xmlです。登録情報には.svgとgzip圧縮された別名.svgzが示されていますが、形式固有のマジックナンバーは記載されていないため、信頼できるバイナリ署名は提示されていません。

06

関連する形式

参考資料

Scalable Vector Graphics (SVG) 2 · World Wide Web Consortium (W3C)

Introduction — SVG 2 · World Wide Web Consortium (W3C)

Media Type Registration for image/svg+xml — SVG 2 · World Wide Web Consortium (W3C)

IANA Media Types Registry · Internet Assigned Numbers Authority (IANA)

Scripting and Interactivity — SVG 2 · World Wide Web Consortium (W3C)