ページ内リンクのやり方について紹介していきます。
記事の文量が多いとき、余計な説明はいらないから結論を知りたい人もいますよね。
そんな方へストレスなく目的の記事へジャンプしたい場合に便利なページ内リンクです。
ユーザビリティの向上になるので離脱を防げます。
目次
ページ内リンクとは
ページ内リンクとは、同じページ内で特定の場所へジャンプして移動するリンクのことです。
例えばアプリの使用方法を説明する記事を書いていたとして、すでにアプリをインストールしている人はインストールの説明を読む必要無いですよね。
そんなときは、インストールの説明をジャンプしてアプリの使用方法へ誘導して上げた方がユーザビリティがUPします。
次のリンクをクリックしてみて下さい。一番最後の見出しブロックへジャンプします。
さいごへ
ページ内リンクの作成方法
STEP
HTMLアンカーを設定する
- ジャンプしたい場所（例では見出し3へジャンプする）をクリックします。
- 右側のメニューを一番下までスクロールして「高度な設定」をクリックすると「HTMLアンカー」項目があります。
- 分かりやすい名前をつけて下さい。（ここではexampleとしました）
STEP
ジャンプ元のテキストを選択
ジャンプしたい元のテキストを選択し、リンクボタンをクリックします。
STEP
ページ内リンクを貼る
ページ内リンクを設定する。
Step1で設定したHTMLアンカーの先頭に#付け#exampleと記入し決定ボタンを押してください。
#example
STEP
完了
これでページ内リンクの完了です。
見出し3へのリンクをクリックすると、見出し3へジャンプします。
別ページの途中へリンク（ジャンプ）させる方法
別記事の途中にリンクさせたい場合もありますよね。
そんなときは、URL+#HTMLアンカーを指定すればOKです。
https://shimautablog.com/yubinbango-contactform/#yubinbangoさいごに
ページ内リンクの作成方法について説明しました。
とても簡単に設定できます。