HTML3.xまででは、見栄えを重視するがあまりに、文書の構造を考慮しない（できない）ページも多々ありました。現在でも根強く残っています。<H1>などの見出しを意味するタグや<strong>や<em>などの論理強調タグではなくて、<font size="5" color="#FF0000">という形で、見た目だけを強調するのです。これでは、音声ブラウザを使っている訪問者には、そこが強調されているということは全く伝わりません。文字色だけ変えているともっと悲惨で、文字ブラウザやモノクロ画面を使っている訪問者にも、そこが強調されているというのが伝わらなくなります。
これでは、本来ＨＴＭＬが持っていた「文書の構造を記す」という観点が失われてしまうということで、W3Cが1997年に勧告したのが、HTML4.0でした。HTML3.xまでとは異なり、
「今後は、HTMLから表示方法やレイアウトなどの『表現』に関する部分を排除していく」という方針を打ち出したことです。
このW3Cの方針は、文書にきちんと構造を持たせて、どのような環境であっても、同じ意味が伝わるようにしましょうという考えです。これがアクセシビリティの考え方ですね。
具体的に言えば、HTML4.0からは、見出しは<H1>タグなどで、強調は<strong>や<em>を使うことで、文書としての構造的な意味をきちんと持たせ、見かけに関する部分については、各タグに対して表示様式を別指定することにしましょうということです。
私自身がアクセシビリティということを考えるときに、一番重視したいことは、表示様式に関する情報が失われたとしても、文書としてきちんと読めるようなWebページを作るということです。私が作るサイトは、テキストベースですから。
確かに見栄えも大切ですが、訪問者がどんな環境でWWWサーフィンをしてくるのかわからない以上、見栄えばかりにこだわっていてはダメだと思います。
「自分のWebサイトにやってくる訪問者に何を一番期待するのか？」
それが明確であるのであれば、見栄えにとことんこだわるのもありだろうとは思います。つまり、この点を明確にできず、ただ見栄えを良くするだけにアクセシビリティを下げるようなことをするのであれば、それはサイト作成者の勉強不足だと思いますね。
スタイルシートは上手に使えば、より見栄えの良いWebページの作成に役立ちますし、アクセシビリティの向上にも大いに貢献します。
スタイルシートを使う大きなメリットは、
という３点です。
これらが何を意味するかと言えば、より見栄えのよいページを軽く作ることができるということです。このサイトでもずいぶんとお世話になっています。
しかし、メリットばかりではないんです。
特に２番目のデメリットは、なまじ対応しているが故の問題点も引き起こす結果となりました。
このサイトでも、改造前はNetscape4.xで、スタイルシートがONだと、グローバルナビゲーションのシステムが使えませんでした。リンクが機能しないという致命傷に見舞われてしまったのです。要素の一つ一つはきちんと対応しているのですが、複合するとダメなようです。
何をやったかというと、枠線の種類指定、枠線の色指定、ボックスの幅＆背景色＆文字色指定をスタイルシートでやって、各項目にリンクを張っていたんです。
対応していないのなら、はっきりしないとアナウンスされていた方が、よっぽどましだったと思います。特にNetscape
Communicator 4.xの対応はあまりにもひどすぎます。
はよ、Netscape6の普及が進んでくれないかなというのが、Webサイト制作者としての本音！？（きっと私だけじゃないはずだ・・・）
全く対応していないのであれば、表示様式の情報が失われますから、ブラウザとしては、ソースの上から書いてあることを順番に読んできて表示します。このサイトの場合だと、真っ白な背景に真っ黒なテキスト。文字の大きさはもちろんブラウザ任せ。でも、文書としての構造はしっかり保たれています。
スタイルシートが使えない状態で文書としての構造が崩れてしまうのであれば、HTMLの文書としては失格です。
スタイルシートを使った、見栄えのよいWebサイトも増えてきました。が、見栄えにこだわりすぎるがあまりに、以下のような落とし穴にはまってしまっているサイトも目立ちます。
自由なデザインをするためのスタイルシートという側面だけにとらわれすぎて、アクセシビリティという概念を考えていない結果、このようなサイト作りになってしまっているかと思います。「文字サイズの固定はしない」や「見苦しいテキスト配置」でこれらの落とし穴について解説していますので、参照して下さい。
HTML4.0では、テーブルを使ったレイアウトというのは間違った使い方だとやり玉に挙げられています。スタイルシートでレイアウトをすべきだという考えです。理想を言えば、スタイルシートのposition属性やmargin属性でと言うことでしょう。
しかし、スタイルシートに対応していなかったり、中途半端にしか対応できていないブラウザで閲覧する訪問者のことを考えると、何でもかんでもスタイルシートというのはあまりにも危険です。かえってアクセシビリティの低下を招きかねません。
これらのブラウザのことまで考えるのあれば、テーブルを使ったレイアウトを否定できません。特に見栄えを重視するのであればなおさらです。
テーブルを使う上で、覚えていて欲しいことが２つあります。
１つ目は、テーブルは、横１列について記していきます。つまり、１行目の１列目、２列目、３列目・・・、２行目の１列目、２列目、３列目・・・というように記していくのです。これは、文書の構造を崩す原因になりかねないと言うことです。携帯電話で表組みを駆使したサイトへアクセスするとこのことが実感できるかと思います。
２つ目は、表組みの表示はテーブル全体のデータが読み込み終了しないと始まらないということです。すなわち、ページが表示されるまでに時間がかかると言うことです。複雑な表組みを指定しているとなおさらです。Internet
Explorer5やNetscape6では、スタイルシートで、最初の行を読み終わった段階で、レイアウトを決定して表示できるようにすることもできますが・・・両ブラウザ以外ではこれらの恩恵にあずかることはできません。
W3Cの勧告だからと、安易にスタイルシートを使うのではなく、使うのであれば、アクセシビリティの向上というのをまず第一に考えて欲しいということです。スタイルシートを使うことで、かえってアクセシビリティを下げるのであれば、使う必要なんてないと考えます。それだったら、テーブルを使った方が、古いブラウザでも同じような見栄えが保てます。
結局スタイルシートを導入するかどうかは、自分のサイトの目的に応じてということになるかと思います。