閉じる

ページ内リンクとは?

サイト内のページの途中にリンクを設定したり、ページの下部にリンクを設定する場合はページ内リンクを設定します。

以前は、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>

当然、こちらも見出し部分にページ内リンクします。

見出しの場所にリンク

ピックアップ記事

  1. reCAPTCHA
    ホームページを公開すると設置したメールフォームに海外からスパム投稿され大量の迷惑メールが届くことがあ…
  2. 日本語設定
    Google Search Console(サーチコンソール ※旧WEBマスターツール)内のメニュー…
  3. PHPフレームワークのLaravel(ララベル)のサポート期限とサポートされているPHP バージョン…
ページ上部へ戻る