広島県呉市のWeb制作
ホームページ制作の個人事務所

COLUMN

コラム

TOP

>

コラム一覧

>

ホームページ制作の流れ|依頼してから公開までを解説

ホームページ制作の流れ|依頼してから公開までを解説

ホームページ制作の流れ|依頼してから公開までを解説

初めてホームページを作る方は「依頼してから公開までの流れがよくわからない!」と言う方も多いのではないでしょうか?

今回は依頼してから、どのような流れでホームページが公開していくのかを記事にしてみました。
「ホームページを作ってみたいけど、一歩踏み出せない…」と言う方は、ぜひ参考にしてみて下さい。

ホームページ制作のおおまかな流れ

ホームページ制作のおおまかな流れ

まずホームページを制作するには、お問い合わせをして見積もりを出してもらうとこから始めます。
規模によってホームページの価格は大きく変わるので、必ず事前に見積もりを取りましょう。

またホームページ制作は、家を建てる過程と非常に似ています。
家を建てる時もまず初めは見積もりや、ハウスメーカーにお問い合わせをしますよね?
それと同じように、気になるホームページ制作会社に連絡をしてみましょう。

ホームページ制作は事前準備が大切

実際にお問い合わせや見積もりを出してもらったら、なんのためにホームページを作るのか?を自分の中で明確にしておきましょう。
この目的が曖昧であれば、出来上がったホームページも中途半端なものになります。

またこちらも家を作る過程と同じで、制作の途中でコンテンツやテイストを見直したい…となると、家を建てている途中で新しく家を建て直すのと同じくらい大変になります。

制作の流れその1|ヒアリング・サイト設計(場合によっては再見積もり)

ヒアリング・サイト設計

主なヒアリング内容は以下になります。

  • どのようなページを作成したいのか
  • ターゲットの選定
  • サーバーやドメイン周りの話
  • コンテンツの内容や写真はどうするか

ホームページを作る目的

ホームページは企業の顔となり、名刺となる存在です。
どのようなホームページにしたいのか、また具体的なゴールまで明確にできると尚良いでしょう。

ホームページの制作目的でよくあるのが、以下のような理由です。

  • 企業の知名度を上げたい
  • 採用活動をしたい
  • お問い合わせを増やしたい
  • サービスを紹介したい

ターゲットを明確にする

どのようなユーザー向けに発信したいのかも重要になります。

例えばターゲットユーザーが、20代の女性だとします。
20代の女性であれば、華やかなカラーを使用したり20代の女性が好きそうな可愛らしい写真を使用するのが良いでしょう。

ターゲットが明確であれば、色やホームページの雰囲気も明確にすることができます。
またターゲットについては、詳細な人物像(ペルソナ)を定めることが大切です。

先程の20代女性だけでは少し弱く、最低でも以下のような内容があるのが好ましいです。

名前五十嵐 りか
年齢27歳
性別女性
職業外資系企業の事務
休日の過ごし方友人とカフェ巡り
悩み肌荒れに悩んでいる

ターゲットを明確にすることで、ターゲットが実際にどのような行動をするのかイメージできるようなり、ホームページを作る際に調査や分析しやすくなります

サイトマップの制作|コンテンツ内容の準備

次にサイトマップを制作します。
「サイトマップ」とは、ホームページ全体の構成図のようなものです。
「何ページ必要なのか?」「ページ間の繋がりをそうするのか?」などを簡単なツリー構造で可視化します。

家を建てる例で言えば「部屋は何部屋必要か?」「2買い建てなのか?平屋なのか?」といった話し合いのイメージです。

またサーバーやドメインはどうするのか?こちらもホームページ制作会社によって違うので、打ち合わせの時に話し合っておきましょう。

サーバー、ドメインが何か分からない!と言う方はこちらの記事を読んでみてください。
サーバー・ドメインとは?ホームページ制作に必要な基礎知識をわかりやすく解説

ワイヤーフレームの制作

ワイヤーフレームは、レイアウトを決める設計図のようなものです。
どの場所にどのようなコンテンツを入れるのか?テキストや画像はどこに入れるのかを、具体化させていきます。

またこの時にテキスト内容も用意していきます。
家の設計図と同じく配置などを決める工程なので、色は白黒でフォントも使いやすいもので作成していきます。

