Hatena::ブログ(Diary)

シナトラ千代子 Twitter

[熊手部しなちょうメルクマール][Bookmark] [Archive] [About]
●●●食べられるはてなダイアリー
twitterbanner  はてなRSSに追加  はてなアンテナに追加 Subscribe with livedoor Reader この日記のはてなブックマーク数
[寄稿しました→]SNSの研究

しりとりへ Opera コウノトリライブカメラ 南極ペンギンカメラはこちら

2006-10-31

[]あなたのブログは「読み手に顔を覚えてもらえる」ブログですか?

「まぁおいらには関係ない話か……」

とか思ってたんですが、デザインについて。

で、

あなたのブログを最適化する7つの方法、もしくは毎日いくつのブログが新しく作られているか知ってる? - YAMDAS現更新履歴

こちらに出ている「7つのブログ最適化法」のうち、

  1. 見た目の調整に時間をかける(人気ブログはどれもユニークでトレードマークとなるデザインを持っている)

について考えてみます。


初めての訪問者を想定する

だれもがアルファブロガーを目指す必要なんてないのですが、「顔を覚えてもらいたい」という欲求はそれほど不自然ではないと思うのです。毎回会うたびに「えーとだれだっけ?」と言われるのはちょっと哀しくないですか。おれは哀しい。

読み手がそのブログにやってくる方法はさまざまですが、常連ではないひとはたいてい検索か、どこかのリンクからやってきます。

そういった「一見(いちげん)さんぽい」ひとの、読むときの流れはたぶんこんな感じ。

f:id:wetfootdog:20061031232510p:image

  1. ブログは単一エントリとして表示されることが多い
  2. 読み手はまずそのエントリのみ、読み終える
    1. 通常はここで読み手離脱(ウィンドウorタブを閉じる)
  3. エントリを読み終えてかなり面白い場合、ほかのエントリを探す
    1. サイドバーなどで最近のエントリ、カテゴリなどのリストを見る
  4. さらにほかのエントリを読む
    1. またここで多くの読者が離脱
  5. 気に入って、RSSリーダーなどに登録、常連となる

ここまでを経て、いつも読んでくれる読み手を獲得できるわけで、通常は1〜2、1〜4あたりをくり返すことで「あ、このひと前にも読んだな」という印象を与えることができ、その先に進むことになります。

つまり

  • 1回目で読み手を惹きつけることができなくても、2回目3回目のときに「そういえばこのブログは……」と思わせる必要がある
  • RSSリーダーなどに登録された場合は、見た目はあまり問題ではなくなるので、逆にデザインは「常連ではないひと」を対象にする
    • つまり、「どういったものどういうふうに書いているブログなのか」が簡単にわかるようにする
    • それらがわかるようなものをできるだけ一個所に集める
      • そういう意味ではサイドバーは片側だけのほうがいい
    • わかりやすさを妨げるような要素をできるだけ排除する
      • できるだけシンプルに、余分なものは目立たない場所へ

たとえば見た目こんな感じとか。

f:id:wetfootdog:20061031232508p:image

やはりトップのバナーやブログタイトルは「顔を覚えてもらう」ためにもそれなりに重要でしょう。

また上記画像にあるように「むだくろ」とか略称をつけておけば覚えられやすいはずです*1


あと、わりとコンパクトな短文であればサイドバー込みであんまスクロールせずに一画面にカチっと収まるようなデザインがいいだろうし、長文なひとはあんまサイドバー読まれない気がするから、トップとボトムにいろいろ置くほうがいいかもしれないし。


ここ「シナトラ千代子」について

自分とこの話ならできるかな、みたいな感じで具体的に羅列。あくまで自分の考えで整えた、ということで、あんまり「デザイン」ではないのですが。また全体のデザインはそれぞれのコンテンツの傾向で決めるほうがいいと思うので、具体的とかいっても、なんかあんま参考にはならないかもしれません。

  • 基本はうなぎの寝床方式(縦に長い)
  • 過去20日のエントリを一覧で表示
  • ブックマークから、過去の人気エントリを表示(Top15まで)
    • 現在のエントリ→過去のエントリ、というタテの流れで誘導
  • トラバとかコメントは個々のエントリに従属するコンテンツなので、サイドバーに表示しない*2
    • サイドバーのコンテンツはメインコンテンツと文脈の統一が図れないので、混乱を招きやすいから
    • サイドバーがひとによって違いすぎる
    • などなどの理由によりサイドバーを廃止(うまい実装案が見つかるまで永久停止)
  • トップのバナー画像は基本的にずっと同じ

