2021年7月29日

Webサイト制作の基本！工程や主流なツール、自前と制作会社に任せたケース比較

Webサイトを制作するには、定番の方法や工程があります。初めて制作に取り掛かる担当者の方は、こういったパターンを知っておくとスムーズです。また、自前で制作する以外に制作会社に外注する方法があり、両方のメリットを比較することも役立ちます。今回は、Webサイトの制作方法や工程、自前と外注のメリットの比較や制作で意識すべきポイントを紹介しましょう。

コーポレートサイト制作について
クライマークスのソリューションを見る

1.Webサイトの制作方法

Webサイトの制作方法は、主に3種類です。ここではHTML、CMS、ホームページ作成サービスの順に紹介します。

1-1.HTML

HTMLとは、Webブラウザに文書などを表示させるための言語です。文書のほか画像や動画を表示したり、リンクを設置したり、テキストを装飾したりなどしてWebサイトを構築できます。
HTMLでWebサイトを制作するには、HTML言語を理解した上でサイトを構築する必要があります。制作をサポートするためのツールとして定番なのが「Adobe Dreamweaver」です。編集、レイアウト表示、ファイル管理といった機能があります。

1-2.CMS（コンテンツ・マネジメント・システム）

CMSとは、Webサイト制作をするのみでなく、公開後の運用更新も効率化できるツールです。特別なエディタなどを用意しなくても、Webブラウザ上で管理画面より操作や編集ができます。文書の入力や画像・動画のアップロード、更新についても専門的な知識は必要ありません。
CMSで主流のツールは「WordPress」です。基本機能は無料であるほか、無料・有料のさまざまなプラグイン（追加機能）も用意されています。

1-3.ホームページ作成サービス

ホームページ作成サービスとは、Webサイトをクラウド上で制作できるサービスで、HTMLなどの専門知識がなくとも問題ありません。利用者は、ブラウザから作成サービスにアクセスすることで制作ができます。CMSは自分でサーバーに「WordPress」などのソフトをダウンロードしたり、それがセットされたサーバープランなどを選択する必要がありますが、作成サービスでは必要ありません。
主な作成サービスには「Jimdo」や「Wix」などがあります。月額料金制でサイト構築が可能です。

2.Webサイト制作の工程

Webサイト制作は、着手からリリース後まで大きく8つの工程に分けられます。ここでは、それぞれの工程でどのような作業が必要なのかについても触れながら解説しましょう。

2-1.コンセプト策定

新規制作、リニューアルを問わず、目的やゴール、そしてターゲットユーザーを明確化したペルソナ設計をしていきます。ここが明文化されていないと、設計面、デザイン面など制作の工程で判断基準が曖昧になり、プロジェクトが混乱したり、制作してもゴールを達成できないことに繋がりかねません。出来るだけ詳細化したコンセプト策定をしてください。

2-2.基本設計

まずは、基本的な設計を企画します。前述のコンセプト策定に応じて、ふさわしいテーマやコンテンツ方針、ページ数を確定させていきます。その上で、ディレクトリ階層やメニュー構造といったサイトの骨組みを構成していくのです。さらには、コンセプトに沿った画面レイアウト（ワイヤーフレーム）詰めていきます。この工程をリード設計と言うこともあります。

2-3.詳細設計

基本設計に基づき、各ページ毎に情報整理を行い、テキスト・画像などをワイヤーフレームに落としていきます。同時にその素材準備も進行していきます。
また、基本設計段階で次工程にあるTOPページデザインを進行することもあります。

2-4.デザイン選定とコーディング

Webサイト制作の目的やターゲットとなるペルソナに合わせて、デザイン制作となります。一般的にはTOPページや主要ページから方向性を固め、下層ページのテンプレート制作を進行していきます。デザインの方向がブレないようにボタンやメニュー、レイアウトなどのパーツ集を作成すると、複数のメンバーがデザインしても統一感を持ったWebサイトデザインになります。デザインが固まったら、実際にそれをサイト上に反映するためにHTMLやCSSを記述する「コーディング」の段階です。

2-5.システムへの実装

コンテンツやデザイン、機能などが確定した後は実装です。HTMLにてサイトを作成する場合、サイト構造や装飾などを言語で記述（コーディング）する必要があります。また、CMSなどのツールを使う場合も、サイトの基本構造を構成するシステムに対して一部カスタマイズしたり新しい機能を実装したりする場合には、HTMLやCSS、PHP、JavaScriptなどの言語によってコーディングが必要です。

2-6.動作チェック