当初に予定していた規模よりも大きくなったり、小さくなったりする場合は、この時再見積もりになる場合もあります。

制作の流れその2|Webデザイン工程

webデザイン工程

デザイナーと、デザインの方向性を決める

サイト設計が終わったら、ホームページのデザインを作成していきます。
まず初めにデザインの雰囲気やテイストなどの方向性を、デザイナーと確認していきます。

主な内容は以下のようなものです。

  • フォント
  • 色の選定
  • レイアウトの大まかなルール
  • 画像素材はどうするのか

デザインは作成する人が好きなデザインではなく、ターゲットが好むデザインにすることが大切です。

そしてデザイン工程で、画像も準備していきます。
独自性を出すためにできる限り、既にある素材や撮影などを行い用意していくことが好ましいです。
それでも難しい場合は、画像素材を購入したり、フリー素材を利用します。
※画像には著作権もあるので、忘れずに確認しましょう。

デザインカンプ制作

デザインの方向性が決まったら、実際にデザインを制作していきます。

弊社ではビジュアル化した際に印象のズレや、違和感がないかをチェックするためにまず初めにTOPページを制作し確認してもらいます。
その後調整をして下層ページの制作に入ります。

またwebデザインは見た目のデザインだけではなく、サイトの見やすさや操作性を意識したユーザーインターフェース(UI)と、迷いがない導線設計や、使いやすさなどの体験を通してられる満足感、ユーザーエクスペリエンス(UX)を意識することが非常に大切です。

制作の流れその3|コーディング工程

コーディング工程

デザインが完成したら、webサイト上に表示できるように構築していきます。
このことを「コーディング」と呼びます。

デザインを元にコーディングをする

コーディングは主に、「ソースコード」と呼ばれる言語でプログラミングしていきます。
ホームページ制作でよく使うソースコードはHTML、CSS、JavaScriptなどです。

この工程に入ってからは、デザインの変更は難しくなるので基本的にNGとしている会社が多いです。

システムやCMSを組み込む(弊社ではWordPress)

お問い合わせや、お知らせ機能など”動的なサイト”にする場合はCMSを組み込んでいきます。

弊社ではWordPressというCMSを使っています。
WordPressとは導入数 世界No.1のCMS(投稿機能)です。
 お知らせに使われることが多いですが、カスタマイズをすることにより「お客様の声や」「制作実績」など頻繁に更新されるコンテンツにも活用できます。 

テスト

作業が完成したら、テストを行います。
テストをすることで、公開後のトラブルを避けることができます。

実際にクライアント様にも触って頂いて仕様通り動いているか確認してもらい、お問い合わせフォームなども機能しているか確認してもらいます。
さらにリンク切れや、スマホで見た場合に問題がないか?など細かなチェックを経て、問題がなければ公開作業をします。

制作の流れその4|公開、保守管理

本番環境に公開します。
ホームページ制作会社によっては、ステージング環境で制作する場合と、いきなり本番で制作する場合があります。(ステージング環境とはURLが違う場所に全く同じサイトを作り、テストする環境です。)

この公開までにたくさんのステップを踏んできましたが、ホームページは作ってからが本番と言われています。
作っただけでは成果を挙げるのが難しく、定期的な更新やメンテナンスをしてこそ効果が現れてきます。

「広島県呉市のホームページ制作|Leben」では、サーバードメインを代行で取得しHP公開後も、簡単な保守管理付きの年間プランもございます。

まとめ

ホームページ制作は基本的にはディレクター → webデザイナー → コーダーのように担当工程が決まっており、どの工程も外すことはできません。
また制作時間が長いことや、費用も決して安いものではありません。

広島県呉市のホームページ制作|Lebenではweb制作の個人事業主として、全て一貫して一人で完結するのでブレのないホームページを作ることができます。

見積もりやお問い合わせ、Web制作でお困りの際はご気軽にご相談ください。
お問い合わせページはこちら

この記事を書いた人

広島県呉市のホームページ制作|leben(小口 悠)

1992年山口県生まれ。広島を拠点に活動するフリーランスWebデザイナー。ホームページ制作歴5年以上。 中小企業や個人事業主向けに、WordPressでのオリジナルデザイン・SEO対策を行っています。

TOP

>

コラム一覧

>

ホームページ制作の流れ|依頼してから公開までを解説

ホームページ制作の流れ|依頼してから公開までを解説