CSS

リンク

CSSでリンクの指定を行います。

アクセシビリティなWebページではリンクは重要で、リンクされているテキストなのか、リンクされている画像なのかを、訪問済みなリンク先なのか明示的にします。

英字フォントの場合は、ベースラインとボトムラインという仮想の基準線があり、下線とボトムラインの間に数ピクセル空白があります。そのため、リンクに下線を付けてあっても目にうるさくないのですが、日本語フォントの場合は、基本的にベースラインとボトムラインがほぼ同じです。

そのため文字の下端と下線がくっついて見えて、下線を付けることを嫌う傾向にありますが、アクセシビリティなWebページを作成する場合は、そのテキストがリンクであることを明示的に連想させるようにします。

この場合は「疑似クラス」と言います。CSSは後から設定した値が優先されますから、GoLive CSの順番で設定すると大丈夫です。

左下の< >をクリックします。

疑似クラスとdisplay:blockを使って、マウスが枠内に位置づけられた時に背景色を変更してみました。

※CSSなどはこちらのサンプルページの内部CSSを参照して下さい。