Tweet｜ ｜ ｜ ｜

[ 2分で読めて簡単導入できます]

最近のブラウザにはfavicon（favorite icon）と呼ばれるブックマークやアドレス表示欄、タブなどに表示されるアイコンがあります。
サイトを識別するため、目立つためなどさまざまな目的で使用されています。
Hyperlink Cues with Faviconsでは、リンクさせた外部リンクの全て前にこのfaviconを表示させるjavascriptを公開しています。

使用方法
favicon.jsとfaviconを使用していないサイト用にexternal.gifをダウンロードします。
<script src="http://yourdomain/favicon.js" type="text/javascript"></script>
<style type="text/css">
img.faviconimg {border:0;width:11px;height:11px;padding:0 4px}
ul.favilist {list-style:none;}
</style>
＊favicon.js内でexternal.gifを指定している箇所を適宜変更してください。
以上のようにhead内に書き込んだら、あとはHTMLでulのclass属性にfavilistを付与し、リンクをliで括ってください。
<ul class="favilist">
<li><a href="">リンク先</a></li>
<li><a href="">リンク先</a></li>
<li><a href="">リンク先</a></li>
</ul>
faviconを表示するjavascript「Hyperlink Cues with Favicons」サンプル

記事作成：2007年10月06日