htmlにおける見出しは非常に重要な要素です。この構造化という言葉の意味が理解できるといろいろ見えてきます。構造化のできているページとそうでないページは明らかに読みやすさが違います。これは別に何もウェブページだけの問題ではありません。ところが残念なことにこの意味を解らない人がものすごく多いのが事実です。htmlの解説書にもh1,h2,h3というのは文字のサイズの違いを意味しているなんてことを平気で書いている本があります。そういう本を読んで同じような間違いをしているページがもの凄く多いのも事実です。h2から始まっていたりh1から始まっていてもh2を飛び越してh3にいきなり飛ぶようなページが後を絶ちません。テキストブラウザでは文字のサイズは変わりませんがインテンドを変化させることで見出しのレベルを表現しています。そうは言ってもウェブページを作っていて文字サイズを変化させたくなるときがあります。そういう時のためにこのページを作りました。ただこのページにはh1が何回も出てきます。これは検索エンジンのロボットから見たらスパム行為と判断されかねますので「ロボットお断り」のmetaタグを入れておくことにします。
pxというのは同じコンピュータでも解像度を変化させることでそのサイズが異なってきますので相対指定とされていますが文字の大きさをpxで指定するとユーザの側からは基本的に変えることができませんので極めて創り手の手前勝手な指定になります。ウェブページというものは基本的に読むものですので読めないページほど無用なものはありません。それに対してemというのはブラウザが本来持っているサイズの何倍という形で指定しますので相対的な指定になります。下にpxで示しているのはあくまで標準の表示サイズ（I.Eの場合は中）で表示した際の大きさを示しています。font-sizeは見出しの親要素であるbodyのデフォルトのサイズ(16px)に対する倍数で指定します。
| h1 | h2 | h3 | h4 | |
|---|---|---|---|---|
| デフォルトサイズ | 見出し12em(32px) | 見出し21.5em(24px) | 見出し31.125em(18px) | 見出し41em(16px) |
| デフォルトサイズの80% | 見出し11.6em(25.6px) | 見出し21.2em(19.2px) | 見出し30.9em(14.4px) | 見出し40.8em(12.8px) |
| デフォルトサイズの120% | 見出し12.4em(38.4px) | 見出し21.8em(28.8px) | 見出し31.35em(21.6px) | 見出し41.2em(19.2px) |
| デフォルトサイズの150% | 見出し13em(48px) | 見出し22.25em(36px) | 見出し31.6875em(27px) | 見出し41.5em(24px) |