初心者向け：HTMLなしでもページ内リンクで見出しジャンプを作る方法

Webライターとして記事を書いていると、読者が見たい箇所に簡単にジャンプできるページ内リンクを設定したくなることがあります。初心者でも、HTMLを直接使わずに簡単にリンクを作る方法があります。本記事では、非WordPress環境でも実現できる方法を解説します。

ページ内リンクの基本概念

ページ内リンクは、同じページの特定の見出しや位置に飛ばす仕組みです。HTMLでは通常、<a href="#id名">と<h2 id="id名">を使って設定します。

この仕組みを理解しておくと、HTMLを直接書ける環境では手軽に見出しジャンプを作れます。

最近のエディタやCMSには、HTMLを知らなくてもページ内リンクを作れる機能があります。たとえば、見出しを選択すると自動でアンカーが生成されるエディタや、リンク設定から見出しを選択するだけでジャンプリンクを作れるツールがあります。

また、Markdown形式のエディタでは、見出しを# 見出しのように書くだけで、リンク用のアンカーを自動生成する場合があります。

例えば、記事の目次を作成し、それぞれの見出しにジャンプリンクを設定する方法です。読者は目次のリンクをクリックするだけで、該当の見出しに飛べます。

これはHTMLを直接書かなくても、エディタのリンク機能を使えば初心者でも簡単に設定可能です。

HTMLでページ内リンクを設定する場合は、見出しにユニークなIDを付与し、リンク先のhref属性に同じIDを指定します。
例：<a href="#section1">見出し1へ</a>と<h2 id="section1">見出し1</h2>

ID名はページ内で重複しないように注意する必要があります。

初心者でも、ページ内リンクで見出しにジャンプさせることは可能です。HTMLを直接書く方法と、エディタやMarkdownの自動アンカー機能を利用する方法があります。記事作成と並行してリンク設定を行うことで、読者にとって見やすく、ナビゲーションしやすい記事を作ることができます。