外部リンクのHTML設定方法｜リンク要素、rel属性の値についても解説

外部リンクとは、他のWebサイトに対して貼るリンクのことです。htmlではaタグを用いて設定し、サイトのSEO対策にも大きな役割を果たします。

当記事では、外部リンクのHTML記述方法について、aタグの使い方やリンク要素について詳しく解説します。

そもそも外部リンクとは

外部リンクとは？被リンク・発リンクの違いについて

外部リンクとは、Webサイト内に張られている別サイト（別ドメイン）へのリンクのことです。外部リンクは、外部サイトからリンクをもらう場合と、外部サイトにリンクを渡す場合それぞれで、呼び方を分けることがあります。

どちらも外部リンクであることには変わりなく、どちらのサイト側から見るかによって呼び方が変わります。

例えばサイトA（自サイト）からサイトB（外部サイト）へリンクを貼った場合、

• サイトAから見ると「発リンク」である
• サイトBから見ると「被リンク」である

ということになります。

内部リンクとの違い

一方で内部リンクとは、自サイト内のページ同士を繋ぐリンクのことです。

内部リンクによって、ユーザーにとって役に立つ他のページを示してあげたり、ページ同士の関係性をGoogleに示すことができます。

例えば以下のような場合、ページAに関連するページB・ページCが存在することが分かります。

• 自サイト内のページBから、ページAへの内部リンク
• 自サイト内のページCから、ページAへの内部リンク

Googleでは、この内部リンクについて以下のように記載しています。

• 通常は外部のウェブサイトの参照に関してリンクを検討しますが、内部リンクに使用するアンカー テキストにより注意を払うと、ユーザーや Google がサイトの内容を簡単に把握できるようになるとともに、サイト上の別のページを見つけやすくなります。
• 関心のあるすべてのページに、同じサイト上の少なくとも 1 つ以上の別のページからのリンクがあることが推奨されます。そのページの内容を読者に理解してもらうために役立つ、同じサイト上の別のリソースは何かについてコンテキストを踏まえつつ検討して、それらのページへのリンクを追加します。

出典：内部リンク: 自身のコンテンツの相互参照| Google検索セントラル

このようにサイトが見つけやすくなる効果があるので、内部リンクをうまく活用することによる効果があります。

関連記事：【SEO】内部リンクとは｜検索順位を上げるため内部リンク設置方法

外部リンクのHTML（aタグ）の記述方法

ここからは、自サイト内に外部リンクを設定するためのHTML記述方法について紹介します。

基本の書き方

自サイト内に外部リンクを張るときは、以下のように、aタグにhref属性とtarget属性を適用し、アンカーテキストを設定します。

aタグとは

外部リンクを設定する際のハイパーリンクを設定するタグのことで、anchor（※アンカー、錨（いかり）のこと）」の頭文字をとったものです。リンクの到達点を指定する意味があります。

href属性とは

hypertext reference（ハイパーテキスト リファレンス）の略称で、URLを指定することでそのURLへのハイパーリンクを指定するものです。

target属性とは

target属性とは、リンク先のページの表示領域を設定する属性のことです。aタグに対して「target属性」と「_brank」を付与すると、新しくウインドウが開き、新しいウインドウでリンク先のページが表示されます。

外部リンクを別ウインドウで表示させたい場合は、target属性を適用して「_brank」を記載します。

必要に応じてrel属性を付与する

外部リンクをHTMLで記述する際は、必要に応じて適切なrel属性を付与します。

rel属性とはrelationの略称で、Googleにリンク先との関係性を示すものです。rel属性に用いる値には、「sponsored」「ugc」「nofollow」といったものがあり、Googleではそれぞれ以下のように説明しています。

出典：Google に外部リンクの関係性を伝える | Google検索セントラル

以下のように、複数を使う場合はスペースで区切って設定します。

実際の使い分け方

実際にはどのようにrel属性を使用するのでしょうか。SEO対策を意識したメディアを運営している方は、「外部リンクは全てnofollowにするべき」という言葉を耳にしたことがあるかもしれません。

しかし、これに対する答えはNOです。Google公式ブログでも、「nofollowは情報提供元を信用していない場合のみに使用する」という記述があります。

nofollowは情報提供元を信用していない場合のみ使用し、すべての外部リンクに使用することは避けてください。たとえば、あなたが大好きなチーズを厳しく批判する記事を誰かが公開したので、あなたはこれに反論する記事を作成することにしましたが、外部リンクを張ることで、リンク先にランキング評価を与えたくありません。このような場合は nofollow を使用するのが適切です。

リンクに関して何かの形で支払いを受け取っている場合は、sponsored または nofollow でリンクを修飾してください。フォーラム セクションや Q＆A サイトなど、ユーザーがサイトにリンクを挿入できる場合も、ugc または nofollow を追加します。

出典：外部リンク: 別のサイトへのリンク | Google検索セントラル

好意的に引用したページ（コンテンツを作る上で参考にしたページ）やおすすめとして紹介している商品ページには、nofollowを付けない（＝dofollow）でリンクを張る、と覚えておきましょう。

