日本語 English(Home)

aタグとは:リンクの書き方、href・rel・target属性とSEOでの注意点

aタグは、HTMLでほかのページやファイルへのリンクを作る要素です。基本の書き方と主な属性、ページ内・メール・電話・ダウンロードのリンク、Googleがリンクとして辿れる書き方、nofollowなどのrel属性の使い分け、リンク先の点検の方法を、MDNとGoogleの説明で整理します。

aタグとは:リンクの書き方、href・rel・target属性とSEOでの注意点

この記事の要点:

  • a タグ(a 要素、アンカー要素)は、HTML でリンクを作る要素です。<a href="リンク先のURL">リンクの文字</a> と書き、href 属性でリンク先を、開始タグと終了タグの間の文字(アンカーテキスト)でリンク先の内容を示します。
  • 主な属性は href・target・rel・download・hreflang です。href には、ほかのページの URL のほか、ページ内の位置(#)、メール(mailto:)、電話(tel:)も指定できます。
  • Google がリンクとして辿れるのは、通常、href 属性を持つ a 要素だけです。href の無い a 要素や、クリックの処理(onclick)だけで移動する書き方は、URL を確実に取り出せません。
  • rel 属性の nofollow・sponsored・ugc は Google にリンクの性質を伝える値で、noopener・noreferrer はブラウザーの動作に関わる値です。外部リンクのすべてに nofollow を付ける必要はありません。

aタグとは:リンクを作るHTMLの要素

a タグとは、HTML で、ほかのページやファイル、同じページ内の場所などへのリンク(ハイパーリンク)を作る要素です。正式には a 要素、またはアンカー要素と呼ばれ、「a」は anchor(いかり)の頭文字です。

MDN Web Docs(ブラウザーを作る Mozilla が公開している Web 技術の資料)は、a 要素を「href 属性を用いて、別のウェブページ、ファイル、メールアドレス、同一ページ内の場所、または他の URL へのハイパーリンクを作成します」と説明し、「<a> の内容は、リンク先を示すものであるべきです」と書いています(2026 年 10 月 13 日確認)。

部分書く場所役割
a 要素<a>〜</a>リンクであることを示す
href 属性開始タグの中リンク先の URL を指定する
アンカーテキスト開始タグと終了タグの間画面に表示され、リンク先の内容を読み手と検索エンジンに伝える
そのほかの属性開始タグの中開き方(target)、リンク先との関係(rel)などを指定する

a タグは、サイトの中のページをつなぐ内部リンクにも、ほかのサイトへの外部リンクにも使います。この記事では、要素の書き方と属性、検索エンジンに辿ってもらうための注意点に絞ります。

基本の書き方とhref属性

a タグの基本の書き方は、開始タグの href 属性にリンク先の URL を書き、開始タグと終了タグの間にリンクの文字を書く形です。

<a href="https://example.com/guide/">使い方の案内</a>

MDN によると、href には HTTP の URL だけでなく、ブラウザーが対応するさまざまな形式を指定できます。電話番号を示す tel:、メールアドレスを示す mailto:、ページの節を示すフラグメント(# から始まる部分)などです。

絶対URLと相対URL

href の URL は、「https://」から始まる絶対 URL でも、今のページを基準にした相対 URL でも書けます。MDN の例では、次のような相対 URL が示されています。

書き方種類意味
https://example.com/p絶対 URLスキームとドメインを含めた完全な URL
//example.com/pスキーム相対 URL今のページと同じスキーム(https など)で開く
/blog/p/オリジン相対 URL同じドメインのルートからのパス
p、./pディレクトリー相対 URL今のページと同じディレクトリーの中
../p親ディレクトリー相対 URL一つ上のディレクトリーの中

サイトの中のリンクは、ルートからのパス(/ から始まる形)にしておくと、ページの場所が変わってもリンク先がずれにくくなります。Google 検索セントラルの「Google のリンクに関するベスト プラクティス」は、Google が解析できる例として、絶対 URL(https://example.com)と、/products/category/shoes、./products/category/shoes のような相対 URL の両方を挙げています(最終更新日 2025 年 12 月 31 日、2026 年 10 月 13 日確認)。URL の各部分の呼び方は「ディレクトリとは」で説明しています。

主な属性:target・rel・download・hreflang

a タグでよく使う属性は、href のほかに、target(どこで開くか)、rel(リンク先との関係)、download(ダウンロードとして扱う)、hreflang(リンク先の言語のヒント)です。MDN の説明に沿って、役割をまとめます(2026 年 10 月 13 日確認)。

属性役割MDN の説明の要点
hrefリンク先の URLHTTP の URL のほか、tel:・mailto:・フラグメントなども指定できる
targetリンク先を表示する場所_self(今のタブ、既定)、_blank(ふつうは新しいタブ)、_parent、_top など
relリンク先との関係空白で区切ったリンク種別のリスト(nofollow、noopener など)
downloadリンク先をダウンロードとして扱う同一オリジンの URL と、blob:・data: のスキームでだけ動作する
hreflangリンク先の言語のヒント組み込まれている機能は無い
referrerpolicyリンクを辿るときに送るリファラー(参照元)の範囲既定は strict-origin-when-cross-origin

charset・name・rev・shape・coords は、MDN では非推奨の属性とされています。ページ内の場所を示すには、name ではなく、リンク先の要素の id 属性を使います。

target=”_blank” の使いどころ

target=”_blank” は、リンク先を新しいタブなどで開く指定です。MDN は、新しいタブやウィンドウを開くリンクでは、起動したときに何が起こるかを示すよう勧めています。読み上げの技術を使う人や認知に問題がある人は、予期せず新しいタブが開くと混乱することがあるためです。

安全面では、MDN は「target=”_blank” を <a> 要素に設定すると、暗黙的に rel の動作は rel=”noopener” が設定されたかのように動作」すると説明しています。古いブラウザーではこの保護が無いため、rel=”noopener” を明示しておくと、どのブラウザーでも同じ動作になります。

状況どうする理由
同じサイトの記事へのリンクtarget を付けない(今のタブで開く)読み手が戻るボタンで元のページに戻れる
入力中のフォームがあるページからのリンク新しいタブで開き、その旨をリンクの文字に添える入力内容を失わないため
PDF などのファイルへのリンクファイルの種類をリンクの文字に添えるMDN が、HTML 以外のリソースへのリンクは何が起こるかを示すよう勧めている

リンクの種類:ページ内・メール・電話・ダウンロード

a タグは、ほかのページへのリンクのほか、同じページ内の場所、メールの作成、電話の発信、ファイルのダウンロードにも使えます。href に書く値と、必要に応じて付ける属性で使い分けます。

リンクの種類書き方の例注意点
ページ内の場所<a href="#faq">よくある質問</a>(リンク先の要素に id=”faq”)MDN によると、href=”#top” や href=”#” はページの先頭へのリンクになる
メール<a href="mailto:info@example.com">メールで問い合わせる</a>メールのプログラムが開く。アドレスがページに表示される
電話<a href="tel:+81312345678">03-1234-5678</a>携帯電話では発信、パソコンでは電話のアプリが開くなど、端末で動作が違う
ダウンロード<a href="/files/guide.pdf" download>資料(PDF)</a>download は同じオリジンの URL などでだけ動作する

上の表のアドレスと電話番号は説明用の例です。ページ内リンクは、長い記事の目次などに使われます。リンク先の見出しには、内容の分かる id(例:id=”faq”)を付けておくと、どこへのリンクかが HTML を見ただけで分かり、管理しやすくなります。目次の作り方と、リンクしても移動しないときの直し方は「アンカーリンクとは」にまとめています。

SEOで気をつけること:Googleが辿れるリンクの書き方

Google にリンクを辿ってもらうには、href 属性を持つ a 要素で、実際にアクセスできる URL を指定します。Google 検索セントラルの「Google のリンクに関するベスト プラクティス」は、次のように書いています(2026 年 10 月 13 日確認)。

「通常、リンクが href 属性を持つ <a> HTML 要素(アンカー要素とも呼ばれます)である場合のみ、Google はリンクをクロールできます。その他のフォーマットのリンクのほとんどは解析されず、Google クローラーにより抽出されません。」

書き方Google の扱い(公式の説明)
<a href="https://example.com">推奨(解析可能)
<a href="/products/category/shoes">推奨(解析可能)
<a href="/products/category/shoes" onclick="...">推奨(href があれば onclick があっても解析可能)
<a routerLink="products/category">非推奨(解析を試みることはある)
<span href="https://example.com">非推奨
<a onclick="goto('https://example.com')">非推奨
<a href="javascript:goTo('products')">非推奨(URL に解決できない)

同じページは、JavaScript でリンクを後から挿入する場合でも、上の推奨の HTML の形で出力されていればクロールできると書いています。

MDN も、href を # や javascript:void(0) にしてクリックの処理だけで動かす書き方を「よく見られる誤った使い方」とし、ボタンの役割には button 要素を使うよう勧めています。リンクは移動のため、ボタンは操作のため、と使い分けると、検索エンジンにも支援技術にも意図が伝わります。

Googleがリンクを使う目的

Google は、ページの関連性を判断し、クロールする新しいページを見つけるためにリンクを使います。同じページは、関心のあるすべてのページに、同じサイトの少なくとも 1 つ以上の別のページからのリンクがあることを勧めています。どのページからもリンクされていないページは、見つけてもらいにくくなります。クローラーの仕組みは「クローラーとは」で説明しています。

rel属性の使い分け:nofollow・sponsored・ugc・noopener

rel 属性の値は、Google にリンクの性質を伝えるもの(nofollow・sponsored・ugc)と、ブラウザーの動作を決めるもの(noopener・noreferrer)に分かれます。通常のリンクには、rel を付ける必要はありません。

Google 検索セントラル「Google にアウトバウンド リンクの関係性を伝える」は、Google に無条件でフェッチと解析をさせる通常のリンクには rel 属性を追加する必要が無いとしたうえで、次の値を説明しています(最終更新日 2026 年 3 月 8 日、2026 年 10 月 13 日確認)。ブラウザーの動作に関わる値は MDN の説明です。

値意味使う場面
sponsored広告や有料プレースメントのリンクお金などの対価を受けて張るリンク
ugcユーザー作成コンテンツのリンクコメント欄・フォーラムの投稿の中のリンク
nofollowそのリンクとサイトを関連付けたくない、リンク先をサイトからクロールさせたくないほかの適切な値が無く、リンク先を信用していないとき
noopener新しいタブなどで開いたページから、元のページを操作させないtarget=”_blank” を使うとき(古いブラウザーへの備え)
noreferrerReferer ヘッダー(参照元)を送らない。noopener と同じ効果もあるリンク先に参照元を伝えたくないとき

Google は、自分のサイト内のページへのリンクを Google にフェッチさせたくない場合は、nofollow ではなく robots.txt の disallow ルールを使うよう案内しています。複数の値は、rel="ugc nofollow" のように空白かカンマで区切って書けます。

「Google のリンクに関するベスト プラクティス」は、nofollow は情報提供元を信用していない場合のみ使い、すべての外部リンクに使うことは避けるよう書いています。外部リンクの張り方と rel の判断は「外部リンクとは」で詳しく説明しています。

アンカーテキストとアクセシビリティ

a タグの開始タグと終了タグの間に書く文字(アンカーテキスト)は、リンク先の内容が分かる具体的な言葉にします。Google は、良いアンカーテキストを「内容が具体的で、適度に簡潔で、テキストが掲載されているページとリンク先のページの両方に関連があるテキスト」と説明し、「こちら」「詳細」のような大雑把な文字を悪い例に挙げています。

画像をリンクにする場合、Google は img 要素の alt 属性をアンカーテキストとして使います。a 要素が空の場合は、title 属性の値がアンカーテキストとして使われることがあるとも書かれています。

書き方Google・MDN の説明
<a href="/products">こちら</a>悪い例。文脈から外れるとリンク先が分からない
<a href="/products">私たちの製品について</a>良い例。文字だけでリンク先が分かる(MDN)
<a href="/cart"><img src="…" alt=""></a>悪い例。代替テキストもリンクの文字も空
リンクを隙間なく並べる悪い例。読者がリンク同士を見分けにくい(Google)

MDN は、支援ソフトウェアにはページのすべてのリンクを一覧にする機能があり、リンクの文字だけで行き先が分かることがすべての利用者の役に立つと説明しています。タッチ操作のための大きさとして、リンクのような対話的な要素は少なくとも 44×44 CSS ピクセルが推奨されているとも書いています(文章中の文字だけのリンクは除く)。アンカーテキストの書き方と避けたい例は「アンカーテキストとは」で詳しく説明しています。

リンクの点検方法と、当サイトのaタグの集計

a タグのリンク先は、公開後に移転や削除で変わるため、定期的に状態を確かめます。点検では、リンク先の HTTP ステータス コードを取得し、200(正常)以外のものを人が確かめます。

  1. 本文の a タグの href を、内部リンクと外部リンクに分けて一覧にします。
  2. それぞれの URL のステータス コードを取得します。リダイレクトは、転送先まで辿った結果も記録します。
  3. 404 などの URL は、新しい URL があれば直し、無ければリンクを外すか注記します。
  4. リダイレクトする URL は、転送先の URL に直します。転送先が内容の違うページでないかも確かめます。
  5. 403 などで自動の取得が断られる URL は、人がブラウザーで開いて確かめます。

当サイトの点検結果

当サイト(seoagent.jp)では、2026 年 10 月 13 日に、全 127 記事の本文の外部リンク 326 URL(重複・コード例を除く)のステータスを取得しました。200 が 293、リダイレクトの後に 200 になるものが 27、403 が 5、名前解決できないものが 1 でした。完全なリンク切れは 1 件でしたが、公式ドキュメントの構成変更によるリダイレクトが 27 件あり、24 URL を転送先に直しました。点検の手順の詳細は「リンク切れとは」で説明しています。

あわせて、記事の原稿のデータ(同じ日の時点で公開している 145 記事の本文)にある a タグを数えた結果は次のとおりです。

項目結果
a タグの数2,682
サイト内へのリンク(/ から始まる href)1,737(1 記事あたり約 12)
外部リンク(https から始まる href)945(重複を除くと 343 URL)
href の無い a タグ・mailto:・tel: のリンク0
rel 属性・target 属性を付けたリンク0
文字が空、または「こちら」だけのリンク0
アンカーテキストの長さの平均約 19 字

本文の外部リンクは公式の資料の出典が中心のため、rel を付けず通常のリンクにしています。一方、ニュース記事の「提供元」のリンクなど、テーマ(ページのひな形)が出力するいくつかのリンクには、rel="noopener" target="_blank" を付けています。

よくある質問

aタグとアンカーテキストの違いは何ですか?

a タグはリンクを作る HTML の要素そのもので、アンカーテキストは a タグの開始タグと終了タグの間に書く、画面に表示されるリンクの文字です。a タグの中に href などの属性とアンカーテキストが含まれる、という関係です。

target=”_blank” は付けるべきですか?

付けるかどうかは場面で決めます。同じサイトの記事へのリンクは、戻るボタンで戻れるよう付けないのが一般的です。新しいタブで開く場合は、その旨をリンクの文字に添えます。MDN によると、新しいブラウザーでは target=”_blank” に noopener と同じ保護が働きます。

外部リンクには必ずnofollowを付けますか?

付ける必要はありません。Google は、通常のリンクには rel 属性は不要とし、nofollow は情報提供元を信用していない場合のみ使い、すべての外部リンクに使うことは避けるよう書いています。広告のリンクには sponsored、利用者の投稿の中のリンクには ugc を使います。

JavaScriptのonclickだけのリンクはGoogleに辿られますか?

確実には辿られません。Google は、href 属性の無い a 要素や、スクリプトのイベントでリンクとして動く要素からは URL を信頼できる形で取り出せないと説明しています。href に実際の URL を書けば、onclick があっても解析できます。

SEOAGENTでできること

SEOAGENT は、自社サイトで記事を作る企業向けの記事制作の支援ツールです。内部リンクの機能では、記事ごとのリンクの出入りを表で確かめ、どの記事のどの段落から、どの言葉でリンクすると役に立つかの提案と理由を確認できます。どの記事からもリンクされていない記事は、表を「被リンク0だけ」で絞り込むと見つけられます。

選んだリンクは、まず SEOAGENT の中の原稿に入り、WordPress への反映は記事の更新・公開の操作で行います。自動で大量のリンクを公開サイトに入れる機能ではなく、数えるのは本文の中のリンクだけです(メニュー・フッターなどは含みません)。検索順位を保証するものではありません。

サイトの仕組みに関するほかの記事は「テクニカルSEOの記事一覧」にまとめています。

参考情報

関連する記事

「テクニカルSEO」の記事をすべて見る →

クロールバジェットとは:Googleの説明と、気にすべきサイト・しなくてよいサイト
テクニカルSEO

クロールバジェットとは:Googleの説明と、気にすべきサイト・しなくてよいサイト

クロールバジェットは、多くのサイトでは気にする必要がありません。Google の「クロール バジェットの管理」の原文に沿って、決まる仕組み、対策が必要なサイトの目安、クロールの統計情報での確かめ方、クロールを無駄にする原因と対処を、当サイトの点検結果とあわせて説明します。

AIでSEO対策を、もっと続けやすく。

機能と使い方、料金・契約条件は、サービス資料でご案内します。