HTML 外部リンクへのアクセス状況を色で表示

この Blog  ( Blogger ) もそうですが、外部リンクに対して、表示色を変えて 履歴の視認性を上げているものが多いですね。
投稿を書いていると、既に、機能的に盛り込まれているので、苦労する必要はありません。
でも、自分で作ったローカルの HTML ファイルの場合、この様な 気の利いた 仕組みは、自分で書き足す必要があります。


通常の投稿のみを書いている方の場合には、全く無駄と言うか、関係ないので、参考としてお読み下さい。


通常、外部リンク （ハイパーリンク） は、何も指定しなければ、　過去の履歴や状態に応じた 表示文字色に違いはありません。
Blog サービス等で、これらが実現出来ているのは、テンプレートや CSS 等で指定がされているからですね。
　　　　　と考えれば、有難い事です。 　Blogger さま そして Google さま に感謝！


色指定が以下の前提の場合には、

設定種別	指定概要
まだ見ていないリンク	a:link{color:赤;}
既に見たリンク	a:visited{color:緑;}
カーソルが上にある場合	a:hover{color:ピンク;}
リンクを選択した時	a:active{color:黄;}

なお、この例では、極端な色にしていますが、実際の利用では 普段の見慣れた 色 に置き換えて下さい。
HTML のコードは こうなります。

 <style type="text/css">
 <!--
        a:link {color:#ff0000;}
        a:visited{color:#008000;} 
        a:hover{color:#ff00ff;} 
        a:active{color:#ffff00;} 
 -->
 </style>

もしくは、

 <style>
     a:link {color:#ff0000;}
     a:visited{color:#008000;} 
     a:hover{color:#ff00ff;} 
     a:active{color:#ffff00;} 
 </style>

但し、記述時の各項目の順番は重要で、この順序を守って下さい。



また、履歴の状態把握は、各ブラウザがサポートしてくれますので 、特に何も書かなくてもちゃんと動きます。

PC 上の各ブラウザには、方言と言うか、サポート範囲に微妙な誤差が存在する様なのですが、
この書き方の場合、大きな誤差はない様です。
若干のマウスの挙動に対する反応が違うとも言われていますが、確かめてはいません。

履歴、つまり、リンクを辿った事があるか否か は、各ブラウザに保存されている 一時ファイル や Cookie に基づいています。
ですから、履歴を残さない プライベート・ブラウジング機能 を利用している場合には、そのセッションの中だけで有効な履歴となります。
つまり、初期状態は、履歴なし です。　（プライベートでないブラウザで閲覧していても　です。）
この辺りも、ブラウザ や その マイナーチェンジで、微妙な違いが発生する可能性があります。.