スタイルシートスタイルブックによると，HTMLでデザインをしてはいけない，それはスタイルシートのお仕事なんだそうです。スタイルシート超初心者の私は，サイトのデザイン変更を主にテンプレート修正で対処してきました。【1/23追記】 

そこでこれからは，テンプレートを可能な限りシンプルなものにシェイプアップして，サイトのデザインは極力スタイルシートで指定するようにしようと思います。

第一弾はバナー回り。
バナーにはJ's Garageのロゴ画像を貼り付けているのですが，これまではテンプレートの中でテーブルの背景画像として貼り付けておりました。
これをスタイルシートで指定する方法は，comcomさんの次の２つのエントリーを参考にさせていただきました。どうもありがとうございます。

iBlog バナーに画像を使う方法
iBlog覚え書き その３

おかげで，バナー回りのテンプレートが思い切りシンプルになりました。
＜div id="banner"＞
＆nbsp;
＜/div＞
＆nbsp;のところには，本当はblog名が入るのですが，私の好みで画像の中に入れてあります。
さーて，うまくいきますかどうか。

【追記】
うまくいきませんでした。
なぜかstyles-site.cssが更新されず，プレビューの内容と公開された内容が違っていました。
しかし，これは何度かリセット公開をやり直しているうちに直りました。

次に，Safariでは問題ないものの，IEとFirefoxではバナー画像が見えないという問題が起きました。
OKAMURAさんにスタイルシートの一部にバグがあったことをご指摘いただき，全体的に見直してみました。
また，comcomさんのスタイルシートも参考にさせていただきました。
この結果，バナーのbackgroundのところを次のように変更しました。
（旧）
background: #ffffff url("http://homepage.mac.com/jsgarage/image/jlogo2004_2.gif") no-repeat 760px 60px;

（新）
background:#ffffff;
background-image: url("http://homepage.mac.com/jsgarage/image/jlogo2004_2.gif");
background-repeat: no-repeat;

これでリセット公開したところ，SafariでもIEでもFirefoxでも，問題なく表示されるようになりました。
また，W3C CSS検証サービス でチェックしてもらったところ，問題がない正当なCSSであると検証してもらいました。