Webデザインの制作物が完成しても、「画像を送れば納品になるのか」「編集できるデータも渡すのか」と迷うことがあります。
納品で大切なのは、依頼者と確認した内容に合わせてデータを用意し、相手が受け取って確認できる状態で渡すことです。
完成した画像、編集用データ、Webページの公開作業は、それぞれ内容が異なります。制作を始める前に、何を、どの形式で、どの方法で渡すかを整理しておきましょう。
この記事では、Webデザイン副業の未経験者に向けて、納品前に確認する項目、データを準備する手順、納品時の連絡例、納品後の修正対応を紹介します。
初案件全体の進め方を先に確認したい方は、Webデザイン副業の初案件についての記事も参考にしてください。
※ツールの機能に関する説明は、2026年10月時点の公式資料をもとにしています。操作方法は、使用しているバージョンや利用環境に合わせて確認してください。本文のファイル名や連絡文は、説明用の例です。
納品する内容は制作を始める前に確認する
納品の準備は、作品が完成してから始めるものだけではありません。
最初に納品物を確認しておくと、必要なデータを残しながら制作でき、終盤での認識の違いも減らせます。
完成画像・編集用データ・公開作業を分ける
たとえば、バナー制作では、掲載用のPNGやJPEGに加えて、Photoshopなどの編集用データを求められる場合があります。
一方、LP制作では、デザインのデータを渡す仕事もあれば、HTML・CSSでページを制作し、指定された環境で公開するところまで担当する仕事もあります。
「バナー1点」「LP制作」という名称だけでは、渡すデータや担当する作業を判断できません。
次のように分けて確認しましょう。
- 掲載に使う完成画像
- 修正や引き継ぎに使う編集用データ
- 確認用の画像やPDF
- HTML・CSSなどの制作ファイル
- サーバーへのアップロードや公開作業
- 公開後の表示・動作確認
依頼内容に含まれるものを整理し、相手と認識を合わせてから制作します。
形式・サイズ・点数・渡し方を文章で残す
納品条件は、口頭で話した内容も含めて、後から確認できる形でまとめておきましょう。
主に確認したいのは、次の項目です。
- ファイル形式
- 画像の縦横サイズ
- 制作する点数やサイズ違いの数
- 編集用データを渡すか
- ファイル名やフォルダ構成の指定
- 納品する場所や共有方法
- 納期と、相手に確認してもらう予定
- 修正対応の範囲
条件が不明な場合は、制作前に質問します。
「納品は掲載用のPNG画像1点でよいでしょうか。画像サイズ、ファイル容量の上限、編集用データの必要性も確認させてください。」
これは確認文の一例です。既に依頼内容に書かれている項目は読み直し、不明な部分を質問してください。
納品物や修正対応を見積もりに整理する方法は、Webデザイン副業の見積もりについての記事で紹介しています。
制作物によって納品データの確認点が変わる
使用するツールが同じでも、納品する形式は依頼内容によって変わります。
まずは、掲載用のデータと、編集・確認のためのデータを分けて考えてみましょう。
| データの例 | 主な用途 | 確認したいこと |
|---|---|---|
| PNG・JPEG | バナーなどの完成画像 | 指定形式、縦横サイズ、容量、透過の必要性 |
| SVG | ロゴやアイコンなどのベクターデータ | 掲載先が対応しているか、書き出し後の表示が合っているか |
| デザインや複数ページの確認資料など | 確認用か納品物か、ページ数や表示が合っているか | |
| PSDなどの編集用ファイル | 編集・修正・引き継ぎ | 使用ソフト、レイヤーの状態、必要な関連ファイル |
| Figmaのデザインファイルや共有リンク | デザインの確認・編集・引き継ぎ | 対象ファイル、必要な権限、依頼者が利用する方法 |
| HTML・CSS・画像など | 実装したWebページ | 必要ファイル、フォルダ構成、公開作業の担当範囲 |
この表はデータを整理するための例です。すべての形式を納品する必要があるわけではありません。依頼者が指定した用途と条件に合わせて準備してください。
バナーは画像サイズ・形式・容量を確認する
バナーの納品では、見た目に加えて、掲載先で使えるデータになっているかを確認します。
特に確認したいのは、次の項目です。
- 指定された縦横サイズになっているか
- 指定形式で書き出されているか
- ファイル容量の上限を超えていないか
- 文字や画像が切れていないか
- 背景を透明にする必要があるか
- サイズ違いや文言違いをすべて用意したか
PNGは透明度に対応し、JPEGは透明度に対応していません。また、JPEGでは圧縮の設定によって文字や輪郭の見え方が変わることがあります。
ただし、「文字があるから必ずPNG」と一律に決めるのではなく、掲載先の指定と書き出した画像の見え方を確認して判断しましょう。
形式ごとの特徴は、Figma公式ヘルプ「エクスポート形式および設定」で確認できます。
バナー制作の仕事内容や応募前の準備は、バナー制作の副業についての記事で整理しています。
LPやWebサイトはデザインと実装の範囲を確認する
LPやWebサイトでは、デザインを渡すことと、動作するページを納品することを分けて確認します。
デザインのみを担当するなら、次のような項目を整理しましょう。
- パソコン向け・スマートフォン向けのどちらを制作するか
- どのページや画面までが対象か
- デザインファイルをどの方法で共有するか
- 実装する人に渡す画像や説明が必要か
実装まで担当するなら、必要ファイルに加えて、次の点も確認します。
- 公開する環境
- アップロードする担当者
- リンクやフォームなどの確認範囲
- 対象となる画面サイズやブラウザ
- 公開後の修正や更新を担当するか
デザイン画面の中にボタンが描かれていても、それだけで申込みや送信の機能が動くわけではありません。未実装の部分を、動作するものとして伝えないようにしてください。
担当範囲の違いは、LP制作の副業についての記事と、Webデザイン副業のコーディングについての記事で紹介しています。
納品データを準備する3つの手順
制作が終わったら、納品用データを用意し、依頼者が受け取る状態で確認します。
作業中の画面だけではなく、実際に送るファイルや共有先を確認することが大切です。
| 確認する項目 | 納品前のチェック |
|---|---|
| 内容 | 承認された文章・写真・デザインと一致している |
| 数量 | 指定された点数、サイズ違い、ページがそろっている |
| 形式・サイズ | 指定形式、縦横サイズ、容量などの条件に合っている |
| 表示 | 書き出したデータで文字切れや画像の欠けがない |
| 編集用データ | 渡す対象が整理され、必要な関連データがそろっている |
| ファイル名 | 内容や版を識別でき、指定があれば従っている |
| 共有 | 相手が必要な権限でアクセスし、必要なデータを取得できる |
| 連絡 | 納品物、確認してほしいこと、次の手順を説明できる |
必要な項目は案件によって異なります。この表を基本に、依頼内容に合わせて追加・調整してください。
1．書き出したファイルを開いて確認する
まず、指定された形式で書き出します。
その後、書き出したファイルを開いて確認してください。制作画面では問題がなくても、書き出す範囲や設定の違いによって、余白、文字、背景などが変わる場合があります。
画像なら、次のように確認できます。
- ファイルの縦横サイズを見る
- 文字や写真が切れていないかを見る
- 背景の透明・不透明が意図どおりかを見る
- 容量の上限がある場合は、ファイルサイズを見る
- 想定する掲載サイズで文字を読めるかを見る
Photoshopでは、書き出し時に形式や、PNGの透明設定、JPEGの品質などを調整できます。操作方法は、Adobe公式ヘルプの書き出し設定についての案内で確認してください。
編集用データを渡す場合も、納品するファイルを開き直します。文字、画像、レイヤーなどが想定した状態になっているかを確認しましょう。
2．ファイル名と納品フォルダを整理する
次に、依頼者がどのファイルを使うか判断しやすい状態に整理します。
ファイル名の指定がある場合は、指定に従ってください。指定がなければ、制作物、サイズ、版などを識別できる名前を考えます。
たとえば、架空のカフェのバナーなら、次のような名前が使えます。
cafe_banner_1200x628_v01.pngcafe_banner_1200x628_v02.png
これは命名方法の一例です。「v01」「v02」は版を区別するために使っています。
納品時には、どれが使用する最終版なのかを連絡文でも明示しましょう。「最終」「最終2」「本当の最終」のように、判断しにくい名前が増えないよう整理します。
また、納品用フォルダには、相手へ渡す対象をまとめます。途中の案や別案件のデータが混ざっていないかも確認してください。
編集用データを含める場合は、掲載用画像と分け、各フォルダに何が入っているか説明すると確認しやすくなります。
3．共有先とアクセス権を確認する
データの渡し方は、依頼者と確認した方法に合わせます。
利用しているサービスの添付機能、指定された共有フォルダ、クラウドストレージなど、案件によって方法は異なります。
共有リンクを使う場合は、リンクをコピーしただけで準備を終えず、次の点を確認してください。
- 対象のファイルやフォルダにリンクしているか
- 指定された相手にアクセス権があるか
- 閲覧・コメント・編集の権限が目的に合っているか
- ダウンロードが必要な場合、取得できる設定になっているか
- 共有範囲に不要なファイルが含まれていないか
Googleドライブでは、閲覧・コメント・編集の権限を設定できます。また、「制限付き」と「リンクを知っている全員」ではアクセスできる範囲が異なります。
表示を確認するための共有と、編集して引き継ぐための共有では、必要な権限が変わります。依頼者の使い方に合わせて設定しましょう。
操作や権限の違いは、Google公式ヘルプ「Googleドライブのファイルを共有する」で確認できます。
共有範囲を広げる前に、依頼者が使うアカウントや必要な権限を確認してください。
納品時の連絡は確認用と最終納品を分けて書く
データを送るときは、何のために送ったのかを明確にします。
デザインを見てもらうための確認用データなのか、修正を反映した最終データなのかがわかるように伝えましょう。
以下は、架空のバナー制作を想定した連絡例です。実際の依頼内容や、合意した手順に合わせて書き換えてください。
確認用データを送る場合の連絡例
確認用データを送るときは、確認してほしい内容を添えます。
お世話になっております。
カフェの告知バナーについて、確認用データをお送りします。
対象ファイル：cafe_banner_1200x628_v01.png
共有先：［確認用データのリンク］ご支給いただいた文章と写真を反映しています。特に、掲載内容と日時の表記をご確認いただけますでしょうか。
修正のご希望がある場合は、該当箇所と変更内容をお知らせください。
こちらは確認用データです。内容をご確認いただいた後、修正を反映し、合意した納品物をお送りします。
よろしくお願いいたします。
確認の期限を伝える場合は、事前に相談した日程を使いましょう。相手の返答がないまま、確認が完了したと判断しないことも大切です。
最終データを納品する場合の連絡例
最終データを送るときは、納品物と修正した内容をまとめます。
お世話になっております。
ご確認いただいた内容を反映し、告知バナーの最終データをお送りします。
納品物：PNG画像1点
サイズ：1200×628px
対象ファイル：cafe_banner_1200x628_v02.png
納品先：［納品データのリンク］今回は、ご指示いただいた開催日時の表記を修正しています。掲載には、上記のv02のファイルをご使用ください。
データの受け取りと表示をご確認いただけますでしょうか。ファイルを開けないなどの問題がありましたら、お知らせください。
よろしくお願いいたします。
この例では、PNG画像1点の納品を想定しています。編集用データや別サイズの画像も渡す場合は、納品物の一覧に追加してください。
クラウドソーシングなどを利用していて、サービス上の納品報告が必要な場合は、データを送ることに加えて、利用中のサービスが案内する手順を確認しましょう。
納品後は修正内容と受け取り状況を確認する
納品後に修正依頼やデータの問い合わせが届いた場合は、内容を整理してから対応します。
相手がファイルを受け取れない問題と、デザインの変更依頼を分けて考えると、対応を決めやすくなります。
修正依頼は変更箇所・範囲・日程を整理する
修正を依頼されたら、まず次の点を確認します。
- どのファイルの、どの箇所か
- 何を、どの内容に変更するか
- 合意した修正対応の範囲に入るか
- 追加の制作物やサイズ変更を含むか
- いつまでの対応を希望しているか
変更内容が曖昧な場合は、確認してから作業しましょう。
たとえば、次のように返信できます。
修正のご連絡ありがとうございます。
対象はv02のバナーで、開催日時を［変更後の内容］へ差し替える、という認識で合っていますでしょうか。
内容を確認でき次第、対応予定をご連絡します。
新しいサイズの画像や別のデザイン案を追加する場合は、作業範囲、費用、日程を整理して相談してください。
本業がある場合も、対応できる日程を確認してから伝えましょう。急ぎの依頼だからといって、確認せずに即日対応を約束する必要はありません。
修正点のまとめ方や、依頼者への具体的な返信例は、「Webデザイン副業の修正依頼はどう対応する？確認項目と返信例」を参考にしてください。希望する変更が曖昧な場合や、当初の範囲を超える可能性がある場合の伝え方も紹介しています。
納品した版と確認結果を記録する
案件の区切りでは、どのデータを納品し、どのような確認を受けたかを記録しておきます。
残しておきたいのは、次の情報です。
- 納品したファイル名と版
- 納品した日
- 納品先や共有方法
- 修正した内容
- 依頼者からの確認結果
- 継続する対応がある場合、その範囲と予定
共有データの保存期間やアクセスを終了する時期に取り決めがある場合は、その内容も記録します。相手が受け取る前に、共有を止めたりデータを削除したりしないようにしてください。
制作物をポートフォリオに載せたい場合は、掲載できるか、公開時期、表示してよい情報を依頼者に確認しましょう。
掲載内容の整理は、Webデザイン副業のポートフォリオについての記事を参考にしてください。
まとめ：合意したデータを、相手が確認できる状態で渡そう
Webデザイン副業の納品では、作品の見た目に加えて、データの形式と渡し方を確認することが大切です。
制作前に、完成画像、編集用データ、実装や公開作業の担当範囲を整理しましょう。
納品前は、次の順番で確認できます。
- 合意した納品条件を読み直す
- 指定形式で書き出し、実際のファイルを開く
- ファイル名と納品フォルダを整理する
- 共有先と必要なアクセス権を確認する
- 納品物と確認してほしいことを連絡する
- 修正内容と依頼者の確認結果を記録する
まずは練習作品でも、掲載用画像と編集用データを整理し、納品用フォルダを作ってみてください。
「制作できる」ことに加えて、「何を渡したか説明できる」状態まで準備しておくと、初めての依頼でも確認する手順をつかみやすくなります。
