2005年06月25日（土） コメント:5 トラックバック:2
企画に便乗してみます。
テンプレート作成時のこだわりは、一連の『chameleon』解説で書いてしまったので、 [chameleon]以外でもあてはまることを書いてみます（[chameleon]はちょっと特殊ですし、あそこに書いていないことで実験的なこともやっていますがそれはまだ秘密）。
第一にJavaScript、CSS、画像の有効無効どの組み合わせでも閲覧に支障がないようにすることです。今のところJavaScriptはほとんど使っていない（というか使えない）ので問題ないんですが（JavaScript切ってるとナビゲーションが全く機能しないテンプレって結構ありますよね）、「CSS有効で画像無効」の場合に「画像置換」をやっていると不都合があるので気をつけています（具体的な話はいずれ書くかもしれません）。
もうひとつはユーザースタイルシートを使っての表示確認です。文書構造がまともかどうかを（視覚的に）チェックするためです。 つまりStrictなHTMLへのこだわりというものがあるのですが、これはもう「趣味」の話です。Strict HTML＋CSSはデザイン面で制約があるとはいえ、制約があるからこそ面白いのです（プロの方はそうも言ってられないんでしょうけど）。
このとき使うCSSファイルは自分で作ったものではなく、よそのサイトで使われているものをパクってお借りしています。最近は徳保さん（趣味のWebデザイン）の「folio」からclass,id,画像に関する指定を取り除いたものを好んで使っています。基本構成がシンプルなので流用しやすく、普通のマークアップならば趣味のWebデザインそっくりになるところが面白いからです（現在、代替CSSにfolioを指定してあるので対応ブラウザなら見ることができます）。
ユーザースタイルシートでの表示確認にはFirefox拡張のWeb Developerを使います。「無効化」から「link要素で指定されたCSS」を無効にし、「CSS」から「ユーザー定義のスタイルシートを追加する」という手順です。この方法だと制作者CSSと競合することがないので便利です（画像やJavaScriptの無効化にもWeb Developerを利用しています）。
さて、ここからが本題というか、こういうFirefoxの拡張があったらなぁという願望。自分はユーザースタイルシートをたまに使って閲覧しています。ですが常用するには至りません。 （大多数の）マークアップのひどいサイトだと逆に見難くなったり、マークアップのまともなサイトならそもそも制作者CSSで十分読みやすい（ことが多い）からです。不正なマークアップ対策や制作者CSSを完全に殺すような指定をするのは面倒なので、それなら制作者CSSや物理マークアップによる装飾で我慢します。
適当に作ってしまうと閲覧するサイトのスタイルシートと競合してしまって、逆に読みにくくなることがあります。デザインのバランスも崩れて不快です。それで、結局使わない方が面倒がなくてよいというオチになることがあります。
まさにこれです。でもたまにはユーザースタイルシートを使いたいと思うので、そのときはWeb Developerを利用しています。
Web Developerの「無効化」と「CSS」のコンボは、ユーザースタイルシートを使いたいと思ったときだけに適用することができ、しかも制作者CSSとの競合も避けられます。しかし手順が少し面倒なので、この機能をボタン一発でできるような拡張はないものかとちょっと探してみましたが、見つかりませんでした。 望む機能を書き出してみます。
- プルダウンメニューでユーザースタイルシートと制作者CSS、代替CSS（あれば）を選択できる
- ユーザースタイルシートを選択した場合、制作者CSSをすべて無効にできる
- 同じドメイン内ならページを移動しても選択したスタイルシートが保持される
- プルダウンメニューとは別に、制作者CSSを無効にし、ひとつのユーザースタイルシートをワンクリックで適用させる「ボタン」もあるとうれしい
- 拡張機能の設定から以下の項目について設定できる
- ユーザースタイルシート（複数）の登録
- 制作者CSSをどの程度無効にするか（link要素での指定は無効、head要素内は有効とか、特定のプロパティは有効など）
- デフォルトでは制作者CSSかユーザースタイルシートのどちらを適用させるか（すなわちユーザースタイルシート「常用」もできる）
- 特定のWebページに対してのみ適用させるCSSの設定（サイトごとにユーザースタイルシートを自動的に振り分け）
具体的に機能を列挙してみると、ますますほしくなってきました。どこかにありそうな気もするんですが。
コメント（5件）
こんにちは。bbsで衝撃を受け、以来、拝読しております。
ここFC2ブログに来るまで、cssデザインというものにものすごぉい苦手意識を持っており、css見るのも抵抗があるような状況でしたが、いろいろな方々のテンプレートに触れ、その面白さに今更ながら気付かせていただいているところです。
私は運良く（？）HTMLレイアウトの時代を経験することなくCSSレイアウトから覚えることができたので、CSSはあって当たり前のように感じております。が、やはりブラウザのバグには悩まされますね。
遅くなりましたが、トラックバック送らせていただきました。
おかげさまで何だか読んでるだけでわくわくするトラックバックテーマになっております。
＞が、やはりブラウザのバグには悩まされますね。
！ 今度のテーマが思いついたような気が・・・します（笑）。
ともかく ありがとうございました(^^
以前から、色々と参考にさせて頂いております。
今回こちらで「Web Developer」を知り、さっそく導入してみました。「ユーザースタイルシートを当てる」という意味をいまいち理解できていなかったのが解決できた上、この便利な機能で助かっております。どうもありがとうございました。（トラバさせていただきました）
＞HTMLレイアウトの時代を経験することなくCSSレイアウトから覚えることができた
うらやましいです（笑）ワタシなんてバリバリのテーブル世代なので...
Web Developerは本当に便利で、サイト制作者の必需品と言ってもいいと思います。特に「ブロック要素を枠で囲む」と「構文の検証」を重宝しています。
ところで、ユーザースタイルシートはWeb Developerを使わずともたいていのブラウザで利用できます（WinIEですと「インターネットオプション」の「ユーザー補助」から選択できます）。ただ、現在のページのCSSに“追加で”読み込むことになるため、徹底的に作りこんだCSSファイルを用意しないと逆に見難くなってしまうのが難点です。