はじめに
Elements of Designというサイトには、Webdesignにおける様々なパーツ(例えばblockquoteのパーツや検索ボックスのパーツなど)毎のデザインを収集して掲載されているのですが本文中のheading要素(hn要素:見出し)については収集されていませんでした(記事タイトル:typography for headingsについてはあるんですけどね。→link)。
なら自分で集めてみるか、と一念発起して海外のWeblogを見てまわり、エントリーの文中におけるhn要素のスタイルを収集してみました。以下21通りのデザインをご覧ください。
21通りのスタイル
1、erraticwisdom
http://erraticwisdom.com/

2、jkg3.com
http://www.jkg3.com/

3、kulturbanause blog
http://www.kulturbanause.de/

4、Veerle's blog 2.0
http://veerle.duoh.com/

5、EmanuelBlagonic.com
http://www.emanuelblagonic.com/

6、NorthxEast
http://northxeast.com/

7、Larissa Meek
http://www.larissameek.com/

8、≫ Binary Moon ≫ The home of Ben Gillbanks
http://www.binarymoon.co.uk/

9、Jobs and Resources - FreelanceSwitch
http://freelanceswitch.com/

10、I love Typography (iLT)
http://ilovetypography.com/

11、Laura Alter ≫ Blog
http://lauraalter.com/blog

12、Web Development Blog | Ruby on Rails Web Development | Viget Extend
http://www.viget.com/extend/

13、Design Reviver - Web Design Blog
http://designreviver.com/

14、distortion, the blog archive ? avalonstar:distortion
http://avalonstar.com/blog/

15、Kristin Ascoop
http://www.kristinascoop.be/blog

16、Nimbupani Designs
http://nimbupani.com/blog/

17、Cynosura | Ray Glover's Weblog
http://weblog.cynosura.eu/


18、retinart
http://retinart.net/

19、Marchand de Trucs, magasin de magie -- Le Blog
http://www.marchanddetrucs.com/blog/

20、Blog -- 45royale Inc.
http://www.45royale.com/blog/

21、Rockatee Blog
http://www.rockatee.com/blog/

おわりに
フォントサイズ、フォントカラー、フォントファミリーを変えるのが一般的な本文中のhn要素のスタイルのようですね。フォントのウェイトを太字にするのはもう必須のようです。他には背景色を設定する、背景画像を設定するなどでしょうか。国内のblogでよく見られるボーダーを設定する(border-leftやborder-bottom)スタイルは今回見てまわった範囲内ではあまり見られませんでした。個性的なものには中央寄せなどもみられます。文字の間隔(letter-spacing)を調節しているサイトもありました。記事タイトルと違って本文中の見出しはあまり出張ってもいけないのが難しいのかもしれませんね。

Leave Your Words