続イメージファイト - HTML 2.0 New Browser Detection

Shibuya Perl Mongersテクニカルトーク#8 で発表した「続イメージファイト」の資料を SlideShare で公開しました。

Shibuya.pm#8 続イメージファイト - HTML 2.0 New Browser Detection

JavaScriptやCSS Hacksを一切使わずにHTMLでブラウザを判別するハックの紹介です。

HTML 2.0 - Browser detection [3]

ブラウザ判別のデモのページにアクセスすると、使っているブラウザの画像が表示されます。

このimgタグのsrc属性はfirefox2.0、firefox1.5、その他のGeckoエンジンを搭載したブラウザ、Safari2、Safari3、Opera、ie、w3m、lynxなどのブラウザの判別に対応しています。

テキストブラウザの判別

この手法を使うと w3m と lynx の判別もできます。

デバッグ風景

HTMLタグだけでブラウザ判別を行なう手法はまだ体系化されていないため、こんな感じで机上デバッグしてデモのコードを作りました。

参考文献

1. ブラウザ振り分けクイズ - hoshikuzu | star_dust の書斎 (id:hoshikuzuさん)
2. 葉っぱ日記 - ブラウザによって異なる画像を表示する(その2) (id:hasegawayosukeさん)

免責事項

ちなみに、ブラウザのバグや細かい実装に依存したハックは、ブラウザのバージョンアップによって覆される可能性が高いですので、一切無保証です。予めご了承下さい。