WEBディレクションの修練場ではWeb制作の現場で起こるさまざまな課題をこなしながらWebディレクションスキルを磨いていただきます。
今回のお題はWebサイトの見積もり。
見積もりはWebサイトの新規立ち上げ、リニューアル、更新時などで都度作ります。
適切な見積もりができることはWebディレクターの重要スキル。
今回の演習を通して、Webサイトの見積もりに必要な項目をおさえた上で金額の設定ができるようになりましょう。
お題
クライアント：「10ページ構成の企業サイトを作りたい。フォームはWebサービスを利用しているので埋め込みリンクがあり、スマホ対応はして欲しい。できるだけ安く仕上げるのを希望しているが、この条件で見積もりして欲しい。」
【今回のお題】
トップページ1ページ、下層ページ9ページの企業サイトで、スマホ対応あり、の見積もりを作る。
ヒント
Webサイトの見積もりにはデザイン費、コーディング費、ディレクション費の3つの項目で作ります。
フォームの開発は不要なので（埋め込みリンク支給なので）、トップページ1・下層ページ9の見積もりを用意すればいいですね。
回答例
Webサイトの見積もりに含まれる項目は、次が基本になります。
- デザイン費
- コーディング費
- ディレクション費
撮影・原稿作成・画像選定・アクセス解析タグの設定などはオプションで加算していきます。
今回はオプションもなしですね。
デザイン費
デザイン費の算出方法についてみていきましょう。
デザイン費はPC版のトップページと下層ページが基本の項目になります。
スマホ版のデザインは予算や納期の理由から、コーディングで確認することも多いので、希望時のみ作る感じです。
- PC版トップページデザイン
- PC版下層ページデザイン
- スマホ版デザイン
PC版トップページデザイン
パソコン版のトップページのデザイン作成費です。
費用感はデザインする画面の大きさ（長さ）によりますが、だいたい次のような値ごろ感になります。
PC版トップページデザイン：50,000円～
トップページをLP化して縦長にする場合や、1ページ完結のペライチサイトなどを作る場合などは作業工数がかかるので、倍の100,000円～くらいになる場合があります。
PC版下層ページデザイン
パソコン版の下層ページのデザイン作成費です。
下層ページのデザインのパターン数だけ作る、というのが一般的です。
多くのサイトでは下層ページは同じレイアウト、テイストのデザインでカテゴリ別に色を変える、アイコンを変える、というパターンが多いです。
見積もり金額は「トップページの半分（1/2）」というのが業界通例のよくあるパターン。
PC版下層ページデザイン：25,000円～/1パターンごと
スマホ版トップページデザイン
スマホ版のトップページのデザイン作成費です。
PC版とあわせて「スマホ版もデザインを確認したい」と要望がある場合に作ります。
金額はPC版トップページとPC版下層ページの間くらいからでしょうか。
スマホ版トップページデザイン：30,000円～
中にはユーザーがほぼスマホだから、予算削減のため、などの理由でPC版のデザインは無しでスマホ版のTOPページだけ作ることもあります。
その場合はPC版トップページデザインと同じく50,000円～くらいです。
僕の経験上、デザインはPC版（トップ＋下層）だけ作って、スマホ版はコーディング時に確認するというケースが8割以上です。
※デザイン費用の項目は、上記に加えて写真選定・画像作成が必要な場合は1枚あたり3,000円～といったように費用が加算されます。
コーディング費用
コーディング費用の算出方法についてみていきましょう。
コーディング費用はトップページ、下層ページ、スマホレスポンシブル対応、JS機能開発などの項目があります。
- トップページコーディング
- 下層ページコーディング
- スマホレスポンシブル対応
- JS機能開発
トップページコーディング
トップページのコーディング費用です。
この場合のトップページとはPC版を指すことが多く、スマホ対応は別途「レスポンシブル対応費」として計上されることが多いです。
トップページコーディング費用：50,000円～
下層ページコーディング
下層ページのコーディング費用です。
トップページと同じくPC版のことを指します。
1ページ単位の料金で、トップページの半額になるのが一般的。
下層ページ：25,000円～/1P
スマホ対応時は別途レスポンシブル対応費用がかかるのが一般的です。
スマホレスポンシブル対応
スマホデザインに対応するためのコーディング費用です。
サイト全体の共通CSSを設計するものです。
デザインのパターンの数だけCSS調整が必要ですが、トップページと同じ金額で見積もっておきます。
スマホレスポンシブル対応：50,000円～
ページごとにレイアウトが複雑などの場合はその分だけ費用が上がります。
JS機能開発（スライドショー、アコーディオンパネル、フェードなど）
JavaScriptを使ってページの視覚効果・動きを付けるための費用です。
jQueryやBootstrapなどのライブラリ・フレームワークを導入して実装するケースが多いですが、サイト特有なものや、カスタマイズが複雑なもの、一から作るものなどの場合はかなり費用がかかります。
金額はものによりますが、30,000円くらいからですかね。
JS機能開発：30,000円～
※コーディング費用に関しては、30ページ以上などサイト規模が大きくなる場合、デザインガイドラインやコーディングガイドラインの設計から入る場合などだと「CSS設計費用」が別途かかる場合があります。
その他費用
その他にもこんな費用がかかります。
金額については、ピンキリになります。
- 問合せフォーム作成費
- 撮影費
- 取材費
- 原稿作成費
- 原稿校正費
- コンテンツ作成費
- アクセス解析タグ設定費
- SEO対策
- 環境構築費（ドメイン取得、サーバー手配、SSL化など）
- CMS導入費
- 外部サービス埋め込み費
- リダイレクト設定費 など
Webディレクション費
Webディレクション費の算出方法について見ていきましょう。
Webディレクション費はWebディレクターの人件費です。
進行管理費、プロジェクト管理費、企画構成費などと呼ばれることもあります。
Webディレクション費に含まれる内容には企画・コンセプト設計、要件定義、サイト設計、ワイヤーフレーム作成、進行管理、品質管理、納品、電話・メールなどでのやりとり、打合せ、資料作成などがあります。
どこまで対応するかでWebサイト制作の総額の10%～30%程度かかります。
Webディレクション費：見積もり総額の10%～30%
会社によって企画・コンセプト費やサイト設計、ワイヤーフレーム作成などを別の項目で見積もりする場合があります。
Webサイトの見積もり
今回の依頼内容を改めて整理してみます。
- トップページ：1ページ
- 下層ページ：9ページ
- スマホ対応あり
- できるだけ安く作りたい
次のように見積もってみました。
デザイン費
トップページ：5万円×1=5万円
下層ページ：2.5万円×1=2.5万円
（小計）7.5万円
→できるだけ安くするためにスマホ版デザインは無しにして、コーディングで確認してもらう。最低限PCトップページとPC下層ページを1ページずつデザインする。
コーディング費
トップページ：5万円×1=5万円
下層ページ：2.5万円×9=22.5万円
レスポンシブ対応：5万円×1=5万円
（小計）32.5万円
→レスポンシブ対応あり。
ディレクション費
ディレクション費：上記総額の20%=40万円×0.2=8万円
（小計）8万円
合計
デザイン7.5万円＋コーディング32.5万円＋ディレクション8万円
=48万円
これで完了です。
見積もり金額が算出できました。
クライアントに提出して確認しましょう。
お疲れさまでした！
Webサイトの見積もりについての補足
「もっと安くして」と言われたら...
クライアントに見積もりを見せたら「高い」「もっと安くできないの？」と言われたらどうすれば良いのか？
現場では結構あることです（笑）
その場合はたとえば、
- デザインの希望のテイストを聞いて、ワイヤーフレームでレイアウトだけ固めてコーディングを進めるデザイン無しの方法（デザイン費：トップ5万円、下層2.5万円を削除とか）
- デザインの修正回数を普段2回のところ1回だけにしてもらう、コーディング時のデザインチェックはお客さん側でしてもらうなど、ディレクション費用を下げる方法（ディレクション費20%→10%とか）
などがあります。
新人や新規の外注先などクオリティが多少下がることをお客さんに了承してもらうとか、納期を長くもらって優先順位を下げて対応する、とかもあります。
あとは、自社の営業担当や上司に相談して特別単価にしてもらえないか？値引きは可能か？などを相談することですね。
中には「うちはこれ以上は無理です」とお断りすることもあります。
結局のところ、最後はお客さんとのパワーバランスで決まりますね（笑）
見積もり金額は会社・現場で変わる
Webサイトの見積もりは項目別の単価によって大きく変わります。
今回はトップページデザイン：5万円というよくある一般的な相場で設定しました。
この「単価」は商流によって変わります。
たとえば、各社の営業利益率を30%とした場合、トップページデザインにかかる費用は元請けの制作会社で7万円だとしたら、二次請けの制作会社で5万円、三次請けのフリーランスデザイナーで3.5万円といった具合です。
あとは会社の方針、クライアントとの関係性で単価は変動します。
つまり、単価は会社・現場によって大きく変わります。
