6個のスタイル規則だけで作るナビゲーションバー
ナビゲーションバーは、ホームページの上部や、サイドバーに、リンクを並べたものです。
ナビゲーションバーは、階層構造になっていて、ホルダとファイルのように、ひとつの項目にマウスカーソルを置くと、そのカテゴリに含まれるファイルや、ホルダのリストを表示するようになっています。
表示する必要のないリストをうまく隠し、マウスカーソルをのせるとそのリストを表示するという仕組みなのですが、そのような機能を簡単に実現するためには、スタイルの指定が細かく正確に出来なければなりません。
新しいブラウザは、そのあたりの機能がきちんとしていて、CSSだけで簡単に作ることが出来ます。
インターネットでは、IE6などのブラウザがいまだに現役でかなりの数が使われています。
古いブラウザで表示できないHTMLがいいとは思いませんが、新しいブラウザでも、古いブラウザでも、とにかく、視覚的な同一性を追求しすぎることは、WEB制作コストを跳ね上げることになります。
インターネット上での「表現とはなにか」ということについて、考えるべき時期なのかもしれません。
ナビゲーションバーは、ブログなどを使っていると、自動的に作成されるので作ることはない。
だから、ナビゲーション用のリンクは、複雑で、CSSだけじゃいろいろと問題があって、出来れば、触りたくないという、気持ちもある。
しかし、IE6の頃からずいぶん経ち、IE6には、HTMLのリストスタイルで見せればいい。
と決めて書いてみることにした。
作る過程では、いろいろ考え込んで、時間もかかったが、出来上がると、
いいのかなこれでと思うほど、シンプルすぎて
※ せっかくなのでボタンらしく、色の指定も追加してみました:-)