PAMPHLET.make
東京
青山
03-5411-2202
  • 立川042-548-0362
  • 横浜045-550-4202
  • 千葉043-330-3106
  • 埼玉048-700-4010

サイト設計が、成否を分ける。Webサイト設計の秘訣

Webサイト設計の秘訣

Webサイト設計の基本ルール「階層を知る」

一般的なWebサイトは、ひとつのドメイン以下に複数ページを構成する複雑な構成になっており、いちばん上の階層(TOPページ)を第一階層、2段目の階層を第二階層、以下、第三階層、第四階層と、情報を深く掘り下げ、テーマを絞り込む度に階層が深くなっていきます。階層に関わらず、各ページには「ページタイトル」が設定され、「1ページ1タイトル」を基本としてページが構成されることで、検索エンジンはユーザーの「検索」に対し、「タイトルマッチしたページを検索結果に表示」していきます。

Webサイトは、受動的な媒体であり、検索結果に上位表示されることで初めてユーザーの閲覧機会を得ることが可能となることから、いかにして検索に最適化されたページで構成したWebサイトを作るかが、Webサイト制作の成否を分けると言っても過言ではありません。また、検索エンジン対策だけでなく、ユーザーが必要とする情報に直感的に到達できる導線設計や、ユーザーにとって有意義な情報コンテンツ、さらにはユーザーを魅了するビジュアルやユーザー体験など、ユーザビリティに配慮したサイト設計が不可欠となります。

これらを踏まえ、Webサイト制作時は、Webサイトの全体設計を「サイトマップ」で熟考し、検索エンジンにも検索ユーザーにもコンテンツリッチなWebサイトの完成を目指すことが、機能するWebサイト制作の基本であると言えます。「Webサイト設計の秘訣」と題する本ページでは、Webサイト制作に着手する前にすべきWebサイト設計についてを掘り下げ、目的に即したWebサイト制作を成功へと導きます。

TOPページの主な役割を理解する

ブランドイメージを醸成するTOPページデザイン

WebサイトにおいてTOPページは、企業・製品・サービスの第一印象を決定づけ、ブランドイメージを醸成することから、ブランドらしさや自社優位性が伝わるデザインでなければなりません。また、以降ページのデザイン構成にも大きく影響することから、全体設計を考慮したデザインが不可欠です。

ユーザーがはじめに着地するページの大半がTOPページであり、Webサイト内すべてのページの中で、最も多くユーザーが訪れるページでもあります。このことからTOPページは、目次としての役割を同時に果たし、ユーザーが目的とするページへのスムーズな誘導が可能なUI(ユーザー・インターフェイス)設計であることが大切です。

TOPページの主な役割①:ブランドイメージの醸成

TOPページは、企業・製品・サービスの第一印象を決定づけブランドイメージを醸成します。なかでもキービジュアルを含むファーストビュー領域は以降のサイト内回遊率にも多大な影響を及ぼすことから、自社優位性が直感的に伝わるデザインでなければなりません。Webサイトに興味・関心を抱くか否かはTOPページデザインによって決まると言っても過言ではないのです。

TOPページの主な役割②:サイト全体像の見える化

TOPページに着地するユーザーの大半は、Webサイトの全体像をTOPページで把握して、求める情報ページへと遷移します。このことから、TOPページは目次の役割を果たすとも言い換えることができ、下層ページに設計された情報ページをいかにしてTOPページで見える化するかが、以降のサイト回遊率を決定づける主な要因となると言っても過言ではありません。

TOPページの主な役割③:下層ページへのスムーズな誘導

同時に大切なのが、直感的な理解とスムーズな操作が可能なUI(ユーザー・インターフェイス)設計です。いくら最新の技術を用いたとしても、使いづらい、分かりづらいサイトであっては、Webサイトからの離脱を招きます。ユーザーがストレスを感じることなく、必要な情報へと容易に遷移できるよう、ユーザビリティを第一に考えたデザイン設計を心がけましょう。

下層ページの主な役割を理解する

検索エンジン&ユーザーからの評価は、情報コンテンツの質で決まる

