さよなら MacIE

世は XMLXSLT に一直線なのだから、UTF-8 で全てを構築する。
今回のサイトリニューアルに際し、それが基本方針でした。 NN4.x と MacIE4.5 には CSS を適用しないという選択肢に躊躇はありませんでしたが、MacIE5 をどうするかで随分と悩みました。 2003年6月にその進化を終えてしまった MacIE5 を。
でもどこまで可能か試してみたかったのです。 OSX で Win に歩み寄った Mac を Win ユーザーが始めて触れる時、デフォルトで搭載されているブラウザに IE があれば WinIE ユーザーは迷わず MacIE を使うでことしょうし、それに対応させることは、かつて NN4.x に浪費された多大な労力とは全く別ですから。
 


たどり着いた結果は以下の通りです。文字コード全て UTF-8。
XHTML 1.0 Transitional 標準モード。 BOM 無し( charset 宣言)
CSS ファイル = BOM 無し
JS ファイル = BOM 無し
CGI ファイル = BOM 無し
≪確認環境≫
Mac OSX Panther (10.3) = Safari 1.3 & IE5.2
Win 2k sp4 = IE5.0 & IE5.5 & IE6
Win XP sp2 = IE6
 
サイトの基本構造が右図。
実現したかったのは content 部分に背景を透過させることと、header に置いたリンクボタンにひとつの背景画像を移動させながら表示するという最近メジャーな手法を応用し、それぞれのボタンを自由な位置に絶対配置すること。 Home は content 部分にもボックスをランダムに絶対配置してます。 Body に乗せた背景画像のキャッシュを利用して Container に重ねることにより、背景透過を保ちながら Content の下方リキッドを実現しました。 Header の絶対配置ボタンはスンナリ。 意外だったのは Home の Content に絶対配置したボックス幅リキッド。 1行目のラインが短いとフロートが崩れてしまう Mac Safari に四苦八苦して、なんとレガシーな table で対処するという結果になりました。
他にも色々な手法があるとは思いますが、この構造を MacIE5 はパッチ無しでキチンと表示してくれています。 CSS ファイルに MacIE5 用はありません。 唯一 MacIE5 だけに適用させたパッチは、エル・データベース のトップページのみ。 これはテーブルのセル幅が制御しきれなかったからで、それもテキストを画像にするかフラッシュを使えば回避できましたが、MacIE へのレクイエムとして意識的に残すことにしました。
 
ここまで表示してくれると MacIE5 に対する印象も変わります。
さすがに XML+XSLT+CSS は無理でしたが、それも今では愛しく感じます。