ホームページ制作の流れって ? 知ってるようで知らない制作手順をまとめてみました

ホームページを制作すると決めた時、まずどこから何をしたらいいものか …
「ご自身で制作をする」 「制作会社に依頼する」
どちらを選択されるとしても、制作手順を把握しておくことが重要です。
制作会社さんそれぞれの部分もありますが、今回はUPToolsでの制作手順を元に制作手順の流れをご説明します。

なぜホームページを作るのか ? 目的を明確にすることから始める

「ホームページを作りたいと思ったのだから目的は明確だよ。ホームページを作りたいんだ」
という声も聞こえそうですが、ここで重要なのは「なぜ」の部分。

  1. とりあえず店舗の情報があればOK
  2. 集客をして売上をUPさせたい

まず、この2点だけでもホームページ制作での必要な要素は変わってきます。
では、集客をしたい !となった時にその対象はどうでしょう。

  1. まだ会ったことのない顧客、企業へのアプローチとして活用したい
  2. すでにサービスを知っている人へ、より知ってもらう情報提供として活用したい

ホームページを制作して「商品を売りたい」「問い合わせを増やしたい」「お客様への情報提供をしたい」など、ホームページに求める具体的な成果を明確にし、この段階からSEOについて考えながら進めていかなくてはいけません。

目的が決まったらその内容を書き出してみる

何をホームページに掲載するか、目的に沿って書き出してみましょう。
例えば、「とりあえず店舗の情報があればOK ! 」ということならば最低限の費用な情報は

  • 事業内容
  • 所在地
  • 問い合わせ先
  • アクセス

となるでしょうか。
さらにホームページでの集客を真剣に考えるのであれば上記の情報の他に

  • 事例紹介
  • Q&A
  • お客様の声
  • ブログ記事

これらの要素が必要となります。

これも必要かも ? と思う情報はひたすら書き出してみましょう。書き出して精査していけば良いのです。

「なかなか思い浮かばない … 」 この段階で大変だと思われる方もたくさんいるかもしれません。

そのような時は、同業他社さんのホームページなどを参考にしてみると、より自社で伝えたい情報は何なのかのヒントがもらえることが多々あります。

この作業を疎かにしてしまうと後々「こんなはずではなかった」という状態になってしまいます。

必ずこの段階で目的を明確にして、作成するホームページの内容について深く考えること、ここでしっかりと貴社のサービスの素晴らしい点・強みを見つけ出すことがより良いホームページを制作する上でとても大切なことです。

アイデアを書き出す

ホームページの構造を決めていく

ホームページは一番上がTOPページ、そのすぐ下に大きなカテゴリー、その大きなカテゴリーそれぞれに小さなカテゴリーで構成されています。

どのページがどのカテゴリーに属しているのか、そこからどのメニューに属しているのかをまとめたものがサイトマップと言われるものです。

エステサロンのホームページ制作時のサイトマップをみていただくとわかりやすいかと思います。

サイトマップ

エステサロン サイトマップ
こちらのサイトマップから、大きなカテゴリーである全体の構造を決め、それぞれの各ページの構造をワイヤーフレームで作成していきます。

ワイヤーフレームとは「ワイヤー【線】」と「フレーム【骨組み】」を使って、各ページのどこに何を掲載するかを示す図となります。設計図のように考えてもらえればいいかと思います。

先程のエステサロンのメニューページのワイヤーフレームはこのようになります。

ワイヤーフレーム

エステサロン メニュー ワイヤーフレーム

どうすれば見やすく、わかりやすく、伝えたい人に伝えることができるのか。

自分の伝えたいことを羅列させるだけでなく、いかに相手にわかりやすく見やすく伝えるか、自社を知らない人に知ってもらえるか、見てくれた人の目線に立つことを大切にしたいところでもあります。

ワイヤーフレームを制作する頃には、イメージもだいぶ掴めて来る頃です。このあたりから同時進行で画像を用意して頂いたり、テキストの作成が始まります。

画像に関しては、今はフリー素材もたくさんありますが、オリジナリティを出したいとご希望なら、会社概要、代表者のお写真、商品など重要な箇所だけでもプロのカメラマンに撮影していただくことをおすすめしています。

デザイン制作へ

ここまで骨組みをしっかりと作成をしてからデザイン制作が始まります。

Webデザインは、制作するホームページのイメージを各ページで統一させることが大切です。

プロのWebデザイナーさんは、全体の構造、それぞれのページの構造、テキスト、ご用意して頂いた画像などからホームページ全体のイメージを考えて全ページに統一感を持ってデザインを出してくれます。

今はたくさんのデバイスからの閲覧が多く、パソコン・タブレット・スマートフォンとそれぞれに自動的に表示が切り替わるレスポンシブデザインが主流です。

きれいであることはもちろんですが、どのデバイスからでも見やすく、使い勝手の良いデザインを重視しています。

コーディングから公開へ

ここからコーディングが始まります。コーディングとは、プログラミング言語を使用してプログラムを組み立てていくことです。
コーディング プログラミング

サイトマップ、ワイヤーフレームで作った設計図から実際の組み立てに入りました。
このコーディングによって、ウェブブラウザ(Internet Explorer、GoogleChromeやSafariなど)で閲覧できるようになります。

これでホームページの制作作業の流れとしては終わりですが、ホームページを完成させたらいよいよ公開です。

ホームページの家となるサーバーを設定して住所となるドメインを取得します。

そこに制作したホームページのファイルをアップロードすれば、世界中どこからでもホームページを見ることができるようになります。

まとめ:目的設定→企画→設計が重要

一連の流れをご覧頂いていかがでしたでしょうか ?

企画から設計までが時間かかりそうだなとか、面倒くさそう … 難しそう … と思った方も多いかもしれません。

しかし、この部分に時間を使うことで、この先の戦略が考えられたり、自分が今まで気づいていなかった自社の強みを見つけたりできるのです。産みの苦しみといったところでしょうか。

それこそをぜひ活かし、集客、活用ができる、成果が出るホームページを制作していただければと思います。

ホームページで成果を出したい ! を応援します

ホームページ制作・運営サポート

この記事を書いた人

Chiaki

【仕事で大切にしていること】 お客様の事業における問題点・課題点についての解決策を一緒に考え、1つ1つ丁寧に 『 実行 ↔ 解決 』 適切なIT支援、組織活性化のお手伝いをさせていただきます。

読んで頂きありがとうございます!

フォローしてこのブログの更新情報を受取る

★ いちばん新しい記事!

年末年始休業のお知らせ