WEBデザイン

【HTML】リンクの作り方と解説

リンクの作り方

リンクタグは、HTMLタグの一つで他ページに飛ばしたい時などに使われるタグです。

今回は、リンクタグの書き方を紹介します。

書き方

リンクはa href(エー エイチレフ)というタグで作成します。

HTML
<a href="リンク先のURL">テキスト</a>

これで指定のURLへのリンクが可能になります。

ここから少し応用編。

別タブで開く

上記の状態では、現在開いているタブにリンクさきが表示されますが、外部サイトなど別タブでリンク先を開かせたい時は、

HTML
<a href="リンク先のURL" target="_blank">テキスト</a>

このようにtarget=”_blank”をいれることで別タブでリンクが開きます。

セキュリティ対策の為に

target=”_blank”だけで別タブを開かせることは現在はセキュリティの観点から推奨されていません。

その為、別タブで開かせたい時は、rel=“noopener”を付けます。

HTML
<a href="リンク先のURL" target="_blank" rel="noopener">テキスト</a>

この記事では詳しい説明は省きますが、

おまじないのようなものとして、一緒に付けるようにしてください。

まとめ

今回は、リンクタグについて紹介しました。

内部リンクは同タブ表示、外部リンクは別タブ表示が一般的ではありますが、決まりは特にありません。

しかし、今回の記事で触れたように、外タブ(別窓)で開く場合は rel=”noopener”を忘れないでくださいね。

ABOUT ME
FreeLaDay管理人
FreeLaDay管理人
現役フリーランスによる情報サイト。 webデザインに関する知識などを主に、コラムやライティング術など、在宅ワークが充実するような楽しい記事も掲載中です。