Webサイトにおける下層ページは、第二階層を「大カテゴリ」、第三階層を「中カテゴリ」、第四階層を「小カテゴリ」として情報を掘り下げていきます。階層が深くなればなるほど情報カテゴリが細分化され、ページ数が多くなっていくのが特徴です。検索エンジンを利用するWebユーザーは、有意義な情報を求め、明確な目的を持って特定キーワードでの検索を行うことから、情報提供側はユーザーのニーズに最適化された有意義な情報を発信することが大切です。また、ユーザーが検索する際の検索ワードやニーズは多岐に渡ることから、Webでの情報発信の際は、広く深くを念頭に、多角的なWebページの制作が不可欠となります。

能動的に発信できるパンフレットやDMなどの紙媒体とは異なり、Webサイトは検索ニーズがあって初めて情報伝達の機会を得ることができる受動的な媒体であることから、「検索ニーズをいかに掴めたか」がWebサイト制作の成否基準の大きな要因であると言えます。そのために不可欠なのが下層ページの充実であり、サイトのテーマに即した関連性の高い下層ページを充実させることが、検索エンジン及びユーザーの高い評価を得る結果につながります。

第一階層「TOPページ」

第一階層はいわゆる「TOPページ」です。多くのユーザーはTOPページからサイトに流入してくることから、コーポレートサイトであれば企業ブランドのイメージを醸成する企業の顔となり、商品サイトであれば商品ブランドのイメージを醸成する商品の顔となります。Webサイト制作におけるブランドイメージ醸成において最も大切なのがTOPページデザインであり、ファーストビュー(ページを開いてはじめにモニターに表示される範囲)がブランドイメージを決定づけると言っても過言ではありません。
またTOPページは、サイト全体の「目次」でもあり、ユーザーはTOPページに配置された下層ページへのリンクボタンを確認することでサイト内の回遊が始まることから、いかに直感的なサイト遷移が行えるサイトであるかがWebサイト設計及びWebサイトデザインの重要なポイントであると言えます。

第二階層「大カテゴリ」

第二階層には情報の大カテゴリを設定します。例えば、一般的なコーポレートサイトにおける会社案内のディレクトリでは、「会社案内・目次」を第二階層に設計し、以下第三階層に「企業理念、会社概要、沿革、業績、CSR」などのページを設計します。目次ページの場合、ユーザーを目的のページに誘導することを第一義とすることから、目的とするページに直感的に到達できるよう、ページタイトルに加え、要約されたページ概要のみを記載するなどの配慮が必要です。

第三階層「中カテゴリ」

第三階層には情報の中カテゴリを設定します。例えば、一般的なコーポレートサイトにおける会社案内ディレクトリでは、第二階層に「会社案内・目次」、以下第三階層に「企業理念、会社概要、沿革、業績、CSR」などのページを設計します。第三階層以下の階層は、情報をどれだけ細かく掘り下げて公開するかによりサイト設計を計画していきますが、SEO対策を目的とするWebサイト制作の場合、目的に特化したキーワードでより広く、より深くコンテンツ開発をすることがSEOに多大な影響を及ぼしますので、より緻密なサイト設計が不可欠と言えます。

第四階層「小カテゴリ」

第四階層は情報の小カテゴリを設定します。例えば、一般的なコーポレートサイトの会社案内ディレクトリでは、第二階層に「会社案内・目次」、以下第三階層に「業績」、以下第四階層に「売上詳細」などのページを設計し情報を深掘りしていきます。情報設計において大切なのは、同一ディレクトリ(同一カテゴリ)内で関連性の高いページを構成することです。第二階層の大カテゴリに設定したテーマを深掘りしていくことで、ユーザービリティの向上を図るのはもちろん、そのテーマを深く紹介するサイトとして検索エンジンからの高い評価の獲得ていくことから、第二階層には検索エンジン対策(SEO対策)を行いたいキーワードを設定することが肝要です。

1ページ1タイトルでコンテンツを充実させる

ページ構成の基本ルール「ページタイトルと見出し」を知る

ページタイトルはいわゆる「大見出し」であり、そのページ全体のタイトルとなります。ページ全体の構成は、以降「中見出し」「小見出し」「小見出しの小見出し」のように掘り下げていきます。この大見出しに対し、中見出し、小見出しがそれぞれ関連性を持つことで、「大見出しに設定されたページタイトルを詳しく解説するページ」であると検索エンジンに認識され、検索優位に働きます。タイトルマッチされたページのコンテンツを充実し、ユーザーの有意義な情報を提供することが検索エンジンGoogleの最も重要視する部分であることから、1ページ1タイトルを原則としたコンテンツの充実が、Googleの推奨する本質的なSEO対策であると言えます。
もちろん、見出しに続くコンテンツのユニークさや充実度も、重要な評価ポイントとなりますので、他社サイトのコンテンツを真似るのではなく、独自の観点でユーザーに有意義なコンテンツ開発を行うことが大切です。