Webサイト構築が完了したら、テスト環境で動作をチェックします。仕様書に従って、設計通りか、対象とするブラウザで正常に動作するか、文字化けやレイアウト崩れが起こっていないかなどを確かめましょう。また、サイト内検索やアクセス計測タグといった付属機能や、JavaScriptが作動しているかもチェックします。

2-7.リリース

仕様書に沿ってWebサイトの構築が完了して動作チェックも済んだら、Webサイトを公開します。サーバーにファイルがアップロードされているか確認した上でドメインを設定しましょう。また、リニューアルに伴ってURL変更がある場合には、リダイレクトも設定する必要があります。リダイレクトにより、ユーザー・クローラーを迷わせることがなくなり、SEOパワーも引き継ぐことが可能です。

2-8.運用・保守

リリースが済んだら、定期的に点検や保守運用を行います。サイト作成ツールや付属機能を最新版にバージョンアップする必要がないか、アクセス数増に伴ってサーバーを増強する必要がないかなどをチェックしましょう。また、新機能追加やレイアウトの修正といった調整が必要になることもあります。

3.自分で制作するか、プロのWebサイト制作会社に依頼するか？

Webサイト制作は、自社で行う方法とプロの制作会社に依頼する方法の2通りがあります。どちらを選ぶか検討する際は、両者のメリットを知って比較することが重要です。

3-1.自分（自社）で制作するメリット

自前で制作する場合、自由度の高さとコストの低さという2つのメリットがあります。

Webサイトは、デザインや機能などバリエーションは無限です。自前で制作すれば思い通りのものを構築できるだけでなく、外部に依頼する手間がないので修正や更新もスピーディになります。ただし、これには自社内にHTMLやデザインといったスキルを持つ人材がいることが前提です。

また、外部に委託するよりもコストが抑えられることが期待できます。Webサイト制作は初期制作費用のみならず、保守運用にも費用がかかりますが、自前であれば節約になる点は長所です。

3-2.制作会社に依頼するメリット

制作会社に依頼するメリットとしては、専門性の活用とリソースの節約の2点があります。

制作会社をしっかりとした観点で選ぶことができれば、自社の業種やイメージに合う理想のWebサイトを制作できるという点が最大の特徴です。ほかにも、スマートフォンなどマルチデバイスでのクオリティ担保や、SEOなどマーケティング面についてもプロの力を借りられます。

また、リソースの節約も可能です。Webサイトの構築や運営には時間や労力、コストなどがかかります。外部に委託すれば、こういったリソースが不要なので大幅なコスト削減につながる可能性もありますし、リリース後の保守運用を一任できるので自社は本業に集中できるのです。

4.Webサイト制作　3つのポイント

Webサイト制作にあたっては、成功のポイントがあります。これらを意識しておけば、制作がスムーズになったりすべきタスクが明確化したりするなど、効果は少なくありません。ここでは、3つのポイントについて紹介します。

4-1.目的を明確にする

まずは、Webサイトを制作する目的を明確にしましょう。この目的は、サイトコンセプトやコンテンツ方針、デザインなど全ての土台になるものです。例えば、新規顧客獲得のためには集客を強化する検索・SNS対策が重要ですが、目的がリピート獲得であればレコメンド機能や会員ページの構築が重視されます。

目的が不明確なままだと、コンセプトがぶれてしまい統一感のないサイトになってしまいかねません。「何のためにWebサイトを構築するのか」「どのような結果を得たいのか」を明らかにする必要があります。

4-2.ターゲットを明確にする

ターゲット選定も重要です。Webサイトは「認知度を高めたい」「購入につなげたい」などさまざまな目的がありますが、「WHO」（誰に対して）があいまいな状態では、誰かに刺さるようなサイトづくりはできません。

同じテーマや商品を扱う場合であっても、ターゲットの性別、年齢、地域、仕事などによって、好みやニーズは大きく変わるでしょう。こういった顧客属性を具体的に設定すれば、コンテンツやデザイン設計でも迷いが減り、顧客にとって有益なWebサイトを構築できるでしょう。

4-3.継続できる環境づくり

Webサイトは構築すれば終わりではなく、継続的に運営していくための体制も必要です。Webサイト運営では、コンテンツの更新や修正、機能のメンテナンスなど行うべき仕事は少なくありません。また、アクセス数や問い合わせ件数などを増やすにあたって、データ分析をしながらレイアウトを調整したりコンテンツを修正したりといったPDCAの取り組みが必要になることもあります。

こういった視点が欠けていると、サイトの構築には成功しても、リリース後の対応が行き当たりばったりになりかねません。Webサイト制作をスタートする際には、長期的な視点も持ちながら組織体制や環境の整備にも着手しましょう。