ダメなところと言い訳

  • カテゴリが適当すぎ
    • 最近、2種類ぐらいしか使ってない
  • サイドバーにカテゴリがないので、やや不便
    • でもカテゴリそのものが適当なので……
  • なんかバナーの下にボタンがごちゃごちゃある
    • まぁあれは半分以上自分のためなんで……
  • あまりidで呼ばれない(タイトルで呼ばれる)ので、タイトルは今さらいじりようがない

まとめ

上記の内容はあくまで「はじめて来たひとに覚えてもらう」というポイントに絞って書いているわけですが、忘れてはならないのは「おそらく自分のブログに一番足を運ぶのは自分」ということです*3。また「最近のコメント」などが常連のひとにとって重要な場合もあります。

つまり自分の使い勝手もやはりちゃんと考えるべきで、そこらへんの条件との駆け引きがデザインのポイントになるのでしょう。


おまけ

画像て言われても……というかたはこちらとか。

厳選10本!ブログで使えるスグレモノツールまとめ :: Love & Design ::

わたしはよくここ↓から画像もらってきます。著作権フリー画像アーカイブ。

Morguefile free photographs for commercial use

画像はそんなに大きなものは必要ないですし、タイトルと組み合わせればかなり印象も違います(タイトルが覚えやすいものなら画像は必要ないですし)。


「でもフォトショップとか使わずにどういうふうにバナーをデザインすればいいの?」とか思ったかたは、大熊さん(id:die_kuma)のところに行けば教えてくれるにちがいありません(有料)。


*1:あとあとになって「むだグロ」「無駄に黒いひと」とか呼ばれるようになったりするかもしれませんが。

*2:そもそもサイドバーがない。

*3:携帯から書いてればべつですが。


人気記事

1. 昨日はじめたばかりのダイアリー初心者が最初に覚えたい「5つのはてな記法」 - シナトラ千代子
2. 「非はてな村人」のための、はてなダイアリーガイド - シナトラ千代子
3. イラストで見る「はてなブックマークのトップページは迷宮」 - シナトラ千代子
4. シナトラ千代子 - 「はてなスター不要というユーザーよ、はてなを去れ」とjkondoは言った
5. シナトラ千代子 - はてなプロフィールアイコン大図鑑
6. シナトラ千代子 - はてなの歴史
7. シナトラ千代子 - 「紳士が歩くべきは車道側でも歩道側でもない」という簡単なことがなぜわからないのか
8. シナトラ千代子 - 「はてなは二階建てにすべき」とはなにか
9. シナトラ千代子 - ブログ界隈において、はてなダイアラーが最もダイハードなのはなぜなのか
10. 図解「世界のはてなブックマーカー」 - シナトラ千代子
11. シナトラ千代子 - ブックマーカーはどこから来て、どこへ向かうのだろう
12. 議論が満杯のはてなの村、村長が「議論禁止」を通達 - シナトラ千代子
13. シナトラ千代子 - 「そろそろmixiの先へ……」というひとのためのVoxレビュー
14. シナトラ千代子 - 「ブログの寿命が尽きそうだ……」と思ったら
15. シナトラ千代子 - ブロガーはすでに滅びの道を歩んでいる
16. はてな創世記 - シナトラ千代子
17. 優雅で奇妙なはてなブックマーカーの一日 - シナトラ千代子
18. シナトラ千代子
19. シナトラ千代子 - ネットはサファリなので、棲み分けが生じる。
20. シナトラ千代子 - あなたは砲撃型ブロガーか狙撃型ブロガーか
21. ブログのプロフィールをまだ書き足りないひとへ - シナトラ千代子
22. シナトラ千代子 - 「わかりやすくまとめる」ブロガーがブログ界隈をテレビ番組化していく
23. シナトラ千代子 - 「みんなになりたい」大手小町の仕組みはネットになにをもたらすのだろう
24. シナトラ千代子 - はてなid読み方辞典(付録呼び方一覧)
25. 学生は「一般人」ではないし、ブログが相手にする必要もないんじゃないか - シナトラ千代子
26. 日本のはてブをキモくしている真犯人は - シナトラ千代子
27. シナトラ千代子 - ネットの時間を削れないひとは、情報収集の効率化なんて考えるべきではない。
28. シナトラ千代子 - ブロガーは一度ブロガーになったら、ブロガーでありつづける
29. シナトラ千代子 - 絵で見る「はてなユーザーをとりまく世界」
30. シナトラ千代子 - 絵で見る「はてなブックマーカーの働き」

0000-00-
2004-03-04-05-06-07-08-09-10-11-12-
2005-01-02-03-04-05-06-07-08-09-10-11-12-
2006-01-02-03-04-05-06-07-08-09-10-11-12-
2007-01-02-03-04-05-06-07-08-09-10-11-
2008-01-02-03-04-05-06-
2011-09-
2013-08-11-


(C)wetfootdog