「バナー用に作ったデザインをチラシに使ったら色が変わってしまった」「Web用に作ったロゴを印刷したら粗くなってしまった」——こうしたトラブルは、Webデザインと印刷物デザインの違いを知らないまま進めてしまうことで発生します。
Webと印刷物では、カラーモード・解像度・サイズの単位・フォント・納品形式など、制作上の前提条件が大きく異なります。この違いを理解しておくことで、デザインを外注する際の指示が正確になり、納品後のトラブルを未然に防ぐことができます。
なお、経験の浅いデザイナーやWebデザインを専門とするフリーランスの中には、印刷物特有の知識（CMYKへの変換・解像度・塗り足しなど）が十分でない場合もあります。発注者側がこの違いを把握しておくことで、依頼時に正確な指示を出せるだけでなく、納品されたデータの品質チェックにも役立ちます。
カラーモードの違い（RGB vs CMYK）
Webと印刷物で最も重要な違いのひとつがカラーモードです。
Web用デザインはRGBで制作します。RGBは赤（Red）・緑（Green）・青（Blue）の光の三原色を組み合わせて色を表現するモードで、ディスプレイでの表示に使われます。光を混ぜるほど明るくなる「加法混色」の仕組みです。
印刷物はCMYKで制作します。CMYKはシアン（Cyan）・マゼンタ（Magenta）・イエロー（Yellow）・ブラック（Key）のインクを組み合わせて色を表現するモードで、インクを混ぜるほど暗くなる「減法混色」の仕組みです。
RGBで作ったデザインをそのまま印刷用に入稿すると、印刷時に色が変わってしまうことがあります。特に鮮やかな青・緑・オレンジなどはCMYKで再現できる色域が狭く、くすんだ色になることがあります。
外注時のポイント： 印刷物を依頼する場合は「CMYKで制作してください」と明示しましょう。Web用バナーはRGBで問題ありません。Webデザインを主に手がけるデザイナーはCMYKに不慣れなケースもあるため、印刷物の経験があるかどうかを依頼前に確認しておくことをおすすめします。
解像度の違い（72dpi vs 350dpi）
解像度とは、画像の細かさを表す単位です。dpi（dots per inch）は1インチあたりのドット数を示し、数値が高いほど精細な画像になります。
Web用は72〜96dpiが基本です。ディスプレイの表示解像度に合わせた設定で、ファイルサイズを抑えつつ画面上で鮮明に表示できます。
印刷物は350dpi以上が必要です。印刷では紙にインクを吹き付けるため、解像度が低いと印刷物が粗くなってしまいます。特に写真を含むデザインや、大判ポスターでは解像度の確認が重要です。
Web用の解像度（72dpi）で作成したデザインを印刷すると、実際の印刷サイズよりはるかに小さいサイズにしか使えない、または粗い仕上がりになってしまいます。
外注時のポイント： 印刷物を依頼する場合は「350dpi以上で納品してください」と明示しましょう。
サイズ・単位の違い（px vs mm）
**Web用デザインはピクセル（px）**でサイズを指定します。バナーのサイズは「1200×628px」のように指定され、ディスプレイ上の表示サイズを基準にします。
**印刷物はミリメートル（mm）でサイズを指定します。A4（210×297mm）・B5（182×257mm）のように実際の印刷サイズで指定します。また、印刷物には塗り足し（通常3mm）**が必要で、仕上がりサイズより外側に3mmのデザインの余白を設ける必要があります。
同じ「A4サイズ」でも、Web用に換算すると約2480×3508px（350dpi）になります。Web用のA4サイズ画像（72dpi）とは全くサイズが異なるため、用途を明確にした上でサイズを指定することが重要です。
外注時のポイント： 印刷物はmm単位でサイズを伝え、塗り足しの有無も明示しましょう。
フォントの扱いの違い
Web用デザインでは、Webフォント（Google Fontsなど）やシステムフォントが使われます。ユーザーの端末にフォントがインストールされていない場合でも表示できるよう、フォントの指定方法に工夫が必要です。
印刷物では、デザインデータにフォントを「埋め込む」または「アウトライン化（文字をパスに変換する）」して納品します。アウトライン化することで、印刷会社側の環境にフォントがなくても正確に印刷できます。
フォントのアウトライン化を忘れたまま入稿すると、印刷会社の環境にそのフォントがない場合に別のフォントに置き換えられてしまうトラブルが発生します。
外注時のポイント： 印刷物の入稿データはフォントをアウトライン化してもらうよう依頼しましょう。アウトライン化は印刷物デザインの基本ですが、Web専門のデザイナーが見落としやすいポイントでもあります。納品時に確認することをおすすめします。
納品形式の違い
Webと印刷物では、納品してもらうべきファイル形式も異なります。
Web用デザインの主な納品形式
- jpeg・png：書き出し画像（バナー・SNS画像など）
- svg：Webサイト用のロゴ・アイコン
- gif：アニメーション画像
- psd・ai：作業データ（後から修正できる形式）
印刷物の主な納品形式
- pdf（CMYK・塗り足し・トンボ付き）：印刷用入稿データ
- ai：作業データ（イラストレーターで作成した場合）
- psd：作業データ（フォトショップで作成した場合）
同じデザインでもWeb用と印刷用では納品形式が異なります。両方の用途で使う予定がある場合は、依頼時に「Web用と印刷用の両方で納品してほしい」と伝えておきましょう。
Webと印刷物で共通して使える素材・使えない素材
デザインに使用するフリー素材やフォントについても、Webと印刷物で注意が必要です。
商用利用の確認 フリー素材サイトの中には「Web掲載のみ可」「印刷物への使用は別途ライセンスが必要」など、用途を限定しているものがあります。依頼時に「印刷物にも使用する予定がある」ことをデザイナーに伝え、使用素材のライセンスを確認しておきましょう。
画像素材の解像度 Web用の低解像度画像は印刷には使えません。印刷物にも使用する場合は、高解像度（350dpi以上）の画像素材を使ってもらうよう依頼しましょう。
外注時に伝えるべき情報の違い
Webと印刷物では、依頼時に伝えるべき情報も異なります。
Web用デザインを依頼する場合
- サイズ（px単位）
- カラーモード：RGB
- 解像度：72〜96dpi
- 納品形式：jpeg / png / svgなど
- 掲載媒体（Google広告・Instagram・Webサイトなど）
印刷物を依頼する場合
- サイズ（mm単位）＋塗り足しの有無
- カラーモード：CMYK
- 解像度：350dpi以上
- 納品形式：pdf（トンボ・塗り足し付き）＋作業データ
- 印刷会社の入稿規定（URLまたはPDF）
- 印刷枚数・用紙の種類（わかる場合）
まとめ
Webと印刷物のデザイン制作の主な違いを整理すると以下の通りです。
| 項目 | Web用 | 印刷物 |
|---|---|---|
| カラーモード | RGB | CMYK |
| 解像度 | 72〜96dpi | 350dpi以上 |
| サイズ単位 | px（ピクセル） | mm（ミリメートル） |
| 塗り足し | 不要 | 3mm必要 |
| フォント処理 | Webフォント・システムフォント | アウトライン化が必要 |
| 主な納品形式 | jpeg / png / svg | pdf（入稿用）＋ai/psd |
「Web用と印刷物で同じデザインを使いたい」という場合は、最初から両方の用途を想定した制作を依頼することで、作り直しのコストと手間を省けます。依頼時に用途を明確に伝えることが、トラブルを防ぐ最も重要なポイントです。