アンカーリンク(aタグ)とは？種類や使い方のポイントを解説

更新日 2024年11月3日（公開日 2017年2月15日）

みなさんは、アンカーリンクについて聞いたことはありますか？実は、ホームページを作成する際や、SEO 対策をする際にとって非常に重要なんです。

アンカーリンク（aタグ）は、ウェブページ内または異なるウェブページへのリンクを作成するために使われる HTML要素です。これにより、特定のページセクションや外部リソースに直接リンクすることが可能になります。

訪問者が見つけたい情報をすぐ見つけられるようにするためにアンカーリンクを正しく使いましょう。この記事では、このアンカーリンクについて使い方と設定方法を解説します。クリックひとつで読者を目的の場所へと誘導する、便利なアンカーリンクについて、使い方をしっかり押さえましょう。

目次

アンカーリンクとは？

アンカーリンクの種類と使い方

　01. 【href 属性】

　02. 【id 属性】

　03. 【target 属性】

　04. 【nofollow 属性】

　05. 【alt 属性】

Wix の アンカーリンク機能

　01. パーツや文字をリンクする

　02. アンカーメニューを利用する

　03. Wix でアンカーリンクを設定する方法

アンカーリンクの SEO 効果とは？

アンカーリンク活用のポイントと注意点

　01. リンクの色は青色にする

　02. アンカーに使うテキストは具体的にする

　03. 過剰なリンクの詰め込みに注意

まとめ

アンカーリンク（Anchor link）とは、クリックすることでホームページ内の指定の場所に移動することができるリンクのことです。ページ内リンクとも呼ばれます。

アンカー(Anchor)には、英語で「錨（いかり）」または「固定する」という意味があります。たとえば、「トップへ戻る」ボタンや、「目次」のリンクなどの、アンカーリンクを設置することで、ユーザーが必要な情報にすばやくジャンプすることができます。

他にも、Wikipedia では文字にリンクを追加し、目的の項目に誘導する「テキストアンカー」など、さまざまなアンカーリンクの種類があります。 特に、スマホ表示用の縦に長い Web デザインを採用するホームページでは、ユーザーがページの一番下までたくさんスクロールする必要があるかもしれませんが、そんな面倒を避けることができます。

アンカーリンクは、ユーザビリティ向上と SEO に有益な重要ツールです。href 属性を使えば、HTML を編集して、特定 URL をテキストやボタンにリンクすることができます。id 属性でページ内移動を簡単にし、ユーザー体験を高めましょう。HTML の容易な変更で、視覚的にも機能的にも効果的なリンクを設計できます。

HTML を編集してアンカーリンクを追加するには、二つの方法があります。

まず、href 属性についてです。a タグの基礎となるこの属性は、リンク先の URL をを特定のテキストにリンクを追加することができます。たとえば、以下のコードは特定の URL をにテキストリンクとして設定します。　

HTMLコード例：<a href="https://example.com/">表示テキスト</a>

次に、id 属性です。これはページ内の特定位置へリンクする際に用います。セクションを区別するための目印として、目次リンクやページ内ジャンプに欠かせません。

下記のように、id 属性をページの特定のセクションに追加します。

HTMLコード例：<a id="section1"></a>

その後、通常の a href 属性と同様に、先ほど設定したセクション ID を、＃（ハッシュタグ）の後に記入し、リンクしたいテキストを以下のように追加します。

HTMLコード例：<a href="#section1">表示テキスト</a>

アンカーリンクには他にも重要な属性があります。target 属性では、リンクが別タブで開くか同じタブで開くかを指定します。これはユーザーの利便性を左右します。

HTMLコード例：<a href="https://example.com" target="_blank">新しいタブで開く</a>

この、nofollow 属性は、検索エンジンにこのリンクを追跡しないよう指示するものです。SEO 戦略で用いる場合が多いです。

