進行性Ｗ病 道順は 彼等に訊く
＝Liquid Fingers＝
ずいぶん前から気付いていたのです。
近頃売っているパーソナルコンピュータのディスプレイ。あれの縦横比がずいぶん横長に変わっていたり、画面解像度が妙に大きな数値になっていたり。
おっと坊や。そんなことされちゃ困るな。ブラウザを画面に最大表示するなんて。進行性ダブル病が、びろーんってなっちゃうじゃないか。
えっ？<table>タグを使ってwidthプロパティを800pxくらいに設定してセンタリングでもしたらいいじゃないか、だって？！
ぬぬぬ。拙は、意地でもデザインにテーブルタグは使わぬ。
使わないのぢゃ。
そんなわけで、拙サイト"進行性W病"は久々に、デザインに関するバージョンをアップしました。この仕様がこの先5年から10年くらい使えたらいいのになあ、と思ってます。だってここまでやるのって結構めんどくさいですもん。それにしても2005年にメジャーアップデイトしておいてよかったとつくづく思いました。
2005年にやったことってのは、雑然とネタが並んでいるコラムの仕様を一括して制御できるようにした、というものでした。 ドキュメントタイプの宣言、各ディレクション毎のスタイルシート取り込みと共通メニュー。その他細々とした共通箇所もプログラムでリクエストごとにサーバが文書を出す仕組み････。
しかもブラウザがネットスケープナビゲータ4xだろうがたとえIE4.5だとしても意味が通るデザインをはきだす仕様も仕込んでいました。それ以外にも一般に存在する、どの日本語対応ブラウザでも「読むことができる」ように、スタイルシートを切り離した、つまりデザインの面では色の無い、白い背景に黒い文字におまけで添えた画像データで読むことができる、構造だけはまるで学術論文みたいなデータをサーバが生成するようにしていました。
その「学術論文みたいなデータ」構造を守るために、テーブルタグを使うことを、わたしのなかで禁じているのです。
こうした前準備ができていたおかげで本文にはちょっと細工を追加しただけで、ばっさりとデザイン変更を終えることができました。もちろんこれは例によって自慢しているわけですが、さてここからが本題です。この駄文がこのディレクション「懺悔室」にある理由を書きます。
いろいろ面倒くさくなりました。失礼ながらブラウザ差別をすることにします。つまり、最近のモジラ･オアノット、こういうことになります。動作テストする環境をいつまでも維持管理することは、なかなか大変なことなのです。ご理解ください。
今後、レガシーブラウザは「学術論文みたいなデータ」形式で読んでください。画面のサイズはご自分で好きな大きさ、読みやすい幅に設定してください。ちゃんと意味は通って読める筈ですから。
最新型のモジラといえばFirefox。これはおすすめです。
ここまで作文してからわたしはインターネットエクスブローラ６を起動して、今回やったデザイン改修の結果を確認しようとしました。普段は、テキストエディタで生成した文書をファイアフォックスでブラウザしてデータを作っているのですが、善悪は別にして世の大勢を未だ占めるものにも対峙する必要はある、と一応は考えていますから。
すってーん!!（「地球防衛軍は負けない」の頃の新田たつお風味）
これは酷い。以前にInternetExplorer6スペシャルのトップページを以前に作ったとき、そのデザインはIE6のW3C非推奨の独自仕様を逆手に取ったことを思い出しました。つまりIEはCSSについてバグがある、とわたしはあらためて言いたい気分になりました。W3Cが推奨するとおりの文法で記述してデザインしたわたしのコラムの一部が、ギタギタにされてしまうのですから、堪ったものではありません。
いくつも<div>タグで囲んで、それぞれ独自に機能を与え名前を付けてデザインを組み上げたわけですが、W3Cの約束に違反しているのか、レイアウトされた位置がちょっとおかしいのです。でも、多少不細工ですが、読む上での支障が無さそうなので放置することにしました。そうです、これは仕様なのです。
それから、こりゃ許せないよな、って問題がリスト系に存在していました。われわれはリストを作るとき普通なら<ol>タグ<ul>タグの中に<li>タグを使って行いますが、表現したいリストの中には、目次の大見出し-小見出しのように入れ子構造になるものもあります。その入れ子にしたリストをIEはきちんと処理できない、という不具合を抱えていることを知りました。（バージョン７については試す気力も湧いてきません）
今回のサイトデザイン変更にあたっての目標のひとつにIEで閲覧されている人にも[Valid-XHTML]と[Valid-CSS]を掲げたいというのがありましたから、わたしは一度は開放されたと思ったIEスペシャルを泣く泣く再び構築するハメになったわけなのです。
んで何をやったか。拙サイト内コラム「誰のオートバイ」「素浪な武士にしてくれ」など、ナビゲーション部分を入れ子構造にしておかないと、どうしても冗長になってしまうものについて、IEスペシャルでは小見出しに相当する箇所のアタマに＊(アスタリスク)マークをベタ書きして大見出しレベルと同じ階層のリストとして扱う、というダサダサの始末をしました。かっちょわりー。
「ダメっすね IEって」
ま、ひとつ言えることは、これであまたのブラウザでの表示チェックからわたしは開放された、のです。
「ここまでやるトコロは、ちょっとなかなか無いよ」（レストアショップの店先で、店主と新規の見込客との間でよく交わされる会話の真似）
さあ、キーボードを叩くわたしの指は、これからもわたしなりのリキッド･デザインを追求していきます。いやいやそんなことよりも内容をなんとかしなさい、というご意見もありがたくちょうだいしたいと思いますが、まずは読めてナンボということが、わたしには大切なのです。笑ってやってください。
Liquid Fingers / 渡辺香津美
- ご意見ご要望はBBSで承ります
i_irie@po.harenet.ne.jp