ホームページ制作 – 全体の流れ

　ホームページの制作の始まりは、要件定義・設計から始まります。ホームページの目的や目標を決める工程です。住宅の建築に例えると、土地を決め、コンセプト・予算などを考える工程にあたります。

　ホームページ制作は、大まかに次の工程に分かれています。

• 企画
• 設計
• 制作
• 公開
• 運用・保守

　ホームページ制作というと、デザインやプログラミングのことをイメージする方も多いかもしれません。しかし、Web制作会社では企画・要件定義をとくに重要視しています。

　それは、制作段階での目的・目標の変更を防ぐためです。制作段階での目的・目標の変更は、作業全体に影響を及ぼし、各工程を見直すなどプロジェクト自体を潰しかねません。当然、無駄な時間と費用もかかってきます。

　この記事では、ホームページ制作全体の流れ・工程を、広く浅く解説しています。ホームページ完成までのプロセスを理解し、失敗のないホームページ制作を目指しましょう。

ホームページの企画

　では、企画からみていきましょう。

クライアントへのヒアリング

　ホームページをつくる側の要望をまとめておきます。提案する側とクライアントの合意形成を図るために使用されます。

• ホームページに入れたいコンテンツ
• デザインの方向性
• ロゴ・写真などの素材

　ホームページをつくる側の一方的な提案にならないように、コミュニケーションを図り、ヒアリングシートとして、文書で残します。

ホームページの目的を決める

　大きく分けて次の2点になります。

• 情報の発信としてのホームページ
• 営業ツールとして売上に貢献するホームページ

情報の発信としてのホームページ

　企業からのお知らせ・新製品の紹介など、自社にまつわる情報発信を目的とします。オウンドメディア・ブログなども情報発信を目的とするものです。

営業ツールとして売上に貢献するホームページ

　商品の購入・お問い合わせ・人材の採用など、直接的な購買や閲覧者の行動促進を目的としています。

企画・提案

　ホームページの目的をもとに、コンセプト・ホームページの用途を具体的に考えていきます。

• 自社分析（製品・人材リソースの洗い出し）
• 市場の調査・競合の分析
• 公開時期の決定・スケジュールの確認
• 予算などの確認

　この時点でホームページの方向性が決まるといってもいいでしょう。

ホームページ制作に必要な企業（自社）情報の整理

要件定義

　要件定義と難しい言葉で表現されますが、要するにホームページをつくる上で必要な要素・工程・素材を洗い出す工程です。

• どんな技術を使うか
• どんな人たちへ向けたホームページなのか
• 制作期間・制作時期の決定
• ホームページの流入経路
• 公開後の運用について

　制作開始から公開・運用についての要件を洗い出し・決めておくことです。

契約

　秘密保持契約（NDA）や著作権・情報管理の方法など、契約を書面で交わします。

ホームページの設計

　企画をもとにホームページの設計をします。次の項目を決定していきます。

• サイトマップの作成
• ワイヤーフレームの作成
• デザインの方向性を決める
• システムの確認
• ホームページの導線を考える

サイトマップの作成

　サイトの全体像を可視化していきます。

• 全体で何ページ必要か
• どんなページが必要か
• 各ページとの関連性の確認

　通常エクセルなどで可視化し、全体像がひと目で分かるようにつくります。

ワイヤーフレームの作成

　サイトマップをもとに、Webページの図面をつくる工程です。デザインをせず、レイアウトやコンテンツをより具体的に検討するために制作されます。Web制作では「ワイフレ」と略されて呼ばれることが多いです。

　この時点で、Webライティングなどの制作も同時進行ですすめることもあります。

　プロトタイプでワイヤーフレームをつくる場合もあります。

デザインの方向性を決める

　ヒアリングシートやワイヤーフレームに基づき、デザインの方向性を決めていきます。ホームページをつくる側とデザインの意思疎通を図るため、参考サイトを探すなどベンチマークなどを通じて、共通認識を固めていきます。

　以下の資料を作成する場合もあります

• デザイン方針定義書の作成
• デザインテイストの決定

　この時点でのデザインは、あくまでデザインの提案段階になるので、修正を重ね検討していくことになります。

システムの確認

　ホームページに使用するシステムの確認・決定をします。

• お問い合わせページの作成
• ブログ機能の作成
• アクセス解析の確認
• 使用するサーバーの決定
• WordPress導入

　システム構築は、一旦制作段階にはいると、修正・追加が難しくなります。場合によっては要件定義からやり直す必要もでてくるため、しっかり確認する必要があります。

ホームページの導線を考える

　ユーザーがホームページに辿り着くまでの導線を検討します。企画の段階でも考えますが、この段階では、より制作工程に関連した導線を具体的にしていきます。

• 検索エンジンからの流入
• SNSからの流入
• リスティング広告からの流入

　これらの流入経路を検討し、設計に落とし込んでいきます。

ホームページの制作

　ここからが実際のホームページ制作工程になります。大きく次の工程に分かれます。

Webデザイン

