【ブロックエディタ】記事の途中にジャンプする！ページ内リンクの作り方

この記事を書いた人

ブログで記事を書いていると、こんなことを思うことありませんか？

• ここの内容って知っている人は必要ないから、飛ばして途中から読めるようにしてあげたいな
• ここの説明さっきと一緒だから、記事の前の部分に飛べるようにしたいな

これは「ページ内リンク」や「記事内リンク」と言うもので解決できます。

例えばこんな感じのやつです。

⇨　ここをクリックして記事の最初へ

ブログを読んでいるとこんなリンクが貼ってあって、記事内の好きな場所に飛ぶことができるようになると思います。

この記事はページ内リンクの作り方を詳しく写真付きで解説していきます！！

この記事を最後まで読むと、誰でも簡単に手軽にページ内リンクを設置することができるようになります！

この記事ではブロックエディターの方法を紹介します！
クラッシックエディターの方はサルワカさんのこちらのページをご覧ください！

ページ内リンクの書き方

ブロックエディターの場合、めちゃくちゃ簡単にページ内リンクを設置することができます。

ザックリ言うと、以下の手順でページ内リンクを設置できます。

これだけではわからない方も多いと思うので、写真付きで詳しく解説していきます。

Step1：ジャンプ先にリンクを設置する

まずはここに飛びたい！というブロックに「HTMLアンカー」を設置していきます。

簡単なので安心してくださいね！！

Step2：ジャンプボタンを作成

ジャンプボタンは普通にいつも通りに設置して構いません。

ただ、リンクを作成するとき先頭に『＃』をつけるようにしてください。

以上でボタンを設置することができました！！

もちろんテキストリンクだけでなく、ボタンブロックなどでも作成できます。

応用編：違うページの途中に飛ばしたい！

この技を使えば、違うページの途中にもジャンプさせることができるようになります。

こちらも意外と簡単なのでやってみましょう！！

ページ内リンクのデメリットは滞在時間が短くなること

ページ内リンクは、ユーザビリティが向上する反面、滞在時間が短くなるデメリットがあります。

ただ、Googleではユーザーがいち早く必要な情報を手に入れることを目標にしており、滞在時間が短く検索を終了した場合、SEO的にメリットになります。

逆に滞在時間が長く、ユーザーがそのまま検索を続けた場合は長く滞在したのに必要な情報が見つからなかったとしてSEO的にマイナスになるので注意しましょう！！

滞在時間が短くなると筆者側はちょっと嫌な気もしますが、SEO的にはメリットになるので積極的にページ内リンクを設置していきましょう！

Googleではユーザーが検索を終了したら必要な情報が手に入ったと認識するよ！！

まとめ：読者にとってより快適なページを目指そう！

いかがでしたか？？ページ内リンクの設置方法が理解できましたか？？

最後にこの記事の内容をまとめていこうと思います！

ページ内リンクはSEO的にもいいことがありますし、ユーザーも読みやすくなります積極的に利用していきましょう！！