Blogのデザインについて考える

　 多すぎるルートは時に混乱の元に

　自分が最初にblog系サイトを見たときに感じたことは「使いにくいナビゲーションだな」ということ。新着順別表示、カテゴリー別表示、投稿日別表示と、同一の情報に対してアクセスする方法が沢山ある。これは、一つの目的地に対して様々な道が用意されているのと同じで、サイト構造が頭に入っている人にはとても便利なのだが、反面、そうでない人にとっては混乱の大きな要因になってしまう。

　たとえば、A駅からB駅に行くとしよう。その時、「C駅経由ルート」、「D駅経由ルート」、「E駅経由ルート」と3つのルートを提示されても、C駅、D駅、E駅がどの辺にあるのか分からなければ、どのルートが自分に最適なのかさっぱり分からない。それと似たように、BlogやWeb全体の構造を把握していない人にとって、あまりにも多すぎるルート提供は混乱の元になるのである。

　そこで、今回はgooのblogサービスを例にとって、実際にどうカスタマイズしたか見ていこう。

　 迷子はまずスタート地点に戻してあげる

　まず最初に手を入れたのがトップに戻るリンク（1）。迷子になった人を迷子から救出するには、なによりもスタート地点に戻してあげることだ。大抵のBlogではBlogのタイトル文字がトップに戻るリンクになっているのだが、アンダーラインがなかったり、通常色のままであったりするため、明確に「最初に戻るリンク」であることが分かりづらい。迷子の人があれこれリンクをクリックし、さらに迷走してしまうことを避けるためにも、まずはトップに戻るリンクはわかりやすくしよう。

　次に、数多くある記事表示用リンクを整理する。記事表示用リンクには大きく分けて二種類あり、「記事を整理して表示する」リンクと、「コメントやトラックバック、投稿された記事など、インタラクティブに動いていく記事への」リンクの二つだ。

　Webレイアウトは左側がベースになるので、まず左側に基本となる「記事を整理して表示する」リンク（2）を置く。そして、右側に「インタラクティブに動く記事を目立たせる」リンク（3）を置く。この二つを明確に区別してナビゲーションを提示するだけで、ナビゲーションがかなりわかりやすくなってくる。

　あとはBlogの記事の書き方や性質によって異なってくるが、自分の投稿スタイルにもっとも適しているリンクを上の方に、そうではないリンクを下の方に位置させるのが一番スタンダードである。私の場合、気の赴くままに様々なカテゴリーに属する記事を整理することなくガンガン書いていくスタイルなので、カテゴリー分類のリンクを一番左上に置いた。データーベースとして活用できるblogなら検索フォームを上に、日記のように使っているblogならカレンダー表示を上に、置くようにすればいいだろう。

　なお、自分のBlogはどのように読めばいいのか、どの表示スタイルを使って読むと読みやすいのかという説明文へのリンクを、どこかトップの目立つ部分に用意すると読み手に優しいBlogになる（4）。

　 視覚的に捉えられるリンクの数を絞る

　まず、タイトルの文字を少し小さくして全体とのバランスを取った。また、タイトルの文字をクリックして記事全文が表示できることを明確にするために、タイトル文字にアンダーラインを付け色もリンク色に戻した。一応、要約文の最後に「続きを読む」という全文表示へのリンクがあるが、記事のタイトルの方が直感的に記事全文へのリンクとして認識しやすいので、それを利用したデザインにするわけだ。そして、タイトルの文字サイズを下げてタイトルが目立たなくなった分、アイコンを作ってタイトル文字の頭に付けた。これで「見出しらしさ」が演出されるようになる。

　カテゴリー表示と投稿日時表示はクリックすることで、それぞれカテゴリー別表示、投稿日時別表示にできるのだが、初心者には迷子の元。そこで、まずはアンダーラインを外して、わざとリンクがあることをわかりにくした。しかし、それだと逆にごちゃごちゃしてしまうので、括弧で両者をくくり、まとまりをつける。これにより、なんとなく整理された表示形式となった。

　コメント数とトラックバック数はインタラクティブに動く内容だけに、目立たせるため太字にした。これにより、ぱっと見た目、そこにリンクがあることがより明確になるだけでなく、どの記事が読者に反応がある記事なのかもわかりやすくなる。

[ 戻る ]