ある「強調」部分をCSSで色つきの文字に変更するとします。しかし、強調と言っても実に様々な意味があり、2つばかりの「EM」「STRONG」という要素だけで分類しきれるものではありません。含みのある強調、ウケを狙った強調、その商品が低価格であることを目立たせたい場合の強調……。これらそれぞれをCSSで表現しようとする場合、classという属性を利用するのが良いとされます。
例えば何かを嘲笑する目的で、文字列をMS UI Gothicフォントとボールドで強調したいとします。このとき、
<em class="sneer">折角作った詞を自虐で台無しにしてしまう馬鹿</em>
のようにマークアップし、CSSで、
em.sneer{
font-family:"MS UI Gothic"
font-weight:bold;
}
と、意味と表現形式を別々に定義しておくわけです。
しかし、その日の気分によって、これを別の形式、例えばフォントサイズを拡大しピンク色で表現したい場合、どうしたらよいでしょうか。この方法では「その日の気分」といった人間の曖昧な感情を殺してしまいます。そういった人間の曖昧な部分が良いか悪いかは別問題として。いや、ここでは仮に道徳的に悪いことであったとします。しかし、そうであったとして、その「悪いこと」ができないという意味で、人間の表現欲求を奪ってしまうことに変わりありません。
見栄えを指定する要素が紛れ込んだHTML文書を書くのは良くないことである、と言われます。私も強くそう思います。
<em style="
font-family;"MS UI Gothic"
font-weight:bold
">
折角作った詞を自虐で台無しにしてしまう馬鹿</em>
これは、シンプルなマークアップで済むというCSSの利点を失ってしまっており、気軽に、楽にHTML文書を作成する上で大きな障害です。スタイルの変更などの柔軟性も失っています。
しかし、多彩な表現をするには詳細なクラス化を必要とします。強調の種類を自分なりに分析し、予め定義しておかねばなりません。
ここで、選択肢が登場するのだと思います。
この二者択一にならざるを得ない、これがCSSの欠点です。角丸や複数背景など、各CSSプロパティの多様性については、いずれ解決される問題に過ぎません(と、信じています)。
ゆえに私が興味を持つのは、フレキシビリティと、恣意的な表現欲求の両立をCSSにて実現するにはどうすれば良いのかという問題です。ただ、そのような表現欲求というのは、しばしばウェブサイトのデザイン、レイアウトの統一感を損ねる原因となりますし、閲覧者にとってあまり利益の無いものです。つまり見方を変えれば欠点ではありませんので、私はこのCSSの現状に、なんら不満がありません。ブラウザのCSS実装の現状には多少不満がありますが。
例えばCSS1のみに対応したブラウザがあったとします。このブラウザは、CSS2のプロパティを全て無視するまともなソフトウェアです。しかし、知らないプロパティを無視すればそれで問題は起こらないのでしょうか。
CSS1のプロパティとCSS2のプロパティを組み合わせてある種のスタイルが決定されており、どちらか一方が無視された場合、最悪読めないスタイルとなることも考えられます。つまり後方互換性を考慮に入れる場合、製作者側が常にそれらを予期してCSSを製作しなければなりません。まずCSS1のプロパティのみで完成させ、その後、CSS2のプロパティを利用して発展させるといった作業が必要になります。しかしCSSのバージョンが上がるにつれて、その作業量は膨大になることが予想されます。現時点でさえ、このような後方互換性を考慮してCSSを作成している製作者は皆無ですし、またCSS2の仕様書内に、そのような作業行程を推奨するといった文言も見られません(存在したならご報告頂ければ幸いです)。
すなわち、よほど有能なCSSデザイナが相応の時間をかけない限り、「不明なプロパティを無視する」という特性をきちんと利用することはできないのです。これは何を意味するでしょうか。事実上、「CSS対応ブラウザ」はあっても「CSS2対応ブラウザ」が存在してはならないことを意味します。「CSS対応ブラウザ」は常に、最新のCSSを実装している必要があるのです。そうでない限り後方互換性の問題は常に生じ、CSSユーザーはその時その時に応じて非公式のブラウザの対応情報を見ながら、細かなチェックを要求されることになるのです。尚、CSSを無効にすれば問題は起こりませんが、CSS有効の状態を前提にした際の問題点として書いております。ユーザビリティ的に考えれば、WWWユーザー(エンドユーザー)がスタイルシートのことなどを一々意識しなければ碌に読むことも出来ない危険があるというのは大問題です。
また、CSSの実装レベルに応じた最適なスタイルシートを提供する手段が用意されていません。現時点では、@mediaルール内に放り込むことで、CSS1対応User Agentを「はじく」ことが理論上可能ですが、このルールはその為に存在するものではなく、飽くまでも「hack」に過ぎません。また、CSS1対応User Agent向けに用意したCSSを、CSS2対応User Agentに読みこませない手段というものは存在しません。製作者は、あるレベルのCSSに対応したスタイルをウェブページに適用させた場合、それ以下のレベルのCSSに対応したスタイルを明示的に適用させることが出来ず、スクリプト等を利用しなければなりません。
先に述べたように:
このような段階的な作業をするしかありません。尚、User Agent(ブラウザ)のバグというものは一切考慮していませんし、「中途半端な実装」も考慮していません。つまり、バグも中途半端な実装も世の中に存在しない理想的な状態を想定しても尚、このような面倒が残るということです。これは相当な制約と言えましょう。古いバージョンのCSSのプロパティのみを使って、まず最低限読めるようなスタイルを完成させなければならないのですから。並の製作者に出来ることではありませんし、現時点では私もやっていません。CSS対応ブラウザとはすなわちCSS2対応ブラウザのことであると割り切ってしまっているわけです。