a タグエレメント

ページ内リンク

　ハッシュ#をつけるとページ内リンクです。
　以下のようなリンクに加えて、#の移動先のエレメントに id 属性を設定しておきます。
　移動先の id には#は付けません。

<a href="#EXAMPLE">ページ内のリンク</a>

<section id="EXAMPLE">ページ内のリンク</section>

　ページ内リンクと他のページへのリンクは組み合わせることができます。組み合わせるとそのページの#で指定した位置に移動します。

<a href="example_page.html#EXAMPLE">他のページの指定位置へのリンク</a>

絶対指定と相対指定

　URLには、絶対指定と相対指定が使えます。

　絶対指定は、https://example.net/といったドメイン名から指定するような指定方法です。
　他のサイトへの指定に使用されます。自サイト内では <base> に使用される場合があるでしょう。自サイト内では多くの場合、相対指定のリンクを使用します。

<a href="https://www.smpl-rfrns.net/HTML/a.html">URLの絶対指定</a>

　相対指定は、リンクのあるページからの位置になります。
　そのファイルと同じディレクトリ内のファイルやディレクトリを指定するには./、ひとつ上のディレクトリは../といった指定です。

<a href="example.html">URLの相対指定</a>

　例えば上記の例は、このページと同じディレクトリ内の example.html へのリンクです。こちらの指定方法がよく使われると思います。

CSS、styleについて

　<a> エレメント、リンクテキスト特有の下線の消し方や色、カーソルがのったとき、訪問済みリンクの装飾をCSS、styleで変更することができます。

　例えば a タグエレメントの文字色を黒、下線を非表示に、ポインターが来たら指定の色で下線を表示するには以下のようにします。

a {
	color: black;
	text-decoration: none;
}

a:hover {
	color: #0000ee;
	text-decoration: underline;
}

　詳しくは、リンク <a> とスタイルを参照してください。

外部リンクへの配慮

　検索ロボットにフォローしてほしくない外部リンクやサイト内リンクは rel 属性に nofollow を指定します。

<a href="example.html" rel="nofollow">フォローを無効にしたリンク</a>

　nofollow に指定することで検索ロボットはそのリンクを辿らないようにします。

JavaScript

　JavaScript で <a> エレメンを利用する場合は、 HTMLAnchorElement インターフェイスも参照するとよいでしょう。

<a href="javascript:void(0);">このリンクは遷移が無効になります。<a>

window.location.href = 'URL';

window.open('URL', '_blank');