noopenerとnoreferrerは不要

過去は、target=”_brank”を適用する際、rel=”noopener noreferrer”も併せて記載することが多かったです。

rel属性としてそれぞれ以下のような関係性を示す効果があります。

しかし現在のブラウザではnoopenerの対策はされており、記述は不要とされています。また、noreferrerも計測ツールなどで参照下を渡したくない場合以外は不要です。

適切なアンカーテキストって？

aタグで囲まれたテキストのことを「アンカーテキスト」と呼び、そのテキストを押下することで指定のURLへリンクさせることができます。

アンカーテキストには、指定したURLのタイトルや概要を記載します。ユーザーがそのアンカーテキストを読んで遷移したあとに、違和感がないことが大切です。つまり、クリックしてほしいがために誇張した表現にしたり、不自然にキーワードを使用することは避けるようにしてください。

適切に記載することでGoogleがサイトやページ内容を把握することができ、SEO効果も高まります。アンカーテキストを不適切に設定してしまうと、スパムリンクに該当してしまうこともあるので注意が必要です。

外部リンク先のURLに対して適切なテキストを設定しましょう。

可能な限り自然に記述し、リンク先のページに関連したキーワードを詰め込むことは避けてください（キーワードの乱用は、スパムに関するポリシーに違反することに注意してください）。次のページについて読者が理解するうえで、そのキーワードが本当に必要かどうかを考えます。アンカー テキストにキーワードを詰め込んでいると感じるなら、実際にそうである可能性が高いからです。

出典：効果的なアンカーテキストを記述する | Google検索セントラル

アンカー テキストが良好であるほど、ユーザーはサイト内のナビゲーションが容易になり、Google はリンク先のページ内容を把握しやすくなります。

出典：効果的なアンカーテキストを記述する | Google検索セントラル

外部リンクのSEO効果ってどれくらいあるの？

ここまで外部リンクのHTML記述方法について解説してきました。外部リンクは、SEOにおける重要な要素の一つと言われています。

外部リンクの獲得方法や期待できる効果については以下の記事で解説していますが、ここでも外部リンクの効果について簡単に紹介します。詳しく知りたい方は以下の記事をご覧ください。

関連記事：SEOにおける外部対策の効果や対策方法

被リンクによってインデックスされやすくなる

外部被リンクによって、検索エンジンのクローラーが自サイトを訪れる頻度が上がります。

クローラーは、クロール済みのページのリンクを辿って新たなページを検知して、ページをインデックスしていきます。

そのため、新たに公開したコンテンツにもクローラーが早く訪れる速度が上がりやすくなり、インデックスされやすくなる効果があります。

被リンクが多いと評価が上がりやすくなる

外部被リンクはサイト同士の推薦のように機能しており、役に立つページであるほど多くの被リンクを受け、価値のあるページとして評価が高まっていきます。

Googleが掲げる10の事実の「ウェブ上の民主主義は機能する。」という項目でも、以下のように記載されています。

Google 検索が成果を出し続けている理由は、何百万人ものユーザーがウェブサイトに張ったリンクを参考に、どのサイトが価値のあるコンテンツを提供しているかを判断しているためです。

出典：ウェブ上の民主主義は機能する。 | Googleが掲げる10の事実

ただし、これは良質な被リンクの場合です。被リンクの質が悪かった場合には、マイナスの影響が発生することもあります。

このような恣意的なリンクは質が悪いと見なされ、サイトの評価に悪影響を及ぼすスパムリンクと呼ばれることがあります。スパムリンクの例は以下のようなものがあります。

• ランキングを上げることを目的としたリンクの売買
• 過剰な相互リンク（「リンクする代わりにリンクしてもらう」）や、相互リンクのみを目的としてパートナー ページを作成する
• フォーラムでのコメントにおいて、投稿や署名の中に含まれる作為的なリンク

出典：Google ウェブ検索のスパムに関するポリシー | Google検索セントラル

発リンクによって信頼性が高まる

一見すると外部リンクは被リンクのみ効果がありそうですが、発リンクにも効果があります。Googleでは、発リンクを適切に利用することで自サイトの信頼性を高めることができるとしているのです。

• 他のサイトへのリンクを用意することは問題にはなりません。
• たとえば情報提供元を引用するなど、外部リンクを使用することで自分のサイトの信頼性を高めることができます。
• 外部サイトへのリンクを張ることが理に適うと判断した場合は、リンクとともに、リンク先を連想できるような文脈を提供します。

出典：外部リンク: 別のサイトへのリンク | Google検索セントラル

直接的にSEOに効果があるとは言い切れないものの、裏付けとなる文献や情報へ発リンクすることで信頼性が高まり、結果としてSEOへの良い効果が期待できます。

まとめ

HTMLの外部リンクにはSEO効果があり、特に被リンクについては獲得することで自サイトの評価が高まっていく効果があります。また発リンクについても、自サイトの信頼性を高める効果があります。

コンテンツを作成・管理する際には、情報の参照元に対して、適切に外部リンクを設定するようにしましょう。