【第5回】webサイトの骨組みをつくろう

いままでの連載でどういう人にどういうことをして欲しいのか、ということを考えていきました。

大変お待たせしました！ようやくここから実際にwebサイトを作る準備をしていきますよー。

前回の【第4回】webサイトになにを載せる？では、どんな内容を載せるかを考えていきました。

載せたいものをそれぞれwebページにしていって、そこからwebサイトにしていくには、先ほど考えた載せたい内容を整理することが重要です。その整理した情報をwebページに載せていきます。

では、ここから骨組みを作る方法について紹介します。

まずは道具を準備

載せたい内容を整理するには、まず実際にwebページに具体的に「これを載せたい！」ものを一気に書き出していきます。

書き出す場所は、紙でもパソコンでもスマートフォンでもなく「付箋」です。そう、あの「付箋」です。なぜ付箋でかって？それはこのあと分かります（ふふふ）。

用意するのも

• 付箋
• ペン
• 模造紙/ホワイトボード/スケッチブックなど広い面

掲載したいことを書き出していこう！

付箋とペンが準備できたら、webページに掲載する（したい）ことを書き出します。とにかく書いて書いて思いつくまま書き出しまくります。ポイントは付箋1枚に1ワードです。

「これを言ったらマイナスイメージになるんじゃないかしら？」「こんなのはいらないかな？」とかそんな遠慮はいりません。とにかく思いつくまま付箋にガンガンに出していきましょう。

大事なことなのでもう一度言います。「ポイントは付箋1枚に1ワードです。」

グループ分けをしよう！

思いつくまま書き出したら、これらをグループ分けしていきます。グループ分けには2ステップあります。

• 1つ目は、固定の情報か動く情報かのグループ分け
• 2つ目は、固定情報の中での情報のグループ分け

です。ではひとつひとつ見ていきましょう。

STEP1：固定の情報か動く情報かのグループ分け

書き出した情報をみてみると、固定の情報（住所や定休日など）と、日々変化する情報（日替わりランチの紹介やキャンペーン情報など）の違いがでてくることがあります。

基本webサイトはwebページ（固定の情報）でまとめていきますが、日々変化する情報はブログやSNSを利用したほうが良いときもあります。

まずは、webページで掲載する情報か、ブログやSNSで掲載する情報なのかのグループに分けます。付箋だから移動が簡単！

皆さんのビジネスや商売、また伝えない内容によって、固定の情報だけでブログやSNSが必要ない場合ももちろんあります。

STEP2：固定情報のグループ分け

次に、固定情報のグループ分けです。同じような内容の付箋をひとまとめにしていきます。たとえば住所や電話番号、営業時間などは同じグループになりそうです。

うれしいのでもう一度言わせてください。付箋だから移動が簡単ですね！

グループ例

• お店や会社などに関する情報
• 商品に関する情報
• 取り扱いに関する情報
• どれにも当てはまらない情報

このときに、どこのグループにも入らないものや優先度の低いものがでてきたら、強引にどこかのグループに入れるのではなく「いらないものグループ」として端に寄せておきます。

ここでもう一度、ホームページを見に来た人が求めているものがあるのか、ヌケがないかを確認します。そして情報が重複していないかももちろん確認します。

グループは5つぐらいにまとめる

さて、グループはいくつできましたか？ここから最終調整です。グループの数が5つ以上になってしまった場合は、伝えたいことを詰め込みすぎているかもしれません。

5つ以上になってしまった場合は、グループに優先順位をつけてみてください。6つ目以降のグループは

• ほんとうに今回のwebサイトに必要なのか
• 他のグループと同じような内容じゃないか

などをもう一度検討してみてください。

あってもなくてもいいグループは思い切って「いらないものグループ」にしてください。ここでの「捨てる勇気」が、いいwebサイトをつくる近道です。

重要なのは「今回のwebサイトの目的」です（【第3回】webサイトを使って誰がなにをする？を参照）。

これでwebサイトの骨組みが完成しました！

そしてこの骨組みを元にwebページの設計図（サイトマップ）を作って、実際にwebページ・webサイトを作っていきます。

いかがでしたか？

やりたいことや伝えたいことを具体化することで、webサイトの全貌が見えてきたのではないでしょうか。

さぁ！ステキなwebサイトのスタートです！