『スタイルシートの登場』

インターネットの普及さらにはホームページの普及に伴い、視覚的な効果・表現力に対する要望や期待も高まってくるわけですが、それに対応したのが「スタイルシート」です。

従来、HTMLによりマークアップされた各要素(見出しや段落、引用など)をどのように視覚的に表現するか、その決定権はWeb作成者にはなく、ブラウザにありました。

例えば、作成者が「H1(見出しレベル1)の文字サイズは標準より1つ大きくして、さらに斜体にしたい」と思っても、主要なブラウザでは「標準よりずっと大きいサイズの太字」でしか(基本的には)表示されません。そこで、希望する表現を実現するために、内容的には見出しである文字列を「<H1>見出し1</H1>」とせず、「<FONT size="+1"><I>見出し1</I></FONT>」とマークアップしてしまうのです。

つまり、ページの見え方を重視するならば、「(メジャーな)ブラウザでの見え方を基準」にして使用する要素を選ぶしかなかったというわけです。当然この場合、HTMLでマークアップする本体の目的(=文書内の各語句がもつ「意味を基準」にしてマークアップする)は失われてしまいます。

一方で、作成者が作成の際に使用したブラウザとは異なるブラウザ(メーカーの違いや、バージョンの違いなど)でページがブラウズ(閲覧)された場合、作成者の意図したとおりにレイアウトが伝わらないという問題も、Web作成には存在していたわけです。

しかしスタイルシートを使うことにより、Web作成者の側で各要素の表現を自由に決めることができるようになりました。例えばNetscapeNavigatorやInternetExplorerでは<H1>は文字を大きくすることにより表現されていますが、Web作成者が文字の大きさはそのままで赤色という色の変化で<H1>を表現したいと思ったら、そのとおりに<H1>の見え方を定義することができるのです。

そしてこれは見る側にとっても同じなのです。すなわち、見る側が<H1>は青色の斜体で表示させたいと思ったら、自分でそのようなスタイルシートを用意することにより、Web作成者が決めたスタイルとは別のスタイルで文書を見ることができるわけです。

つまり、従来はWeb作成者・見る者双方とも使用するブラウザの見せ方(つまりはブラウザ標準設定?)に従うしかなかったのが、スタイルシートの登場により、お互いが自由な表現方法でWebページを利用することができるという「可能性」が生まれたわけです。

そう、「可能性」……スタイルシートの仕様書としては「CSS1(Cascading Style Sheets, level 1)」(1996/12/17公布)及び「CSS2(Cascading Style Sheets, level 2 )」(1998/5/12公布)がありますが、2000/7/16現在では、スタイルシートに完全に対応しているブラウザは存在していません。また、(Web作成者が決めたスタイルとは別の)スタイルを見る側が利用するという機能を十分に備えているブラウザも存在していません。さらに、対応度がブラウザにより異なっているという問題もあります。

従って、スタイルシートの仕様をそのままフルにWeb作成に用いるわけにはいきませんが、今後Webの視覚的効果や表現力(さらには視覚的効果以外の表現も含むのだが)にとって、スタイルシートが大きな意義を持つことに変わりはないでしょう。

しかし、スタイルシートの登場により、HTMLを記述する際にはこれまで以上に物理的な表現を使わず、徹底して論理的な文書の記述が求められるようになったわけです。言い換えると、論理的な文書の記述が十分にできなければ、スタイルシートのもつ可能性や本当の魅力を引き出すことはできない=わざわざスタイルシートを使う意味がない、ということもあり得ます。

この点については次回、簡単に解説したいと思います。

[追記]

スタイルシートはHTMLではありません。HTMLの仕様書に次のような記述があります。

User agents must not evaluate style data as HTML markup.

『ユーザーエージェントはスタイルデータをHTMLマークアップとして評価してはいけない。』(6. Basic HTML data types)

またCSS2のW3C勧告では、「CSS2は、 広く実装されている CSS1 を発展させたスタイルシート言語」とされています。

スタイルシートの仕様書の冒頭にある要約にも触れておきます。

CSS1(Cascading Style Sheets, level 1)1996/12/17公布

CSS1 is a simple style sheet mechanism that allows authors and readers to attach style (e.g. fonts, colors and spacing) to HTML documents.

『CSS1は、作成者と読者がHTML文書にスタイル(例;フォント、色、間隔)を付けられるようにするシンプルなスタイルシート機能である。』

CSS2(Cascading Style Sheets, level 2 )1998/5/12公布

CSS2 is a style sheet language that allows authors and users to attach style (e.g., fonts, spacing, and aural cues) to structured documents (e.g.,HTML documents and XML applications).

『CSS2は、作成者とユーザーが論理構造化された文書(例;HTML文書やXMLアプリケーション)にスタイル(例;フォント、間隔、音声による指示)を付けられるようにするスタイルシート言語である。』

CSS1とCSS2に微妙な(しかし大きな)言葉の変化が見られるのがわかります。すなわち、スタイルとは「視覚的要素に限定されるものではない」(例:音声による指示)、ということです。

●「スタイルシート講座」も作らないといけないかな?(笑)


このページのご意見・ご感想は?
1.とっても良かった! 2.部分的に良かった 3.まぁまぁかな 4.説明が足りないぞ! 5.期待はずれ〜 6.その他
※具体的なご意見ご感想などがあれば、下のメッセージ欄へご記入どうぞ!(未記入でも送信可)

#上記送信フォームほか、掲示板チャットでもご意見ご感想お待ちしております。なおいただいた内容は(もちろんプライバシーに配慮したカタチで)日記の話題に取りあげることがあります。あらかじめご了承ください。


サイト目次

おすすめグッズ

/ 映画 / 音楽 / テレビ番組 / プレゼント・ギフト / ホーム&キッチン / エレクトロニクス / おもちゃ&ホビー / ダイエット・健康

おすすめ情報・知識

パソコン / インターネット / メール / ホームページ作成 / CGI / Perl

おすすめネタ

雑学メモ / ときたまメモ / フリートーク

おすすめ特集

「Kissin' Christmas CD化」計画 / 「フォーク並び」推進計画 / 追悼ステファン・グラッペリ 他、いろいろ。

おすすめCGI

CGI更新状況 / 日記 / チャット(P.M.10:30〜かも?) / 掲示板 / 画像投稿掲示板 / お絵かき掲示板 / ご意見・ご感想

おすすめリンク

サイト内検索

[ ↑このページの先頭へ移動するこのコーナーの目次を表示する ]
注)このページ自体が目次ページという場合があります。