　ワイヤーフレームをもとに、レイアウトやビジュアル・装飾を作り込んでいきます。Webデザインは次の工程で進行することが一般的です。

1. グランドデザインの作成（主にトップページ）
2. 主要ページのデザイン作成
3. 下層ページのデザイン
4. パーツ（コンポーネント）の作成
5. 写真の選定

　Webデザインはすべてのページをデザインするわけでなく、まずトップページなどの主要なデザインをつくります。その後、必要なパーツだけをつくって、パーツを組み合わせることによってページを構成していきます。

Webコーディング

　コーディングとは、Webデザインをプログラミングすることにより、インターネット上で閲覧できる形にする作業のことです。基本的にWebコーディングでは、次のプログラミング言語が使われています。

• HTML
• CSS
• JavaScript

　各言語が果たす役割は割愛しますが、ホームページをつくる上で必ず必要なプログラミング言語であることは覚えておきましょう。

Webシステム構築

　ホームページのシステムとして、いちばん身近にあるシステムは「お問い合わせ」です。

　お問い合わせは、一般的にユーザーから受け取った情報をサーバーに保存し、自動返信メールを送るなどの機能があります。
　この「お問い合わせ機能」を実装するには、サーバー側でユーザー情報を処理するプログラミングが必要になります。

　Webコーディングは、一方的に情報を受け取るコミュニケーションですが、Webシステムはユーザーとの双方向のコミュニケーションが可能になるのです。

　ちなみにWordPressは、PHPというプログラミング言語で構築されたWebシステムです。

ホームページの公開

　ホームページはサーバーにファイルをアップすることでインターネット上に公開されます。公開はそのまま本番公開されることはありません。テストサーバーやテスト環境で検証・デバッグをし、修正した後に公開されます。

テスト・デバッグ

　テストサーバーやテストドメインなどを用意し、ホームページの表示の確認・修正を行います。

• ブラウザでの表示確認
• お問い合わせ機能の検証
• ブログ機能の検証
• アクセス解析の動作確認

　ホームページは、軽微な修正であればいつでも直せることがメリットのひとつです。しかし、訪問したユーザーは表示が崩れたホームページ・システムが正常に動作しないホームページを見ることになるため、信用・信頼を落としかねません。

　しっかりと検証し修正したのちに公開しましょう。

バックアップの取得

　ホームページを構成するファイルはすべて、必ずバックアップを取りましょう。

• プログラミングされたファイル
• サーバーに登録したデータベース
• ログインID・パスワードの情報

　不意にファイルを削除してしまった。間違った修正をしてしまい、修正前の状態にもどしたい。など、公開前はより慎重に作業を行う必要があります。

公開・リリース

　これまでの作業がすべて終了してやっと、本番サーバーにファイルをアップし、公開・リリースとなります。公開した後は、リリースしたことを周知する必要があります。

• ホームページでのお知らせ・SNSで周知する
• Googleなどの検索エンジンへインデックスする

ホームページでのお知らせ・SNSで周知する

　ホームページに記事の更新機能が備わっている場合は、お知らせ記事を書きましょう。また、SNSでホームページのリリース情報を投稿し、知り合いの方などへ、拡散のお願いをしましょう。

Googleなどの検索エンジンへインデックスする

　検索エンジンに知らせないと、ホームページは検索にヒットしません。この作業を「インデックス」といいます。

　ホームページはユーザーに閲覧してもらわなければ成果は得られません。公開・リリースは、周知や認知を同時に行いましょう。

ホームページの運用・保守

　公開・リリースしたホームページは継続的にメンテナンスする必要があります。ホームページのページを増やしたり、最新の情報にコンテンツを更新していきましょう。

運用

　ホームページを持っているだけでは成果がでません。長期的な運用視点で成果を出していく必要があります。

• ブログの更新
• コンテンツの拡大・最新化
• 機能・使いやすさの改善
• 認知・拡大の戦略を考える

　これらの作業を継続して行うことが出来なければ、ホームページから成果を生むことは難しくなるでしょう。

保守・定期バックアップの取得

　ホームページの制作技術は、ものすごいスピードで変化しています。サーバーの障害やセキュリティの脆弱性には注意しておきましょう。

　中でもサーバーにあるファイルやデータは会社の資産になるため、消失すると大きな損害になります。また、個人情報を保持していれば損害賠償などの問題に発展しかねないため、定期のバックアップは必ず取るようにしましょう。

ホームページ制作で大切なこと

• 何のためにホームページをつくるのか
• ホームページを公開した後、どのような運用をするのか

　この2点が明確になっていないままホームページを制作してしまうと、大切な時間とお金を無駄にしてしまいます。

　ホームページ制作の全体像を知っておくことで、ゴールまでに必要なプロセスが明確になってきます。
　これまで紹介した工程は、僕が実際にWeb制作会社で経験した実務を基本にしているため、多少難しい部分もあったかも知れません。ですが、知っておいて損はない知識だと思います。

　あなたのホームページ制作にお役に立てれば幸いです。