サイトの構造を考える


サイトのテーマが決まってきたら次に考えておかないといけないのが、サイトの構造になります。

テーマを考えたり、構造を考えたり(この次のワイヤーフレームもか)と手間のかかる割にはあまり楽しくない作業が続いてしまいますが、このステップをしっかりとクリアしていくことで後々のサイト運営が楽になってくるので重要な要素になります。

サイトの構造とは?

サイトの構造とはサイト全体の仕組みであり、各階層、各ページの機能的な関連性を示すものです。

Webサイトはトップページから始まって、カテゴリーページ、各記事のページ、(WordPressの場合は)個別ページなどいくつもの階層がありますので、それらを整理しながら構造を理解しておくことが重要です。

サイトの構造は単に整理するだけではなく、Webサイトをデザインする場合や、サイトに必要な情報収集を行なう際にも必要になってくる大事なもので、いわばWebサイトの設計図といえます。

WordPressを使ってサイトを構築すればサイトの構造をあまり意識しないまま、サイトを作ることができます(これがCMを使うメリットの1つです)が、システムに任せるのではなく自分の意思をもって「どのような構造が見やすいか」を考えておくと後々修正等も楽になります。

また、「サイト全体の構造」を見ることは当然ですが、お店紹介のサイトのように記事ページにも決まった情報を入れる場合は「各記事のページ」も最初に構造を考えておくことが大切です。ネットでの情報収集ならいいですが、実店舗へ行く場合は追加で情報収集するのは大変ですからね。

サイト構造(サイト全体)

サイト構造の作り方とうか考え方を、参考としている「東池袋カレーマップ」で作成したサイト構造のモデルを掲載してみます。

cacooというASPツールを使っていますが、手書きでも十分だと思います。

凄くシンプルですが、トップページから各記事ページ及び、カテゴリー、個別ページへの遷移をざっくりとまとめたものになります。

カレーマップの場合は、エリアが狭いためエリアの絞り込みをする必要がなく、トップページからダイレクトに各記事のページに遷移できるようになっているため、構造はシンプルになっているのがよくわかると思います。

<参考>
右に「カテゴリー」があるのは、同じカレーでも実際の提供元は「カレー専門店」「牛丼店」「蕎麦屋」「ファミレス」などいくつもの細かい業態にわかれているため、それをカバーするために作っています。

全国規模のサイトを作った場合は、都道府県別の階層(場合によっては市区町村でも)が必須になってくるため、サイトの構造としては複雑になってきます。そうなると階層にカテゴリーを使うようになるため、業態での分類には別の方法が必要になってきます。

サイト構造(各記事ページ)

上記の構造はサイト全体でしたが、次に確認しておくのは各記事ページの構造です。

各記事ページでは「お店情報」が必須になてきますから、この時点で必要な情報を整理します。

例えば、東池袋カレーマップであれば基本情報として以下の10個を必須としました。

・店舗名orチェーン店名(ゴーゴーカレーなど)
・支店名or店舗名(池袋サンシャイン中央通りスタジアム店など)
・郵便番号
・住所
・電話番号
・営業時間
・席数
・メニュー
・写真
・感想

この他、web場ではGoogleMapsで地図を表示ていますが、この内容は住所があれば表示させることができるため、必須項目には入っていません。

店舗名、チェーン店名、支店名に関しては、各企業で微妙に表現が違うことがあるので、包括的に書いています。

この他に「駅からの経路・時間」「駐車場の有無」「駐車場の料金」「禁煙・喫煙」「平均単価」など業種業態によって必要なものは違ってくると思います。東池袋カレーマップの場合は、東池袋で働いている人がターゲットにしているため、細かい設定は省いています。

サイト構造を考えるのはとても大切ですが、作っていくうちに変更修正は必ず入ってくるので、ここで完璧に決めようとはしないで、基本となる方向性を作っていくくらいのつもりでいたほうがいいと思います(構築で悩んで先に進まないことも多いですから)。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>