マトリョーシカ的日常

ワクワクばらまく明日のブログ。

洗練されたデザインのブログに必要なのは見出しアイコン!

Day 65: The Alphabet
Day 65: The Alphabet / thezartorialist.com

カッコイイブログ=読まれやすいブログ

 みなさんはブログを書いていますか?どんなことを書いていますか?グルメリポート、ライフハック、旅行…。どんなに内容が優れていても、読んでくれる人がいないと意味がありません。チラシの裏の落書きそのものです。「毎日書いてるんだけどいまいち読者が増えないなぁ」と思ってるあなた、デザインをちょっとだけカッコ良くしてみましょう。

はてなダイアリーの見出しをいじってみる

 というわけで、cssをいじくって見出しアイコンを追加してみましょう。はてなダイアリーを例にあげて説明します。

 まず、管理ページ>デザイン>詳細タブ の順にクリックして下の「スタイルシート」のフォームに以下の文を書きます。

.body h4 {
  background-image: url("画像のurl"); /* 画像の指定 */
  background-repeat: no-repeat; /* 画像の並び */
  padding-left: 40px; /* 余白 */
 
}

 これだけ。はてなダイアリーの見出し(h4)の背景画像を指定しています。それだけだと画像が連続して表示されてしまうので、no-repeatと設定します。あとはアイコンが表示される部分に余白を挿入します。これで文字と画像がかぶらなくなります。

 僕も今日から見出し画像を入れてみました。これで有名ブログに一歩前進ですね!わーい。

 アイコンはこちらのサイトからお借りしました。シンプルな大きめのアイコンってなかなか見つかりませんよね。

 les-couleurs.net

見出しアイコンの重要性

スタートが良ければ、
半分は成功したようなものだ。

(ギリシャのことわざ)

 何事も始めが大事です。始めの見出しでどこまで読者を引きつけることができるか。それには見出しの言葉うんぬんもそうですが、目に止まりやすい工夫をすることが重要です。そこで、アイコンです。かっこいいデザインのアイコンを使えばそれだけでブログの中身もグレードアップしたように見えますよ。

 中身よりも外見!

おわりに

 3連休ですけど、なんかちょくちょく用事があります。このぐらいがちょうどいいんでしょうね。


 合わせて読みたい:
 はてなダイアリーのタイトル背景と文字色を変更する方法 - マトリョーシカ的日常

 はてなブログテーマ「Mistilteinn」を魔改造してみた。 - マトリョーシカ的日常

広告を非表示にする