HTMLのaタグ(アンカーリンク)は、ページ内にリンクを設置する際に使用します。本記事では、aタグを使ってテキストリンクを作る方法と、関連してよく使用される属性について解説します。
aタグ(アンカーリンク)とは?
aタグ(アンカーリンク)とはHTMLに記述するタグのことで、主にWebサイトのページ間にリンクを作るときに使用されます。aタグは「アンカーリンク」のほかに、「アンカータグ」や「リンクタグ」とも呼ばれることがあります。
aタグ(アンカーリンク)の使い方
aタグ(アンカーリンク)を使用してリンクを作るときは、次のように書きます。
<a href=”リンク先URL”>テキスト</a>
<a>〜</a>で囲んだテキストのことを「アンカーテキスト」と言い、リンク先ページを表す適切なテキストを設定できます。
href属性でリンク先を指定する
- 以下の「リンク先URL」の箇所にリンク先のURLを設定します。
- アンカーテキストをクリックすると、設定したリンク先に飛びます。
<a href=”リンク先URL”>テキスト</a>
次の例では「サイトエンジン」と書かれたテキストをクリックすると、指定したURL(サイトエンジンのWebサイトトップページ)に移動できます。
<a href=”https://www.siteengine.co.jp/”>サイトエンジン</a>
target属性でブラウザの新しいタブでページを開く
aタグ内にtarget属性を指定することで、リンクをクリックしたときにブラウザの新しいタブでページを開くことができます。target属性は以下のように「target=”_blank”」と書きます。
<a href=”リンク先URL” target=”_blank”>テキスト</a>
次の例では「サイトエンジン」と書かれたテキストをクリックすると、指定したURL(サイトエンジンのWebサイトトップページ)がブラウザの新しいタブで開きます。
<a href=”https://www.siteengine.co.jp/” target=”_blank”>サイトエンジン</a>
aタグ(アンカーリンク)のrel属性
aタグにはrel(レル)属性を指定できます。rel属性は現在のページとリンク先のページの関係を検索エンジンに伝えることができます。ここでは、rel属性の中でもよく使用されるnofollow(ノーフォロー)属性を紹介します。nofollow属性は次のような場合に使用します。
- そのリンクとサイトを関連付けたくない場合
- リンク先のページをサイトからクロールさせないようにする場合
リンク先のページにリンク評価を渡したくない場合に有効です。信頼できないページに対してリンクを設定する場合に使用しましょう。aタグ内には次のようにnofollow属性を指定します。
<a href=”リンク先URL” rel=”nofollow”>テキスト</a>
まとめ
aタグを使ってテキストリンクを作る方法と、関連してよく使用される属性について解説しました。記事を作成してリンクを設置する際は、ここで紹介したtarget属性やnofollow属性を使用してみてください。
関連記事