他のページへの文字リンクを作るとき、みなさんはどんな設定をしているでしょうか?
WordPressにはリンクを挿入する機能が備わっていて、簡単に新しいタブで開く設定もできます。
しかし、どのタイプのリンクが最適なのかを考えたことはあまりないかもしれません。
これを変えることで、アナリティクス等の集客データも多少変わってくるんですよ。
また、種類があるならそれをユーザに分かりやすく提示してあげることも必要ですよね。
というわけで、今回は新規タブで開くリンクのメリット・デメリットの紹介です。
その後に、実際にリンクの種類を伝えるためのアイコンの設置方法も見ていきましょう。
リンク先ページを新しいタブで開く メリット・デメリット
まずは念のために基本的なことから。
リンク先のページを開くときは下記の2種類のパターンがありますよね。
- 現在のタブで開く
- 新しいタブで開く
何も設定しない場合は、現在のタブで開くことになると思います。
これは今見ているページを閉じてリンク先のページを表示するということです。
一方、新しいタブで開く設定をしていると見ていたページを表示したまま、別のタブでリンク先を見ることになります。PCもスマホもです。
ページを移動するということ自体は同じなんですが、それぞれページ移動後のユーザーの動きは多少変わってきます。
リンクを新しいタブで開くメリット
基本的に外部リンクの場合は、新しいタブで開くことが多いです。
自分のページは開いておいたままの方が、サイトからの離脱率が低くなるという考えからです。ページの滞在時間も長くなるかもしれませんね。
前のページに戻れば当然もとの場所に戻れるんですが、次々とページを移動していくことを考えると元のページを別タブで残しておいた方がいいですよね。
リンクを新しいタブで開くデメリット
上記で紹介したメリットは単純に考えれば正しいんですが、スマホでページを見た場合に関しては少し考えを変える必要があります。
スマホにおいてリンクを新しいタブで開く動作はかなり煩わしいです。皆さんも経験あるんじゃないでしょうか?
スマホは、タッチ・スクロール・スワイプ等の直感的な動作でスムーズにネットサーフィンが出来ます。
簡単単純に操作できるからこそ、別のタブで開くちょっとした時間がとても鬱陶しく感じるんですよね。
コンテンツの内容にもよりますが、今は全体的にPCよりもスマホでネットを閲覧する割合が増えていますから、このようなスマホのユーザビリティも考慮する必要があります。
Simplicity 新しいタブで開くリンクにアイコンを付ける
メリット・デメリットを理解したうえで、結局両者を使い分ける人が多いです。
ですからページ制作者は少しでもユーザビリティを考え、リンクがどちらの種類か分かりやすく提示してあげる必要がでてきます。
WordPressのテーマ「simplicity」を使っている場合は便利な機能があります。
前にも紹介したアイコンフォント「FontAwesome」です。
これを使えば文字リンクの後ろに新しいタブで開くマークをつけられます。
文字リンクの後ろに下記のコードを付け加えるだけです。
<i class="fa fa-external-link"></i>
こんなマーク見たことありませんか?
サイトによって微妙な違いはありますが、これが新規タブで開くリンクのアイコンです。
最後に
どちらが良いということはなく、状況に応じてこの2つを使い分けるべきです。
自分のサイトのユーザー層から判断するのが良いと思います。(PC・スマホの扱いになれているかいないかなど)
そもそ扱いに慣れている人にとっては、どのタブで開くかを自分で指定することも出来るんですが、こうした細かな気配りの積み重ねが誰もが使いやすいサイト作りにつながりますね。