2013年2月14日木曜日

アメブロは初期設定で使うな!ブログは見出し、文字サイズ、フォントが大事

仕事柄、いろいろなwebサービス、特にソーシャル系のサービスを試している。
ブログサービスも使い勝手の良さを比較する目的もあり、無料のブログサービスはほとんどアカウントを保有している。もちろん、すべて稼働させているわけではない。

アメブロは複数のアカウントを保有している。そのうちの1つは、準レギュラーとして定期的に更新している。最近、タイトルを変更した「電子辞書マニア」というブログだ。

【参考】ブログ「電子辞書マニア<新製品情報とおすすめ>」http://ameblo.jp/kurabete/ )

立ち上げてから、もう何年もたっているブログだが、今日はじめて「読んでもらうブログ」としての設定をした。この機会に、アメブロのこと、ボクが考えるブログのこと、などを書いておこうと思う。


 アメブロは初期設定で使うな!(「Androidは初期設定で使うな」風w)

「アメブロって読みにくい…」自分で自分のブログを見ながら、ずっとずっと、思っていた。
アメブロでブログを書いている知人も多いが(営業系の人が多いかな。)、アメブロのテンプレートを使っている場合だと、同じく読みにくさを感じることしばしば。
ボクの中では、読みにくいブログサービスは、楽天、アメブロで1位2位ダントツだ。(楽天がダントツで、1位と2位の間の差もけっこうあるが。)

今回、アメブロの「電子辞書マニア」ブログを読みやすくしよう!と思い立った。

まず、自分のブログを見ていて、読みにくい原因を考えた。すぐに以下の問題点が思いついた。
【1】デフォルトの文字サイズがとにかく小さい。特に、ブログの主役である記事本文の文字サイズが小さい
【2】広告が多い。特に記事下のGoogleリスティング広告が気になる
【3】ブログの左右幅や各オブジェクトのマージン等がどこも狭い

結論から言うと、【1】しか変更できなかった。【2】は月980円を支払えば広告を外すことができる。【3】は頑張ればできるが細かく調整するには時間がかかる。

というわけで、記事本文をはじめ全体的に文字サイズを1まわり大きくした。たったそれだけのことで非常に読みやすくなった。


 読みやすいブログの必要性

ブログ「電子辞書マニア」もそうだが、最近、ブログの読みやすさについて考える。考えるようになった。
逆に言うと、これまでは、ブログの読みやすさについて、ほとんど考えなかった。
というのも、正直なところ、ボクはこれまで、人間相手にブログを書いていなかったからだ。

このブログの以前の記事( ブログ、書き始めて半年の記録。記事タイプ「報告型」「SEO対策型」「問題解決型」 )でブログを3タイプに分類した。「報告型」「SEO対策型」「問題解決型」だ。

これまで、ボクのブログは、ほとんど人間相手ではなくGoogleさん相手に書いていた。3類型のうち「SEO対策型」の記事・ブログを書いていた。ターゲットは、人間ではなくGoogleなので、誤字脱字やデザインはどうでもいい。文法的におかしくても事実無根のことでも関係ない。大切なのは、必要なキーワードが含まれること、文字量が多いこと、だった。

最近、ブログの読みやすさについて考えるのは、そのほうがメリットがあるからだ。というか、Googleだけに向けられたブログは効力を失いつつある(そう感じる)。このことは別の機会にきちんと記事にするが、Googleは「読みやすく人間にとって心地の良い情報」に重きを置くようになっている(そういう気がする)。


 ブログは見出し、文字サイズ、フォントが大事

このブログをはじめ、ブログを真面目に書くようになり、読みやすいブログとするためには以下の要素が大切だと気がついた。

・見出し(小見出し)
・文字サイズ
・フォント

記事を読みやすくするには、見出しが必要。見出しには、共通のアテンション(このブログだと「」がそれにあたる)を付けたほうが効果的だ。

文字サイズやフォントも大事。記事本文をはじめ、きちんと読ませるには文字は13~14ピクセル以上あったほうがいい。フォントも読みやすいものを設定すべきだ。


 アメブロの文字サイズ設定方法

ブログの管理画面から以下のようにたどって「CSSの編集」からおこなう。(CSSが分からない方は多少でも分かる人にお願いしてください。)

ブログ管理>ブログデザイン>デザインの設定>CSSの編集

「/* ---------- common : 全体に対するスタイル --- */」こんな見出しのある直後のブロックに、「font-size:12px;」こんな記述がいくつもあるはずだ。
「font-size:12px;」は、「フォントサイズを12pxに設定」の意だ。この12を13にすれば、(どこの箇所か分からないが)どこかの箇所の文字設定が1ピクセル大きくなる。何も知らない人でも、文字を大きくするだけであれば、これだけの情報でも案外できるものだ。

CSSに関して、さらに詳しい知識があれば、もっともっとページデザインをカスタマイズできる。興味のある方は勉強してみてもいいだろう。