依頼前の準備

デザインデータをコーダーに渡す前に確認したい5つのこと

デザインデータを受け取ってからコーディングを始めるまでに、「これはどうなっているんだろう?」と手が止まってしまうことは少なくありません。確認のやり取りが増えるほど、スケジュールにも仕上がりにも影響が出ます。この記事では、コーダーの立場から、デザインデータを渡す前にぜひ確認しておいてほしい5つのポイントをまとめました。

1. フォント情報とその扱いが決まっているか

使用しているフォント名やウェイトがわからないと、コーダーはデータから推測するしかありません。フォント名・ウェイト・サイズ・行間・字間をまとめて伝えてもらえるだけで、再現度は大きく変わります。

特に注意したいのが有料フォントです。有料フォントを使う場合は、事前に次の2点を決めておく必要があります。

  • 画像として書き出すのか、Webフォントとして使うのか
    見出しなど限られた箇所だけなら、画像で書き出すことでライセンスの問題を避けられます。ただし、テキストの修正がしにくくなる、検索エンジンに文字として認識されにくいといったデメリットもあります。
  • 誰のライセンスで運用するのか
    Webフォントとして使う場合、そのフォントの契約者はクライアントなのか、デザイナーなのか、制作会社なのかを明確にしておく必要があります。制作時だけデザイナーのライセンスで使い、納品後に契約が切れて表示されなくなる……というトラブルも起こり得ます。サイト公開後も継続して費用がかかるケースが多いため、運用面まで含めて合意しておくことが大切です。

ここが曖昧なまま進むと、コーディングの途中や公開直前に実装方法を変えることになりかねません。

2. レイヤーが整理されているか

「グループ 128」「長方形 34 のコピー」のようなレイヤーが並んでいると、どこが何のパーツなのかを探すだけで時間がかかります。セクションごとにグループ分けし、わかりやすい名前をつけておくこと、不要な非表示レイヤーを削除しておくことが大切です。データの見通しがよくなるほど、実装のスピードと正確さが上がります。

3. スマホ版などのレスポンシブ時の見え方が決まっているか

PC版のデザインだけでは、画面幅が狭くなったときにどう並べ替えるのかが判断できません。最低限、スマホ版のデザインか、レイアウト変更の方針を用意しておくと安心です。

4. ホバーや動きの指定があるか

ボタンやリンクにマウスを乗せたときの変化、スクロール時のアニメーションなどは、静止画のデザインからは読み取れません。「ここは少し色を変える」程度でも、指示があると意図どおりに仕上げられます。

5. 画像素材が書き出せる状態になっているか

画像が切り抜かれていない、解像度が足りない、リンク切れになっているといったケースも意外と多いものです。使用する素材が正しく書き出せるか、高解像度ディスプレイ向けのサイズが確保されているかを事前に確認しておきましょう。

まとめ

また、サイトは公開して終わりではありません。2026年7月には、WordPress本体にログインなしでサイトを乗っ取られるおそれのある深刻な脆弱性(通称「wp2shell」)が見つかり、緊急のアップデートが公開されました。こうした更新に素早く対応できるかどうかで、サイトの安全性は大きく変わります。

NomadoWorksでは、WordPressの更新対応やバックアップ、動作確認を行う保守プランもご用意しています。データの整理段階からのご相談はもちろん、公開後の運用についてもお気軽にお問い合わせください。

費用感を知りたい方へ

お見積もりシミュレーターで、ページ数や機能を選ぶだけで概算金額を確認できます。

お見積もりシミュレーター
かんたんお見積もり お問い合わせ