ホームページ

【分かりやすい】ホームページの見積もりの項目を解説します

ホームページの見積もりの読み方
  • ホームページの見積もりが理解できない
  • これって必要なの?
  • ぼったくられないか心配

こんにちは、タケルです。岩手県花巻市でホームページ制作のフリーランスをしています。

本記事は、

ホームページの見積もりを取ったけど、よく理解できない

という方に向けて書いています。

この記事を読むことで、「インターネットの知識がなくても、ホームページ制作に必要な費用」がイメージできるようになります。

ホームページの作成費用は複雑です。

専門知識がないと「どうしてその金額になるの?」ということがイマイチ分かりません。

大切なお金を投資するわけですから、内容をしっかり理解したいです。

今回はホームページ制作業者の私が、ホームページの見積もりの一般的な項目を解説します。

ホームページ制作の3ステップ


ホームページの制作はざっくり次の3ステップに分けられます。

  1. 設計
  2. デザイン
  3. 実装

の3つに分けられます。

見積もりの項目は「この3つのどれに当てはまるか?」と考えると分かりやすいです。

ホームページの設計費用

設計とは、「どんなホームページを作るか」を決めることです。

具体的には次のとおりです。

  • ヒアリング、競合調査
  • サイトマップ、ワイヤーフレーム
  • コンテンツ制作

それぞれ詳しく見ていきます。

ヒアリング、競合調査

まずは企画からです。

どんなホームページにするのか、様々なことを考慮して戦略を練ります。

  • お客様と打ち合わせ(ヒアリング)
  • 掲載内容の選定
  • 市場調査
  • 競合調査
  • 商品設計案

だいたい上記の通りです。

ホームページの目的と、それを達成するための手段を決めます。

サイトマップ、ワイヤーフレーム

戦略が決まったら、設計図を書き始めます。

まずは掲載すべき情報をもとに「サイトマップ」を作ります。

サイトマップとは、ホームページのどのページにどの情報を配置するかを示したものです。

こんな見た目ですね。

次に、ワイヤーフレームという骨組みを作ります。

サイトマップで決めた配置をもとに、見た目のデザインの下書きをします。

各ページの構造をここで決定します。

コンテンツ制作

掲載する情報と場所が決まったら、内容をより具体的にしていきます。

一般的なホームページなら、次のような項目を考えます。

  • 会社の特徴
  • サービスの強み
  • 活動にかける想い
  • 商品の説明文
  • よくある質問

お客様のほうで内容や文章を考える場合、0円となることが多いと思います。

面倒かもしれませんが、文章はご自身で書くことをオススメします。

会社やサービスへの情熱は社長がいちばん強いからです。

文章がうまくなくても、想いが伝わるかどうかが最重要です。

ホームページのデザイン作成


設計図ができたら、完成予想図を作成します。

次のような項目で、ロゴや画像、装飾など「見た目」を決定します。

  • トップページ
  • 下層ページ
  • 素材(ロゴ、写真)

それぞれ詳しく見ていきます。

トップページ

トップページとは、ホームページに訪問したときに最初に表示されるページです。

「玄関」のような役割で、ホームページ全体の紹介をします。

掲載内容のボリュームも必然的に増えるため、他のページよりも料金が高くなることが一般的です。

下層ページ

下層ページとは、項目ごとの用意された個別のページのことです。

トップページが玄関だとすると、下層ページは「部屋」のような存在です。

基本的に、トップページのデザインを応用して下層ページは作られます。

そのためトップページより安い単価になることがほとんどです。

素材(ロゴ、写真)

ホームページで使用するロゴや写真などを準備します。

特に写真はホームページの印象を決める大事な要素です。

プロのカメラマンを派遣して撮影することもよくあります。

デザイナーやカメラマンの報酬が「デザイン費」の項目にあたるわけですね。

具体的には、次の通りです。

コーディング、実装


完成予想図ができたら、いよいよ実際のホームページ制作に入ります。

制作過程はざっくり次の通りです。

  • コーディング
  • レスポンシブ
  • 機能実装

それぞれ詳しく見ていきます。

コーディング

完成予想デザインはあくまでイメージ画像です。

コーディングとは、HTMLやCSSといった専用の言語を使ってホームページとして再現することです。

プログラミングと聞いてイメージする、こういうやつですね。

見た目だけではなく、下記のような設定も行います。

  • リンクの設定
  • スライドショーなどの動き
  • 音声読み上げブラウザ用の設定

ホームページが正しく動作するように仕上げるイメージです。

レスポンシブ

レスポンシブとは、デバイスごとに表示設定を調整してあげることです。

ホームページはスマホだけでなく、パソコンやタブレットでも見られますよね。

でも、それぞれのデバイスごとに見やすいデザインは違ってきます。

  • スマホの画面は縦長、パソコンの画面は横長
  • パソコンではちょうどいい文字の大きさでも、スマホでは小さすぎる
  • スマホでちょうどいいデザインは、タブレットだと大きすぎる

ひとつのデザインだと、デバイスが変わった時に問題が出てきてしまいます。

これを解決するために、レスポンシブという技術を使います。

「このデバイスのときはレイアウトや文字の大きさはこう変える」というように設定してあげるんですね。

デバイスが多様化してる現状では、必須ですね。

機能実装

ホームページにはさまざまな機能をつけることができます。

  • お問い合わせフォーム
  • ブログ投稿
  • 会員登録、ログイン

見積もりの項目に「CMS」や「Wordpress」と書いてあったら、「こういった機能を実装するためのツール」のようにイメージしてもらえると分かりやすいと思います。

まとめ

というわけで、以上です。ここに書いてあることだけで、「この項目はどんな作業のことか」がイメージできると思います。

みなさんが内容をしっかり理解して、気持ちよく契約できることを願っています。

もし分からないことがあったら、お気軽にご連絡ください。

Twitterまたはお問い合わせフォームからどうぞ