link要素とCSSのみでナビゲーションを作る

このサイトでは、サイト内を結ぶリンクをlink要素のみで表現している。その為、OperaやLink Widgets、或は同等の機能を有すextensionがインストールされているFirefox以外のブラウザでは、サイト内を結ぶリンクが、通常は表に出ない構造となっている。表に出ずとも、殆どのブラウザに、開いている頁のソースを表示する機能が備わっている。なので、問題はなかろうと思っていた。

しかし、その考えは甘かった。そのような煩わしい手順を踏んで下さる方は稀で、抑々、そのような事をしていると気付かれない方が殆どだった。

どうにかしようと思い立ち、可視化する方法を考えた。出来るだけ既存のXHTML文書を書き換える事なく済ませたい。JavaScriptを無効にしている方も困る事ないようにしたい。そう思ったので、CSSを使う事にした。Geckoエンジンが載せられたウェブブラウザではlink要素はa要素と同じように表示される ()。この事は少し前に影月さんに教えて戴いた。これを使えば、CSSだけで、既存のXHTML文書を全く書き換える事なく、既存のCSS文書に、少し書き加えれるだけで解決出来る。

問題はGeckoエンジンを載せていないウェブブラウザだ。他のウェブブラウザでは、可視化は出来るが、アンカーとして扱ってくれない。これでは可視化する意味がない。なので、Geckoエンジンを載せたウェブブラウザ以外では、適応されないようにする為、html:not(:empty)を一緒に付けた。これはCSS 3で追加される予定のセレクタの:not():emptyを組合せたものだ。Geckoエンジンでは何時からかは知らないが、CSS 3のセレクタに一部対応している。その中には:not():emptyも含まれている。Operaでは今現在、CSS 3のセレクタには対応していない。IEを含めた他のブラウザでも、恐らく対応していないだろう。このような記述は私も好きではないし、褒められた事でもなかろう。XHTML 2の仕様ならば、Geckoエンジンを載せたウェブブラウザ以外でも同様の事が出来るだろう。早くXHTML 2が勧告され、多くのウェブブラウザにて実装されて欲しい。そうすれば、忌々しい姑息な記述を廃せる。

2006-08-20T12:59:18+09:00