大見出し(h1)

大見出しは、ページタイトルを紹介する見出しとなることから、1ページに1つの記述しかできないルールになっており、多くはページタイトルと近い表記となってきます。例えば、Webサイト制作というページでは、ページタイトルに「Webサイト制作」と設定した場合、大見出しには「Webサイト制作について」などの記載を行います。
検索エンジンがWebサイトの各ページを確認し、どのような情報コンテンツが掲載されているのかを判断する情報として、ページタイトルと大見出し(h1)は重要な役割を担うと言われていることから、ページ制作の際はページタイトルに即した大見出しを意識して情報設計を行うことが大切です。

中見出し(h2)

大見出しに続く中見出しも、ページ設計の上で大変重要な役割を果たします。例えば、Webサイト制作というページでは、大見出しが「Webサイト制作について」であった場合、中見出しには「Webサイト制作のコツ」や「Webサイト制作時の注意点」などが続きます。大見出し(h1)が1ページに1つの記載しかできないに対し、中見出し(h2)は複数の記述が可能であり、中見出しでページタイトルに即したテーマを広く紹介することができます。

小見出し(h3)

中見出しで紹介したテーマをさらに詳細までポイントごとに紹介する際に使用するのが小見出し(h3)の役割です。例えば、Webサイト制作というページでは、大見出しが「Webサイト制作について」、中見出しが「Webサイト制作のコツ」であった場合、小見出しには「制作のコツ その1.要件を明確化する」「制作のコツ その2.カテゴリ毎に分類する」などが続きます。小見出し(h3)も中見出し(h2)同様に複数の記述が可能であり、ページタイトル、大見出し、中見出しでの流れで広く紹介したひとつのテーマをさらに掘り下げ、深く紹介することができます。

ページタイトルをカテゴリ毎に分類する

ユーザビリティを第一に考えたサイトマップを設計する

Webサイトの階層と、ページ構成の基本ルールを理解した後、次に行うのが「どのようなページを制作するか」を緻密に計画し、サイトマップを設計することです。サイトマップ設計時は、第二階層の大カテゴリを基軸に、階層が下がるたびに情報が掘り下げられていく構造を意識します。

例えばコーポレートサイトでは、ざっくり「会社案内」というページにまとめるのではなく、第二階層に「会社案内」、第三階層に「会社概要、代表メッセージ、沿革、業績、CSR、品質に関するポリシー」などとしてページタイトルを細分化して、カテゴリ毎に分類していきます。これにより、ユーザーが知りたい情報が明確なページタイトルとなり、最も少ないアクションで迷うことなく知りたい情報にアクセスすることが可能となります。

大切なのは、ユーザーのことを第一に考えた使いやすいサイト設計を行うことであり、その情報が充実してユーザー満足度が高まることで、将来的な企業価値向上へとつなげていくことが肝要です。

強化したいキーワードを広く・深くサイト設計する

情報コンテンツによるSEO対策はサイト設計段階で決まる

役割や用途・目的の如何を問わずWebサイトは、検索ユーザーへの情報提供を目的に制作されることから、自社サイトに流入したユーザー数やページ閲覧数(ページビュー)の総数が、最もシンプルな評価基準のひとつであると言えます。であれば、いかにして自社サイトへの流入を獲得するかを計画することが、Webサイト設計段階において必要不可欠かつ重要な施策であると言えますが、どのようなWebサイト設計を行えば、自社サイトへの流入を獲得することができるのでしょうか。

検索エンジン利用においてユーザーは、特定キーワードでの検索を行い、目的とする情報が掲載された有意義なWebサイトを探し、情報コンテンツの閲覧を行います。その検索ワードは、同様のニーズであってもユーザーにより異なり、検索結果も同様に異なります。また、多くのユーザーが検索するであろうと想定されるキーワード(ビックワード)でのページ流入を狙うライバルサイトは世界中に多数存在し、ビックワードであればあるほど多くの意図を含むことから、同義語・類似語などを含め、多くのページが検索結果として表示されることが想定されます。

