デザインを外注していると、「aiデータで納品してほしい」「pngとjpegどちらがいいか」など、ファイル形式に関するやり取りが必ず発生します。それぞれの拡張子の特徴を知らないまま進めると、「印刷に使えないデータで納品された」「後から修正しようとしたらデータが使えなかった」といったトラブルにつながります。
この記事では、デザイン制作でよく使われる7つの拡張子(ai・psd・pdf・png・jpeg・svg・gif)の特徴と使い分けを、発注者の視点からわかりやすく解説します。
ベクターとラスターの違い
拡張子の特徴を理解する前に、デザインデータの2つの種類「ベクター」と「ラスター」を押さえておきましょう。
ベクターは、数学的な計算式で描かれた画像形式です。拡大・縮小しても画質が劣化しないため、ロゴや印刷物など様々なサイズで使う制作物に向いています。ai・svgがこれに当たります。
ラスターは、ピクセル(点)の集合で構成される画像形式です。写真のような繊細な表現が得意ですが、拡大すると画質が劣化します。psd・png・jpeg・gifがこれに当たります。
拡張子ごとの特徴と使い分け
ai(Adobe Illustrator)
種類:ベクター 主な用途:ロゴ・チラシ・バナーなどの作業データ
Adobeのイラストレーターで作成されるファイル形式です。ロゴ・チラシ・バナーなどのデザインデータとして広く使われています。ベクターデータのため、どんな大きさに拡大しても画質が劣化しません。
外注時のポイント: ロゴや重要なデザインはaiデータでの納品を依頼しておくと、後から別のデザイナーに修正を依頼する際にも使いやすくなります。ただし開くにはAdobe Illustratorが必要です。
psd(Adobe Photoshop)
種類:ラスター 主な用途:写真加工・バナー・SNS画像などの作業データ
Adobeのフォトショップで作成されるファイル形式です。写真の加工・合成を伴うバナーやSNS画像などに使われます。レイヤー情報が保持されているため、後から要素ごとに修正しやすいのが特徴です。
外注時のポイント: バナーや画像合成を伴う制作物は、psdデータでの納品を依頼しておくと、テキストや素材を後から差し替えやすくなります。開くにはAdobe Photoshopが必要です。
種類:ベクター・ラスター両対応 主な用途:印刷用入稿データ・資料の共有
文書・デザインを誰でも同じ状態で表示・印刷できる形式です。フォントや画像を埋め込んで書き出すため、環境に依存せず同じ仕上がりで印刷できます。印刷会社への入稿データとして広く使われています。
外注時のポイント: チラシ・ポスター・名刺などの印刷物は、印刷用設定(CMYK・塗り足し・トンボ付き)のpdfでの納品を依頼しましょう。印刷会社の入稿規定を事前に確認して、デザイナーに共有しておくとスムーズです。
png
種類:ラスター 主な用途:ロゴのWeb用データ・透過が必要な画像
画像の保存形式のひとつです。透過(背景を透明にする)が可能なため、ロゴやアイコンのWeb用データとして使われます。保存を繰り返しても画質が劣化しない点も特徴です。ファイルサイズはjpegより大きくなる傾向があります。
外注時のポイント: ロゴやアイコンを背景なし(透過)で使いたい場合はpngで納品を依頼しましょう。背景が透明になることで、どんな色の背景にも重ねて使いやすくなります。
jpeg(jpg)
種類:ラスター 主な用途:写真・バナー・サムネイルなどの書き出しデータ
写真・画像の保存に広く使われる圧縮形式です。ファイルサイズを小さくできますが、保存のたびに画質がわずかに劣化します。Webバナーやサムネイル、写真を含む画像の書き出しに使われることが多いです。透過には対応していません。
外注時のポイント: Webに掲載する写真やバナーはjpegで納品してもらうのが一般的です。ただし繰り返し編集・保存する可能性がある場合は、作業データ(psd)もあわせて依頼しておくと安心です。
svg
種類:ベクター 主な用途:Webサイトのロゴ・アイコン
ベクター形式のWeb用画像フォーマットです。拡大・縮小しても画質が劣化しないため、Webサイトのロゴやアイコンに適しています。テキストエディタで編集できるため、CSSでの色変更なども可能です。
外注時のポイント: Webサイトに使うロゴやアイコンはsvgでの納品を依頼すると、様々な画面サイズ・解像度で鮮明に表示できます。ただしWebサイトへの実装にはコーディングの知識が必要です。
gif
種類:ラスター 主な用途:アニメーション画像・シンプルなイラスト
アニメーション(動く画像)に対応している点が最大の特徴です。SNSやバナー広告で動きのある表現をしたい場合に使われます。ただし表現できる色数が256色に限られるため、写真のような繊細な色表現には向いていません。
外注時のポイント: アニメーションバナーやSNS用の動く画像を依頼する場合はgifでの納品を指定しましょう。ただし色数の制限があるため、写真を含むデザインには不向きです。より高品質なアニメーションが必要な場合はmp4やWebPの検討も有効です。
用途別・納品形式の選び方
印刷物を依頼する場合
印刷物(チラシ・ポスター・名刺など)は、以下の形式での納品を依頼しましょう。
- 作業データ: ai(イラストレーターで作成した場合)またはpsd
- 入稿データ: pdf(CMYK・塗り足し・トンボ付き)
印刷会社の入稿規定を事前に確認し、デザイナーに共有しておくことが重要です。
Web・バナーを依頼する場合
Webバナー・SNS広告などのデジタル用制作物は、以下の形式での納品が一般的です。
- 作業データ: ai またはpsd
- 書き出しデータ: jpeg またはpng(透過が必要な場合)
- アニメーション: gif
ロゴを依頼する場合
ロゴはWeb・印刷・大判印刷など様々な場面で使われるため、複数形式での納品を依頼しましょう。
- 印刷・拡大用: ai(必須)
- Web用・透過あり: png(必須)
- Web用ベクター: svg(あれば理想的)
SNS画像・サムネイルを依頼する場合
SNS投稿画像やYouTubeサムネイルは、以下の形式での納品が一般的です。
- 作業データ: psd
- 書き出しデータ: jpeg またはpng
まとめ
デザインデータの主な拡張子と用途をまとめると以下の通りです。
| 拡張子 | 種類 | 主な用途 |
|---|---|---|
| ai | ベクター | ロゴ・印刷物の作業データ |
| psd | ラスター | バナー・SNS画像の作業データ |
| 両対応 | 印刷用入稿データ | |
| png | ラスター | 透過が必要なWeb用画像 |
| jpeg | ラスター | 写真・バナーの書き出しデータ |
| svg | ベクター | Webサイトのロゴやアイコン |
| gif | ラスター | アニメーション画像 |
外注時の基本は「作業データ(aiまたはpsd)と書き出しデータ(jpegまたはpng)の両方で納品してもらう」ことです。後から修正や流用が発生したときのために、作業データは必ず受け取っておきましょう。