情報設計とは?Webサイト制作における情報設計の重要性
公開日:
更新日:
主にWebサイトの制作において情報設計は非常に重要な要素であり、せっかくのサイト制作の予算を無駄にしないためにも力を入れたいポイントです。本記事では、主にWebサイトの制作における情報設計の重要性や、情報設計を行う上でのポイント・流れを解説していきます。
これから成果の出るWebサイトを制作されたい方や、現行のWebサイトの成果を改善したい方は、ぜひ制作前の情報設計のフェーズにも力を入れてみてください。
情報設計とは?
情報設計(Information Architecture)とは、Webサイトに限らず、情報の受け手が欲しい情報を適切に届けるための設計のことを指します。情報設計はUXデザインの一つの要素であり、サイトのユーザーエクスペリエンス(UX)を高めるために必要な工程です。
特にWebサイトの情報設計においては、ペルソナやカスタマージャーニーに従って、サイトマップの作成、メニューの構成、ページ内の情報の配置、見出しやリンクの表現方法などを検討します。これらの要素が適切に設計され、ユーザーは目的の情報にたどり着きやすくなることで、見込み顧客の離脱を防いだり、コンバージョン率(CVR)を向上することができ、より成果に繋がるWebサイトを制作できます。
UXデザインの中での情報設計の位置付け
UXデザインの考え方のフレームワークとして、ギャレットが提唱した「UXデザインの5段階モデル」が有名です。こちらのフレームワークでは、UXデザインを下記の5つのプロセスに分けて理解しています。

1.戦略段階:プロジェクトの目的やユーザーニーズの定義
2.要件段階:求められる機能やコンテンツの要件を定義
3.構造段階:情報設計やインタラクションデザイン
4.骨格段階:インターフェイスの設計
5.表層段階:ビジュアルデザインを作成
この5つの段階の中で、情報設計は「構造段階」に位置し、戦略や要件と、骨格や表層を繋ぐものになります。
特にWebサイトの制作においては、制作の目的やサイトが担う役割を決める「戦略段階」や求められる機能や要件を定義する「要件段階」で決定したことに従って、最適な構成を設計することが求められます。「構造段階」で行った情報設計をもとに、「骨格段階」でワイヤーフレームを作成し、「表層段階」のビジュアルデザインの作成へと繋がります。
※参考:『The Elements of User Experience ~5段階モデルで考えるUXデザイン』(Jesse James Garrett)
Webサイト制作における情報設計の目的
Webサイトの制作における一般的なプロセスは、「戦略策定→要件定義→情報設計→デザイン制作→実装」という流れで進みます。情報設計フェーズは、戦略策定フェーズで設定した目標を達成するための設計を行い、その後のデザインフェーズへ繋げることが主な目的です。

情報設計は、Webサイトの最適化において非常に重要な役割を担っています。例えば、ユーザーが求めるページにたどり着くことが難しい場合や、ユーザーに求める適切なアクションが設計されていない場合、ページ離脱の増加やコンバージョン率(CVR)の低下につながる可能性があります。Webサイトは様々なマーケティング施策の中心となるため、適切な情報提供とユーザーの離脱を防ぐ設計が全体のマーケティング施策において大きな影響を持ちます。
Webサイトを制作する場合、制作の目的やユーザーの分析に基づく情報設計をせずに、いきなりデザインや実装を行うと、思った通りの成果が出ずに、リニューアルを繰り返すといったことに繋がります。もちろん、情報設計の際に想定していた仮説通りに成果が出るとは限らず、制作後の細かい改善は必要になりますが、事前に情報設計を行うことで、一定の成果を期待できます。
Webサイトの構成が複雑でユーザーが求めるコンテンツにたどり着けない状況で、広告費を投資しても、穴の空いたバケツに水を注ぐようなものになってしまいます。Webサイトが最適な情報設計に基づいて構築されているかどうか、定期的に確認し、必要に応じて改善を行うことが重要です。
Webサイトの情報設計の流れとポイント
ここでは、情報設計の具体的な流れをご紹介します。ただし、サービスや商品の訴求ポイントやマーケティングの戦略は、情報設計の前段階で明確にしておく必要があります。
ご紹介するすべての工程を行う必要は必ずしもありませんが、デザインや実装後の後戻りを減らすためにも、情報設計の段階で十分にコンテンツやページ構成の検討を行うのがおすすめです。
サイト制作の目的を明確にする
まずは、Webサイトを制作する目的を明確にします。目的にはリード獲得、認知拡大、ブランディングなどがありますが、それぞれの目的に応じて最適な情報設計が異なります。
例えば、リード獲得を目的とするサービスサイトであれば、サービス内容、特徴、料金などユーザーが求める情報にすぐに辿り着けるページ構成やナビゲーション、コンセプトが一目で伝わるキャッチコピー、リード獲得に最適化したCTAの訴求などが求められます。
一方、ブランディングを目的としたサイトであれば、CI(コーポレートアイデンティティ)やVI(ブランドアイデンティティ)を表現するためのクリエイティブやデザイン、コンテンツが必要になります。
サイトをなんとなく制作、リニューアルするのではなく、制作前に目的を明確にしてプロジェクトを進めるのが重要です。
ペルソナを決める
ペルソナは、Webサイトのターゲットユーザー像を具体的に表現したものです。一般的にターゲットは、商品やサービスの顧客となりうる集団のことを指しますが、ペルソナはターゲットの中でも特に具体的な一人の架空のユーザーを意味します。
▼ペルソナの例

