突然ですが、コーポレートサイトが生まれ変わります②　〜サイトマップ篇〜

FOR YOU Inc.

2022年12月1日 18:27

こんにちは！広告事業部に所属している工藤です🙋‍♀️

前回に引き続き、コーポレートサイトの進捗レポートです🎉
▼初回記事はこちら

本日は「サイトマップ」についてご紹介します。
念のため、制作フローをおさらいすると、以下の通り。
今はステップ2の段階ですね！

＜制作フロー＞
1, ヒアリング
2, サイトマップ
3, ワイヤーフレーム制作
4, デザイン制作
5, 撮影
6, コーディング(実装)
7, デバック
8, 公開！

まだまだ序盤ですが、全体骨子を決めるものなのでめちゃくちゃ大事です🙋‍♀️

サイトマップでは何を決めるの？

まず、サイトマップとは
サイトの階層と情報およびその導線を整理するものです。

個人的には、ビルのような建物を作ってるような感覚と同じで
このフロア(ページ)にはこの部屋(情報)を置いて〜、
この場所からここに移動(ページ遷移)できるようにして〜、
みたいに考えてます。

※逆にわかりにくくなっちゃったかも…😂

具体的にいうと、今のコーポレートサイトはTOPページから
以下8つの下層ページに遷移することができます。
News / About / Service / Works / Talents / Members / Recruit / Contact

「この8つのページと情報量でいいのかどうか」をあらためて議論し、
さらに各ページの下層のページにも目を向けて
全体設計を決めていく作業だと、ご理解くださいっ！

どうやって決めるの？

ここで、前回のヒアリング内容が活用されます。
例えば、こんな設計変更がありましたので一部紹介します💻

各事業(広告/タレント)の棲み分けをもっとわかりやすく。
→広告事業の紹介ページと、タレント事業の紹介ページをそれぞれ作る。

・このnoteも含めた、会社SNSへの導線を設ける。
→TOPから飛べる導線を作る。

・WORKSページの整理。
→広告事業のWORKSページと、タレント事業のWORKSページを作る。

・PURPOSE / MISSION / VALUE の存在感は大事にしたい。
→会社概要のページと、「PURPOSE / MISSION / VALUE」のページは分けた構成にする。

どんなサイトマップにしたの？

ということで、BEFORE & AFTERを並べるとこんな感じです✨
特に赤い部分を新たに設計し直しております。
（こんなに赤裸々に綴っていいのかな…）

事業や実績が拡大傾向にあるため、今よりもページ数が増えていますね👀

反対に削除予定のページは、こちら。

これは情報自体を削除しますということではなく、
わざわざ1ページを用意するほどの情報量にはなっていないため
ユーザー目線も鑑みて、設計変更を行ない
別ページにてまとめて情報発信しようと決めたものです👍

ちなみに、グレー文字はサイトマップとしては
あまり関係ない(記載しない)のですが、以下2点の役割として
私が簡単にメモしたものです📝

note用に削除してもよかったんですが、
せっかくなので(?)そのまま載せちゃいました。

①一緒に議論したメンバーの共通認識として
「このページにはこの情報が載るんだな」というすり合わせのため

②次のワイヤーフレーム制作の段階に際して
各ページに載せる情報整理をしておく必要があるため

サイトマップを決める上で重要なこと！

本日のまとめです。
サイトマップを作る際は、次のことを意識してみましょう。

・伝える情報のあるべき主従関係と、実際の階層設計があってるかどうか
・ユーザーにとって、
　知りたい情報に正しくすぐに辿り着ける設計となっているか
・社内要望（時にクライアント様要望）に添えてるかどうか
・情報や導線の過不足はないかどうか

ちょっと真面目な内容になりましたが、本日はここまで🙇‍♀️