【UX向上】内部リンクと外部リンク（画像）の開き方使い分け術

内部リンク・外部リンク・画像リンクの最適な開き方｜Cocoon初心者向けUX改善ガイド

WordPressで記事を書くとき、リンクの貼り方は読者の体験（UX：ユーザーの利便性）に大きく影響します。
特に 内部リンク（サイト内リンク）、外部リンク（他サイトへのリンク）、画像リンク（画像をクリックして移動するリンク） の使い分けを正しく設定することで、読者の迷いが減り、SEOにも良い影響があります。

Cocoonではリンクの開き方を簡単に設定できますが、初心者向けサイトでは「どれを新しいタブで開くべきか？」がわかりにくいという声が多いです。

この記事では、内部リンク・外部リンク・画像リンクの最適な開き方と、Cocoonでの設定方法を初心者向けにわかりやすく解説します。

初心者の方でも、この記事を参考にサイト作成を進める手助けになれば幸いです。

こうしたトラブルは、WordPressの基本操作＋Cocoonの仕様を理解すればすべて解決できます。

この記事では、初心者でも迷わず設定できるように内部リンク・外部リンク・画像リンクの設定方法を解説し、さらに 実際に私が遭遇したトラブルとその解決方法も紹介します。

内部リンク・外部リンク・画像リンクの違い（初心者向けのやさしい説明）

私もWordPressを使い始めのころ、下記リンクの使い分けを知りませんでした。

まずはそれぞれのリンクの役割を下記に記載しました。

• 内部リンク：サイト内の記事へ移動するリンク。
• 外部リンク：他のサイトへ移動するリンク。
• 画像リンク：画像をクリックすると別ページへ移動するリンク。

この3つは目的がまったく違うため、開き方も変える必要があります。

内部リンクは“同じタブで開く”のが最適（UX向上）

私の過去の経験より、初心者向けサイトでは、内部リンクは 同じタブで開くのが最適です。

理由
メリット：同じタブで開くと、読者は「サイト内を移動している感覚」になります。スマホでは「同じタブの方がストレスがありません。」
デメリット：新しいタブが増えると、初心者は混乱しやすくなります。スマホでは「タブが増えると戻りづらくなります。」

サイトの回遊率が上がる

• 内部リンクはサイト内の導線です。
• 同じタブで開くことで、自然に記事を読み進められます。

SEOにもプラス

• 内部リンクはサイト構造をGoogleに伝える重要な要素です。
• 読者が自然に回遊することで滞在時間が伸び、SEOにも良い影響があります。

外部リンクは“新しいタブで開く”のが最適（離脱防止）

外部リンクは 新しいタブで開く のが最適です。

理由は以下の通り。

読者があなたのサイトに戻りやすい

外部サイトに移動すると、読者は戻るボタンを押す必要があります。
初心者は戻り方がわからず、そのまま離脱することがあります。

新しいタブで開けば、あなたのサイトはそのまま残ります。

読者の離脱を防げる

外部リンクを同じタブで開くと、あなたのサイトから完全に離れてしまいます。
新しいタブなら、読者はあなたのサイトを閉じません。

UX（ユーザーの利便性）が向上する

初心者は「どこから来たか」を忘れやすいです。
新しいタブなら迷わず戻れます。

信頼性が上がる

外部リンクは「補足情報」なので、別タブで開く方が自然です。

画像リンクの最適な使い方（内部・外部で使い分ける）

画像リンクは、内部リンク・外部リンクのどちらにも使えます。
しかし、画像リンクは「視覚的な誘導」になるため、使い方を間違えると読者が迷います。

内部リンクの画像は“同じタブ”

画像をクリックしてサイト内を移動する場合は、同じタブが自然です。

外部リンクの画像は“新しいタブ”

画像リンクは視覚的に強い誘導になるため、外部サイトへ移動する場合は新しいタブで開く方が最適です。

画像リンクで注意すべき点

• 画像リンクは「どこへ飛ぶか」がわかりにくい。
• 外部リンクの場合はアイコンや説明文を付ける。
• 内部リンクの場合は「詳しくはこちら」などのテキストを併用する。

画像だけでリンクを貼ると、初心者は迷いやすいため注意が必要です。

Cocoonでリンクの開き方を設定する方法

Cocoon設定ではリンクの設定を簡単に設定できます。

内部リンクを同じタブで開く設定

「新しいタブで開く」にチェックを入れない。（下図（開き方）参照）

外部リンクを新しいタブで開く設定

「新しいタブで開く」にチェックを入れる。（下図（開き方）参照）

私の場合、リンク先を画像にしたときは、WordPressのメディアライブラリーにアップロードした画像のURLまたはクラウドにアップした図のURLをテキスト文のリンクを貼るときに「新しいタブで開く」に✓しました。

Cocoonの自動設定（便利機能）

