サイトストラクチャとは？
おはようございます🤗
日に日に寒さが増し、起きるのが辛くなっていきますね😥
今朝は5:10に起床して5:30から散歩を済ませ無事に朝会も参加できたので良かったです。
夏はパッと目が覚めていましたが、冬は目が覚めても布団からなかなか出れずグダグダしていたらそのうち二度寝しているんですよね😅
ちょっと明日から朝起きる1時間前にエアコンのタイマーをかけておこうと思います。
そしたら起きれるようになるか、ちょっと試してみますー。
私の起きれない問題はさておき、さっそくいってみましょう！！
ーーー
●サイト構成のデザイン
デザイン思考、UX設計、ビジネスモデル、など、サイト構成に必要なことを一通り学んだところで、次にユーザーの目的にそった使いやすさとわかりやすさに着目したWebサイトの構造について考えてみましょう。
Webサイト全体の構造のことを「サイトストラクチャ」といいます。
サイトストラクチャは使いやすさや、わかりやすさの観点においてとても重要です。
サイトストラクチャを考える際には、作るサイトの目的に合わせた設計が必要なのは言うまでもありません。
多くのサイトはページとページがリンクやナビゲーションによって結び付けられて、構造化されています。
しかし多くのサイトはユーザーにとって、目的の情報にたどり着くのにわかりにくい造りとなっています。
わかりやすい構造にしておくことで、SEOにも強くなります。
そのためにも、ページやコンテンツをどのように結びつけると、ユーザーが目的の情報までたどり着けるかを心がけて、サイト全体を設計する必要があります。
●サイトストラクチャを設計する
いきなりサイトストラクチャを考えようとしても、うまく情報を整理できません。
そこでWebサイトの目的に応じた、必要なコンテンツやページをペルソナ・ストーリーボードなどから抽出して、ユーザーが目的の情報にたどり着くまでの導線を整理することからはじめましょう。
1.メインとなるユーザー動線を明確にする
サイトストラクチャを設計するときは、ユーザーが目的の情報まで迷うことなくたどり着けるように動線をイメージします。
ユーザー視点で捉えると、設計する側が重要だと思うコンテンツもあまり重要でない場合があります。
ユーザーの視点で考え、どの情報の優先度を視覚的にわかりやすくするかを考えながら導線を整理します。
Webサイトの目的に最短で到達するために、クリック数や遷移を最小限にし導線を作ります。
常にユーザーが必要な情報を見つけやすいようにサイトストラクチャの設計を心がけます。
サイトの階層や遷移が多いほど、ユーザーに必要のない情報を見たり、選択したりしてしまいます。
言い換えれば、目的に到達するのが困難になればなるほど、離脱率も上がります。
そのためにはまずメインの導線とそれ以外の導線を分けて整理し明確にすることが重要となります。
2.サイトストラクチャのパターンを見つける
サイトストラクチャはいくつかのパターンに分類され、それらの組み合わせにより成り立っています。
・階層型分類構造
・ファセット型構造
・直線型構造
・Web型構造
の3つが主ですが、そのほかに
・ハブ＆スポーク型構造
・ハイブリッド型構造
・ファセット型構造
という構造もあります。
上から順にどんなパターンなのか説明していきます。
・階層型構造
コーポレートサイトやメディアサイトで多く見られるパターン。
「どこに、何があるか」が非常に明確。
・ファセット型構造
旅行案内サイトのツアーや、ECサイトの商品を探すページに多く見られる
パターン。
価格・目的別・地域など様々な条件で情報がリンクされ、ユーザーが効率
よく情報を探すことができる。
・直線型構造
予約・会員登録・購入などの導線で見られるパターン。
ユーザーが迷わず情報にたどり着ける。
・Web型構造
多くのコンテンツ同士がリンクされ、構造が網状になっているパターン。
ユーザーが自由に行き来できる自由な導線を持っている。
・ハブスポーク型構造
メインページから放射線状に広がる構造をもっている。
直線型構造の進化版として分類され、ソーシャルネットワークサイトなど
に見られる。
・ハイブリッド型構造
ハイブリット型は名前の通り、階層型・直線型・Web型のいい部分を取り
入れた構造。
・ファセット型構造
階層型の進化版として分類され、目的を持ったECサイトなどに活用。
類似するサービスのサイトストラクチャのパターンを分析してみると、自身で設計するサイトストラクチャの参考になります。
3.スマートフォンのデザインをベースに設計する
スマートフォンはPCに比べてデバイス領域が狭いため、一度に表示する情報量に限りがあります。
そのため、PCをベースにサイトを構築すると、1つのページにコンテンツを盛り込みすぎてしまい、スマートフォンで見た際に情報が収まりきっていない場合や、レイアウト崩れを起こす場合があります。
そのためサイトストラクチャやUI設計では、スマートフォンから検討した方がデバイス領域に配慮して進めることができます。
スマートフォンの市場拡大により、PCよりスマートフォンで閲覧する利用者が増加しているため、スマートフォンベースに設計することや、デバイス対応を配慮した上での設計が必要となってきます。
ーーー
今日も最後まで読んでいただきありがとうございました。
みなさんにとって、ステキな1日でありますように✨
それでは、いってらっしゃい！！