県道道メモ(2003年5月27日)

当サイトの細かい部分をいくつか見直し

当サイトの細かい部分をいくつか見直しました。

  1. これまでは他のサイトのページへのリンクをクリックすると新しいウィンドウが開くようにしていましたが、最近このコーナーなどで他サイトへのリンクをつけることが多くなってきたので、他のサイトへのリンクも同じウィンドウで開くようにしました。
    実験的に、他のサイトへのリンクの上にマウスを置くと赤色、自分のサイトのページへのリンクでは緑色になるように区別しています。でもあまり効果はないみたいなので気にしなくていいです。
  2. 全体的に文章の行と行の間を少し空けました。今まではブラウザのデフォルトのままでしたが、少し読みづらいように自分で感じてきたので調整することにしました。
  3. スパムメール防止のため、トップページに載せているメールアドレスは画像を用いて記載していましたが、やはり不親切なように思うのでリンクつきのメールアドレスに変更しました。スパムメール防御にはJavaScriptを使うのが最も効果があるらしいのですが、年を取ったせいかJavaScriptを勉強しても頭に入らないので、文字実体参照を使う方法を採用してみました。

メモ

2番目の行と行の間を空ける方法についてちょっと覚え書き。行間を空けるにはカスケーディングスタイルシート(CSS)のline-heightプロパティというのを使うのですが、このプロパティを指定すると、画像と文章を組み合わせたページの場合Netscape Navigator 4.xで閲覧すると画像と文字が重なって読めなくなるという不具合があります。Netscape 4.xにはこの他にもスタイルシート関連のバグが多くあるので、思い切ってNetscape 4.xにはスタイルシートを適用させないというのも1つの手です。その方法はいくつかありますが、私はスタイルシートを読み込むLINK要素にmedia属性をつけるというのを使いました。以下のような感じです。

<LINK rel="stylesheet" href="style.css" type="text/css" media="all">

media属性の値は"screen"以外なら何でもいいらしいので、media="screen,tv"とかでもいいです。このようにするとNetscape 4.xではスタイルシートが読み込まれなくなり、Netscape 6以降やInternet Explorer、Operaでは読み込まれるようになります。

引き続きスタイルシートの勉強中…。

追記(2005年6月4日)

上で、media属性の値は"screen"以外なら何でもいいらしいので、media="screen,tv"とかでもいいです、と書いてましたが、media="screen,tv"だとOperaで全画面表示にした際にスタイルが適用されなくなってしまうので、media="screen,tv,projection"とかにするのがおすすめです。