個別にリンク設定をした場合は、Cocoon設定では下図のように「変更しない」とする。
ただし私の場合、内部リンクはサイト内リンクで、外部リンクは外部サイトへのリンクなので、この設定を、内部リンク⇒「同じタブで開く」・外部リンク⇒「新しいタブで開く」にし一括設定しました。

理由：個別設定とCocoon設定が競合すると意図しない動作になるため注意してください。

リンク設定方法（内部・外部・画像）

メニュー項目のリンクを「新しいページより開く」に設定した場合

操作方法：「外観」⇒「メニュー」⇒オプション表示（右上）を展開し「リンクターゲットを✓」⇒「リンクを新しいタブで開く」

「リンクを新しいタブで開く」が表示されない場合：オプション表示⇒リンクターゲットに✓を入れてください。

フッターに固定ページリンクを貼る

私も初めてWordPressを使って固定ページのリンクを貼る場合で、「最近」のタブに固定ページが表示されなく困ったので記載しました。
本当に初歩的で恥ずかしいのですが、下図の（「すべて表示」タブ）をクリックすると解決しました。

解決方法：メニュー編集画面で「すべて表示」タブを見ると表示されていました。（汗！

外部サイトおよび画像ファイルにリンク

外部サイトおよび画像ファイルを別ウィンドウで開くリンク設定。

リンクの編集⇒高度の中の「新しいタブで開く」に✓を付け⇒「適用」をクリックする。

リンク設定で注意すべきポイント

内部リンクを新しいタブで開くのはNG

タブが増えすぎて読者が迷います。
スマホでタブが量産されると、ブラウザの「戻るボタン（←）」が効かなくなり、読者が元の記事に戻れなくなって離脱します。

ただし、申し込みフォームや、PDFのダウンロード、別記事を見ながら作業を進める『マニュアル記事』の場合は、新しいタブで開いた方が親切なケースもあります。

外部リンクを同じタブで開くのは離脱率が上がる

あなたのサイトから完全に離れてしまいます。
読者が別のサイトに行ってしまうと、あなたのブログの「滞在時間（セッション時間）」が極端に短くなります。

対策：WordPressのリンク挿入画面で「新しいタブで開く」にチェックを入れます。

画像リンクは「どこへ飛ぶか」を明確にする

画像だけのリンクは初心者が迷いやすいです。
画像だけのリンクは、視覚障害者向けの「画面読み上げブラウザ」や、Googleの検索ロボット（クローラー）が「どこに繋がっているリンクなのか」を正しく理解できません（アクセシビリティの低下）。

画像にリンクを貼る際は、「alt属性（代替テキスト）」に必ずリンク先の詳細を書き込むこと、または画像の下に「テキストリンク」も併記する。（下図参照）

外部リンクは信頼できるサイトだけにする

初心者向けサイトでは、外部リンクの品質がサイトの信頼性に影響します。
「誰にリンクを貼っているか（発リンクの質）」も見ています。怪しいアフィリエイトサイトや低品質なサイトへリンクを貼っていると、あなたのブログの信頼性（E-E-A-T）まで連動して下がってしまいます。

リンク先を選ぶ基準として、「政府機関（.go.jp）」「企業の公式サイト」「大手メディア」など、信頼できる一次情報を発信しているURLを選びましょう。

最適なリンクの開き方例（初心者向けサイト）

私の場合、リンクの開き方は、リンク先の状態で区別されると思うので下記のように定義しています。

リンク先	開き方
同じサイト内	同じタブで開く
外部サイト	新しいタブで開く
画像	新しいタブで開く

画像でYouTube動画などにリンクを貼るのは、著作権・商標権等に抵触する可能性があるので注意してください。
WordPressの標準機能でのYouTubeの埋め込みでは問題ありません。（ブロックエディターやカスタムHTML）

まとめ

最後まで記事を見ていただきありがとうございました。
この記事では、下記のようにWordPress初心者がつまずきやすい内部リンク・外部リンク・画像リンクの設定方法 を解説しました。必要な場面に遭遇しましたらご活用いただけると幸いです。
リンクは、スラッグに対してつきますので「非公開」及び「下書き」時点で記事に付けた内部・外部リンクは公開されてもリンク切れ等起こしません。（リンク先のURLが必ず存在するためです。リンクを貼った時期のリンクと公開時期のリンクが同じであることが前提です。）

• 内部リンク⇒同じタブで開く（回遊率UP）
• 外部リンク⇒「新しいタブで開く」（離脱防止）
• Cocoonで設定が自動化できる
• 画像リンク⇒内部は同じタブ／外部は新しいタブ
• 個別にリンクを設定しない場合は、Cocoonのリンク設定を「変更しない」にする。
• UX・SEOの両方が改善される

リンクの開き方を最適化するだけで、読者の迷いが減ります。

「Cocoonで必ず設定すべき基本機能まとめ｜初心者向けWordPress設定ガイド」の関連記事を下記リンクしてますのでご覧ください。

全体の流れを詳しく知りたい方は、まず「【Cocoon】初心者が最初に設定すべき基本機能と重要項目まとめ」からご覧ください。