HTMLコード例：<a href="https://example.com" rel="nofollow">フォローしないリンク</a>

alt 属性は通常画像に関連します。また、リンクが画像の場合にも重要です。アクセシビリティを高め、画像の内容およびリンクがユーザーとサーチエンジンに正確に伝わります。

Wix を利用すれば、プログラミングの知識がなくても直感的にアンカーリンクを作成可能です。エディタで簡単に対象セクションを選びリンク設定するだけで、ユーザーの希望する行き先にスムーズに誘導できます。

 指定したアンカーへ、テキストやボタンをリンクすることができます。パーツをアンカーにリンクすることによって、サイト訪問者がそのパーツをクリックすると、指定したアンカー位置へジャンプします。

例えば、サービス紹介のページで特定のサービスについて詳しく説明したい時や、よくある質問の回答を記載する際など、情報を１カ所にまとめて記載したくない時に使用頂けます。

 下記のようなアンカーメニューを使うことで、サイト上の異なるセクションをクリック1つでアクセスできるようになります。アンカーメニューはサイト訪問者がページを閲覧する際、常に表示されます。

最後に、Wix エディタでアンカーリンクを設定方法をご紹介します。

アンカーリンクを設定したら、あとはリンク先の URL や見出しを追加すれば完了です。

リンク先を追加するには以下の方法をお試しください。

アンカーリンクは、ユーザーエクスペリエンス向上だけでなく、SEO（検索エンジン最適化）にも大きな影響を与える重要な要素です。ここでは、アンカーリンクが SEO に与える具体的な効果を解説します。

これらのポイントを念頭に置き、アンカーリンクを効果的に活用することで、 Web サイトの SEO 効果を大幅に強化することができます。

アンカーリンクを効果的にかつ、便利に設定するためには、以下の3つのポイント必ず実行しましょう。

伝統的にウェブページ上でリンクが挿入されている文字は青色で表示されることが多いため、直感的にユーザーにリンクが挿入されていることを示すことができます。したがって、アンカーリンクの色を青色にすることは、ユーザー体験を改善する上で効果的です。明るめの青色に設定することで、他の文字と区別し目立つようにしましょう。また、アンカーリンクに下線を追加することもおすすめです。

アンカーリンクを追加した文字のことを、「アンカーテキスト」呼びます。アンカーテキストは、ユーザーにこのリンクをクリックすることで何が起こるのか、具体的に説明する文字である必要があります。

ユーザーだけでなく、サイトをクロールする Google もアンカーテキストを利用してページの内容を把握します。そのため、アンカーテキストには、SEO キーワードを含めることで、Google にページの内容を理解してもらいやすくなります。

アンカーリンクの設置は、簡単にできる上に多くのメリットがあります。ただし、過剰なアンカーリンクの使用や不自然なキーワードの詰め込みは避けるべきです。それは逆効果になる可能性があり、検索エンジンによるペナルティの対象になることもあります。常にユーザーのニーズを最優先に考え、自然な形でアンカーリンクを組み込むことが大切です。

この記事では、アンカーリンクとはについて詳しく解説しました。正しく設定されたアンカーリンクは、ユーザーが求める情報に素早くアクセスできるようにし、ウェブサイトの全体的なユーザーエクスペリエンスを大幅に向上させます。また、SEO の観点から見ても、非常に重要な内部 SEO 施策の一つです。

アンカーリンクを効果的に活用し、ユーザーエクスペリエンスとSEOの双方を向上させましょう。これらのアンカーリンクのポイントを活用して、より効果的な Web サイトを構築する準備はできましたか？

今こそ、Wix で自分だけのホームページを作成し、これらのアンカーリンクのテクニックを実践してみましょう。Wix ならアンカーリンクの設定もシンプル。ホームページを強化するためのさまざまな SEO ツールもぜひお試しください。

おすすめ関連記事

編集者：Miyuki Shimose

SEO＆ブログコンテンツマーケター