ターゲットブランクタグによるリンクとは

今回はターゲットブランクによるリンク効果についてです。

ターゲットブランク( target=”_blank”)は各リンクについているタグで、別ウィンドウで開くために使用します。

どんな風についてるかというと、詳しくはこちらの「画像リンクの仕組み・altタグの重要性」あたりも参照ください。

<a href="https://29college.biz/" target="_blank">ここにテキストや画像が入る</a>

このような感じで、通常のリンクは出来ていますね。

別ウィンドウで開くか、同じウィンドウで開くか

簡単に説明すると

 target="_blank"

が付いていると、そのリンクをクリックした時に違うタブで開きます。

逆に付いてないと、同じタブで開くようになります。

どのような使い分けがいいかというと、
外部リンクの場合は、すぐ自分のサイトに戻ってこられるように別タブで( target=”_blank”)でリンクを付ける。
内部リンクの場合は、邪魔くさくならないように( target=”_blank”)を外してリンクを付けるといった形が基本です。

必ずどっちがいいとは言い切れませんが、別タブで開くかどうかを、うまく使い分けて下さい。

「ターゲットブランク 使い分け」で検索

スマートフォンサイトの場合のターゲットブランク

スマートフォンサイト最適化の勧めです。

実際スマホを使ってる人はわかると思いますが、スマホブラウザで別ウィンドウで開かれると、逆に戻って来にくくなります。

よって、スマホサイトでは、
外部リンクであっても同じウィンドウで開かせる事が、ユーザビリティの向上につながります。

ただ、PCサイトでは、外部リンクはターゲットブランク( target=”_blank”)でリンクを付けたい…。
という時に。

スマホ用のテーマにだけ、細工をしましょう。

wptouchのテーマのfunction.phpに以下のタグを追加すれば、サイトの中にあるターゲットブランク( target=”_blank”)をすべて無効化できます。
これはスマホのテーマにだけ適用されるため、PCサイトではそのままになります。

// target="_blank" の削除
function remove_target_blank($content) {
    return str_replace(' target="_blank"', '', $content);
}
add_filter('the_content', 'remove_target_blank');

以上のコードを全コピーして、function.phpに貼ってください。
貼る場所はPHP内でないとバグるので気を付けて下さいね。

あと、サイト内のターゲットブランクが
「 target=”_blank”」
となってないと、効果ありません。

変にスペースが入っていて、
「 target =”_blank”」
とかだとダメなんで、その場合はコードもうまく変えて下さい。

投稿日:2014年12月5日(金) 04:52

コメントを入力

You must be logged in to post a comment.

TOP