昨日、ウチのWebサイトにJUGEMのblogを導入して、「『とりあえずエントリーを書いておいて、後からCSS(Cascading Style Sheets)に手を加えて体裁を整える』だけの、CMS(Content Management System)でWebサイトを構築する力もなかった」と「始めてみた」で書きましたが、今日は昼頃に起きてから今の今まで自分のWebサイトを組み直していました。作業の中心はCSSのチューンです。
CSSの考えかたとしては、たとえば「<font color=”ff0000″>添付ファイルのあるメールは読まずに削除します</font>」と書くより、
.caution {
font-size:10pt;
color:#ff0000;
}
とCSSに記述して、「<span class=”caution
“>添付ファイルのあるメールは読まずに削除します</span>」とマークアップをするのが望ましいとされます。本文の使用フォントや文字の大きさとか改行間隔、テキストのセンタリングや右寄せと言った文字の配置などはCSSに記述することが勧告されているわけです。そこでCSSの抜本的な書き直しに乗り出しました。
たとえば各ページの大見出しは「<h1>見出し</h1>」などとマークアップするなど、私のCSSのチューンはまだまだ文字周りが中心です。昨日のエントリで「私はCSSレイアウトを行なう実力はない」みたいなことも「始めてみた」で書きました。従って、HTML 4.01+CSS2.xの、テーブルレイアウトのままで一からCSSとソースコードを書き直しました。
CSSで文字周りの設定を書いておき、各HTMLに適切なマークアップさえ行なっておけばHTML文書の体裁は一気に変更できます。これがスタイルシートの利点だと実感。「こりゃ、CSSでのレイアウト修正はあっと言う間だろうな」と思わせるに十分でした。