サイト内のページの途中にリンクを設定したり、ページの下部にリンクを設定する場合はページ内リンクを設定します。
以前は、name属性を使用しておりましたが、xhtmlからidを使用する形が主流です。HTML5のページ内リンクもidで設定しましょう。
ページ内リンクの設定
まず、リンク先のタイトルや見出しなどに、idを設定します。
下記のような形です。
<h2 id="pagelink">ページ内リンクとは?</h2>
次にリンクの設定します。
<a>タグのhrefのURLに、ページ内のid=”pagelink”の場所にリンクするようにidを設定します。
idは、#ですから、id=”pagelink” → #pagelink となります。
<a href="#pagelink">見出しの場所にリンク</a>
実際にリンクを設定してみました。
クリックすると
青い見出しの部分に戻ると思います。
ページ内リンクが設定できました。
リンクは、絶対リンクでも可能です。
<a href="https://www.beginnerweb.net/pagenailink#pagelink">見出しの場所にリンク</a>
当然、こちらも見出し部分にページ内リンクします。