リンクで_blankを使わず新ウィンドウに表示させる方法

ウェブページでリンクをクリックして、新しいウィンドウ表示するには、普通target="_blank"を使います。このかわりにJavaScriptを使ってrel="external"を使う方法を試してみました。

リンクを新しいウィンドウに表示させるかどうかの問題

ワードプレス楽天 (Word Press)ではコメントのリンクにrel="external nofollow"との記述が自動的に入って、このリンクをクリックすると同じウィンドウ内に表示されるようになっています。これを新しいウィンドウに表示したいと思ったら、リンクを右クリックしてメニューから選ぶか、SHIFTかCTRLキーを押しながらリンクをクリックします。

ウェブページでリンクをクリックして、新しいウィンドウ表示するには、普通target="_blank"を使います。しかし、この書き方はXHTML (1.0Strictや1.1)には準拠していません。これは、新しいウィンドウを開くかどうかはユーザーが決めるべき問題で、ウェブページ側では決めないという考え方からきています。

でも、全ユーザーが新しいウィンドウで開くやり方を知っているかというと疑問です。やはり外部リンクは新しい窓で開きたいものです。そうしないとまた元のページに戻ってくるのが大変ですし、もう戻ってきてくれないかも知れません。

target="_blank"を使うと、HTMLの文法チェッカーで検査すると、間違っていると警告が出ることがあります。これを回避するにはJavaScriptを使う方法があります。

今回のこの方法以外に、外部リンクは新しいウィンドウを開く画像リンクも同時に表示させる「新ウインドウに表示2」の記事もあります。これはユーザーが新しいウィンドウを開くかどうかを選択できます。

JavaScriptを使ってtaget="_blank"のかわりにrel="external"を使う方法

HTMLのヘッダーでJavaScriptを読み込ませて、リンクを設置するときにtaget="_blank"のかわりに、rel="external"またはrel="external nofollow"を使う方法です。

function externalLinks() {
if (!document.getElementsByTagName) return;
var anchors = document.getElementsByTagName("a");
for (var i=0; i
var anchor = anchors[i];
if (anchor.getAttribute("href") &&
((anchor.getAttribute("rel") == "external nofollow") || (anchor.getAttribute("rel") == "nofollow external") || (anchor.getAttribute("rel") == "external")))
anchor.target = "_blank";
}
}
window.onload = externalLinks;

このコードを例えばexternal.jsという名前でドメインルート等に保存し、アップロードします。これを呼び出すには、HTMLヘッダー部で次のように記述します。

<script type="text/javascript" src="http://hogehoge.jp/external.js"></script>

これを使うにはリンク作成時にaタグ内でrel="external"、または、 rel="external nofollow" と書くだけです。

ここでは、onload を使っていますが、他でもonload を使っているとうまく働きません。onclick を使う方法もあります。詳しくは「Google +1ボタン」のページを見てください。

でも、自分の書いたコードではこれが適用できますが、広告の中のコードには適用することができません。グーグルや楽天アフィリエイトではコードを書き換えることが禁止されているからです。この方法も自己満足に過ぎませんね。知っていて損はないでしょう。