情報設計の段階で、ペルソナを明確に設定することで、コンテンツ制作やコピーライティングにおいても、ペルソナに対して適切な設計や訴求が可能になり、一貫したサイト制作に繋がります。また、設計したペルソナを、マーケティング担当者からディレクター、デザイナー、実装担当者の間で共有しておくことで、それぞれの認識に齟齬が生まれにくくなり、目的に沿った成果に繋がるWebサイトを制作できます。
カスタマージャーニーマップを作成する
カスタマージャーニーとは、顧客が商品やサービスを知ってから、購入や契約に至るまでの一連のプロセスのことを指します。商品やサービスによっても異なりますが、ユーザーは商品やサービスを認知してから、すぐに購入や契約をするとは限らず、その間に情報収集や比較検討のフェーズが挟まります。
Webサイトの情報設計においては、ユーザーが求める情報にすぐに辿り着けることが重要です。カスタマージャーニーマップを作成することで、ユーザーの目的に応じた適切なコンテンツやCTAを設計できます。
まずは、商品やサービスの認知から購入までのプロセスを洗い出し、各ステージでユーザーが求める情報やアクションを整理しましょう。
▼カスタマージャーニーマップ例

作成したカスタマージャーニーマップをもとに、各フェーズのユーザーの目的に合わせて、適切なページ・コンテンツの制作やCTAの設計を行いましょう。
CTAとは、Webサイトに訪れたユーザーに対して具体的なアクションを促すための文言、ボタン、リンクなどのことを表します。例えば弊社のサービスサイトでは、「資料請求」や「お問い合わせ」がCTAにあたります。
サイトマップを制作する
サイトマップとは、Webサイトの構造やページ間の関係を表すための図です。ペルソナやカスタマージャーニーを意識して、ページ構成やページ間の繋がりを設計します。Webサイトの階層構造が複雑になれば、ユーザーが求める情報に辿り着くまでに時間がかかったり、見つけるまでに離脱する可能性が高まります。
▼サイトマップの例

サイトマップを作成してサイト全体の構成を可視化することで、分かりずらい動線がないかを確認し、コンバージョンまでの動線を最適化するのに役立ちます。また、制作前にチームでサイトの設計を確認したり議論したりするのにも役立ちます。
コンテンツマップを制作する
コンテンツマップとは、サイトの各ページにどのようなコンテンツを設置するのかを表すための図です。ワイヤーフレームを制作することで、コンテンツの配置を決定する場合もありますが、より全ページのコンテンツを俯瞰して把握したり、各コンテンツの見出しを検討するのに役立ちます。特に継続的なコンテンツ発信を前提としたサイトを制作する際には、コンテンツマップを制作しておくことで、制作後の運用もしやすくなります。

まずは、ペルソナやカスタマージャーニーマップを参考に必要なコンテンツの洗い出しを行います。コンテンツの洗い出しの後は、サイトマップを参考に、各ページに設置するコンテンツの順番を決めていきます。
また、コンテンツマップの制作段階で、サイト全体のメインのキャッチコピーや各コンテンツの見出しを合わせて制作しておくことで、デザイン段階での齟齬が少なくなり、よりコンテンツを活かしたデザイン制作に繋がります。
ワイヤーフレームを制作する
Webサイトの制作前の情報設計における最終的なアウトプットとして一般的に用いられるのがワイヤーフレームです。ワイヤーフレームでは、サイトマップに沿って各ページごとのコンテンツの配置や適切な順番を制作します。また、ユーザーが目的のページに辿り着くためのナビゲーションについても設計します。
▼ワイヤーフレームの例

ワイヤーフレーム段階で、Webサイトのページ構成やレイアウトについて明確化しておくことで、デザイン段階や実装段階での後戻りをなくし、より成果の出るサイト制作に繋がります。
マーケティング戦略に基づく情報設計が重要
一般的な情報設計の流れやポイントについて説明しましたが、情報設計はサイトの活用の目的でもあるマーケティング戦略に基づいて設計することが重要になります。情報設計の前段階にマーケティング戦略があることを忘れてはいけません。
例えば運用型広告のランディングページ(LP)を作成する際でも、ニーズ顕在層向けか潜在層向けかで適切な情報設計は変わってきます。顕在層向けのLPでは、すぐにアクションを促すような設計が求められますが、潜在層向けのLPでは、解決できる課題の訴求やハードルの低いアクションを設計することが重要です。
そのため、Webサイトを制作する前に、全体のマーケティング戦略において制作するサイトはどのような役割を担うのかを明確にすることで、目的に沿ったWebサイトを制作できます。
まとめ
情報設計はWeb制作において非常に重要な要素であり、ユーザーがサイト内で迷わず必要な情報にアクセスできるようにすることが目的です。情報設計を行う際には、サイトの目的やペルソナ、カスタマージャーニーなどを考慮し、マーケティング戦略に基づいて適切な設計を行うことが重要です。情報設計を見直すことで、サイトの離脱率やCVRが改善し、マーケティング全体の成果にも繋がりますので、ぜひ制作前の情報設計にも力を入れてみてください。
簡単1分で資料をダウンロード
ご支援事例集


資料の概要
NOROSHIがこれまでご支援してきた企業様の事例を、支援内容やデザインアウトプットとともにご紹介しています。
この記事を書いた人
株式会社NOROSHI 編集部
株式会社NOROSHIが運営するデザインパートナー事業の編集部です。
NOROSHIとは?
NOROSHIの情報配信を見る






