SVGとEPSは何が違う?
この記事のポイント
- どちらも拡大しても粗くならないベクター形式
- WebにはSVG、印刷・ストックにはEPS
- EPSは透明度を持てません
SVGとEPSは、どちらも点と線、曲線で絵を記録するベクター形式です。そのため、大きく拡大しても粗くならないところは同じです。ただ、生まれた背景が違うので、使われる場所もかなり違います。
EPS: 印刷のために生まれた形式
EPS(Encapsulated PostScript)は1980年代後半、プリンターに絵を送るための言語PostScriptをもとに作られました。1ページに収まる絵を1つだけ入れ、その絵が占める範囲(バウンディングボックス)をファイルの先頭に書いておくことで、ほかの文書に配置しやすくしました。
長いあいだ出版・印刷業界の標準のように使われてきたため、今でも印刷会社や看板の制作会社、ストック画像サイトでEPSを求められることがよくあります。
SVG: Webのために生まれた形式
SVG(Scalable Vector Graphics)は、Webでベクター画像を使うために作られた形式です。中身がHTMLに似たテキスト(XML)なので、メモ帳で開いても読め、Webページの中でCSSで色を変えたり、JavaScriptで動かしたりできます。アイコン、ロゴ、グラフ、イラストなど、Webサイトに入る絵によく使われます。
ひと目で比較
| SVG | EPS | |
|---|---|---|
| 主な用途 | Webサイト、アプリのアイコン | 印刷、出版、ストック画像 |
| ブラウザで開く | そのまま開ける | 開けない |
| 透明度・グラデーション | 自由に使える | 透明度は使えない |
| カラーモード | RGB | RGB、CMYKどちらも可 |
| アニメーション・操作 | 可能 | 不可 |
では、どちらを使えばいい?
Webサイトやアプリに入れる絵なら、ほとんどの場合SVGのほうが向いています。軽く、ブラウザがそのまま描画でき、コードで扱うのも簡単です。
反対に、受け取る側がEPSを求めているならEPSで送る必要があります。印刷会社、古いデザインソフトを使う取引先、ストックサイトへの投稿が代表的です。最近はPDFで受け付けるところも多いので、まずPDFでもよいか聞いてみるのも一つの方法です。
SVGをEPSにすると変わること
EPSは透明度に対応していないため、半透明の色は不透明な色に置き換える必要があります。文字は、フォントのない環境でも同じ形になるよう、事前にアウトライン化しておくのが安全です。SVGをEPSに変換すると、こうした部分を自動で処理し、変わった部分があれば注意として知らせます。