それらを踏まえた上で、最も本質的なSEO対策が「検索ワードに最適化したページの制作」です。同様のニーズであってもユーザーにより異なる検索ワードや、検索のブレを想定し、強化対策を行いたい検索ワードに最適化したページや関連ページを、1ページ1タイトルで、できる限り広く・深く制作していくことが大切です。特定キーワードを広く・深く掘り下げることで検索エンジンは、「特定の情報コンテンツが広く・深く紹介された、ユーザーにとって有意義なページである」と評価します。これにより、各ページが相対評価を受け、検索エンジン優位に働くことで、ユーザーの閲覧機会の獲得へとつながります。

情報の流れがスムーズな導線設計を考える

ユーザーを誘導する「情報の流れ」を考える

知りたい情報にいち早く到達できること。これはWebリテラシーの優劣に関わらず、すべてのユーザーにとって最も大切なポイントです。ひとつのコンテンツに興味を抱き閲覧した後のアクションとして、続きのコンテンツに誘導する、または問い合わせや商品購入へとつなげる、さらにはどちらにも遷移できるなど、ユーザーの行動を念頭に置いたサイト設計と導線設計がWebサイトの優劣を左右します。

次ページの閲覧をするために一旦TOPページに戻るなど、不要なクリック数が増えれば増えるほどサイトからの離脱率は高まり、目的とするコンバージョンに到達しないばかりか、ページビュー数や滞在時間の低下によりSEO対策にも不利益となってしまう結果を招きます。

大切なのは、ユーザビリティを第一に導線設計を行うこと。そして、次にどのページに誘導するか、次のアクションとしてユーザーが何を求めるかを予め推測し、ユーザーが迷うことなく必要な情報に順次到達できるよう、Webサイト設計段階から綿密な導線設計を行うことに他なりません。

Webサイト設計の評価基準

Webサイト設計段階においては、機会の創出と信用担保が主な評価基準

Webサイト設計段階での評価基準は「そのWebサイトが役割を果たし、自社の目的とする体験やアクションにユーザーを導けるか」にあります。例えば、コーポレートサイトであれば、企業の信用を担保し、ユーザーに安心感を与え、信用を得ることができるかなどが考えられます。ブランドサイトであれば、ブランド・ロイヤルティ(ブランドへの忠誠心)を高め、ブランドをさらに好きになることで、そのブランドを継続して購入する程度を高めることが考えられます。また、集客サイトやECサイトであれば、問い合わせや購入など直接的な売上向上の機会創出へとつなげることが考えられます。

そのためにWebサイト設計段階ですべきことは、ユーザーに自社や自社ブランドを認知してもらうタッチポイントをWeb上で広く設計し、多くの機会を創出するとともに、関心を高めていくことで目的達成へと導くことが肝要であり、検索エンジン上位表示が成否を分けると言っても過言ではありません。もちろん、以降のフェーズで行う「コンテンツの質」や「ユーザビリティの向上」はとても重要となりますが、Webサイト設計段階においては、閲覧機会の創出が可能なサイト設計であるか、情報公開による信用の担保が可能なサイト設計であるかが主な評価基準であると考えられます。

本質的なSEO対策とは

ユーザーに有意義な情報コンテンツを、最適な環境で提供することが最大のSEO対策

現在では広く認知された「SEO対策(検索エンジン上位表示対策)」ですが、検索エンジンが普及する過程において、不正なSEO対策が世界中で横行したことや、検索エンジン性能の飛躍的な向上により現在では、検索エンジンを欺く過度なSEO対策や不正なSEO対策は、厳しいペナルティの対象となっており、大きなリスクとの背中合わせになっています。

検索エンジンを開発・運営するGoogleの基本ポリシーは、「検索ユーザーに有意義な情報コンテンツを提供する」ことであり、検索エンジンの開発・改善も基本ポリシーに即して行われていることから、「SEO対策=ユーザーにとって有意義な情報コンテンツを提供すること」が最も本質的なSEO対策の基本であり、閲覧デバイスに対する最適化(スマホ対応)や、閲覧環境の最適化(表示速度やセキュリティ対策)など、ユーザビリティを徹底して向上していくことが包括的なSEO対策につながるとされています。

クリエイティブに自信のあるクリエイター必見!フリーランスクリエイター募集

PAMPHLET.makeを運営するパドルデザインカンパニーでは、フリーランスで働くクリエイターとの協業を強化しています。Web、グラフィック、動画・映像、コピー、撮影、ブランディングなど、パドルデザインのクリエイティブにご興味のある方からのご連絡お待ちしています。

募集詳細へ