【購入者が倍!】HTMLでページ内リンクを作る2つの手順

SEO
なな

『もっと商品を多く購入したい』『今の1.5倍は販売数を増やしたい』こんな方は必見です!

 

今日はこんな疑問に答えていきます。

本記事の内容

  • ページ内リンクとは?
  • ページ内リンクの効果
  • ページ内リンクの2つの手順
  • ページ内リンクが反応しない時の対処方

 

初心者でも分かりやすいように、図を入れながら解説していきます。

この設定をするだけで、ユーザビリティが高まるのでSEO効果も期待出来ますよ。

 

ページ内リンクとは?

ページ内リンクとは?
 
ページ内リンクとは、一言で言えば同じページ内の特定部分に瞬時に飛べるリンクのことです。

 

大抵が他のページへ移動といった全く違うページへの誘導だったりするんですが、同じページ内でも設定次第では簡単に飛ぶことが可能です。

 

同ページリンクを『アンカーリンク』とも言います。

このアンカーリンクがよく使われるのは、記事下からの『トップへ戻る』時です。

スクロールしなくても済むので、読者にとってもあれば嬉しい機能ですね。

 

ページ内リンクの効果

ページ内リンクの効果
 
ページ内リンクを設定することで、読者が時間をかけることなく目的のコンテンツに辿り着けます。

 

記事下からトップへ。
記事下からランキング1位へ。
記事下から注目部分の文章へ。

↑こんな感じで1度読み終わった後に、宣伝している部分に誘導出来れば完璧ですね!

 

特にランキング1位へ飛べるリンクを貼ると、そこから読者が商品を購入してくれることにも繋がります。

よって、いつもよりも購入者が多く収益が多く発生!・・・なんてことも。

 

このちょっとした設定だけでも、読者にとっての満足度が高いページ作りに繋がります。

また、ユーザーの満足度が高まれば、Googleの評価も高くなるので、SEO効果も上がるということです。

 



ページ内リンクの2つの手順

ページ内リンクの2つの手順

 

ページ内リンクの設定方法は『HTML』にて可能です。

手順は大きく分けて2つ、簡単なので画像を見ながら一緒にやっていきましょう!

 

ジャンプしたいタイトルの設定

 

まず、ジャンプ先を設定する為に見出しに『idタグ』を付けます。

 

見出し2を変更したいなら、

変更前:<h2>見出し</h2>
変更後:<h2 id=”id名”>見出し</h2>
id名は変更して分かりやすい言葉に変更しても構いません。

 

こんな感じで、ジャンプしたい見出し部分の設定から行います。
今回は見出し2の『ページ内リンクとは?』に飛べるように設定をしていきます。

 
それではHTMLをいじっていきますが、通常の見出しはこんな感じ。
ジャンプしたいタイトルの設定

 

<h2>ページ内リンクとは?</h2>
これを変更していきます。

 

変更後の型にはめてHTMLを書き換えるとこうなります。
ジャンプしたいタイトルの設定

 

<h3 id=”a10″>ページ内リンクとは?</h3>

となります。
※id名を『a10』にしています。

 

これでジャンプしたい見出しの設定は完了です。

 

ジャンプボタンの設定

 

次にジャンプする為のボタンを用意します。

これがないとジャンプすることは出来ないので、この2つの手順はセットで覚えておいてください。

 

それではジャンプボタン(内部リンク)を設定する為に『href』を指定します。

<a href=”#id名”>ここをクリックする</a>
※ここで注意するのは、id名の前には必ず『#』を付けることです。

 

当てはめるようにして修正していくとこんな感じ。

ページ内リンクの2つの手順

 

<a href=”#a10″>« ページ内リンクとは?</a>
これでリンクボタンが完了です。

« ページ内リンクとは?
↑実際にクリックしてみてください。

 



ページ内リンクが反応しない時の対処方

ページ内リンクが反応しない時の対処方
 

なな
『ページ内リンクを設定したのに反応がない!?』なんてこともあります。

 

この反応しないことでよくあるのが、入力ミスですね。

数字やスペルの間違いで、いくらクリックしてもジャンプしないって時もあります。

 

なので、何をしても反応がない場合は先に入力ミスがないか確認をしてください。

その上で、全く問題がないとなったらこちらの方法を試してみてください。

 

ジャンプ先の見出しHTMLに、

<p id=”id名”></p>

を入力するだけです。

 

大体こんな感じになります。
ページ内リンクが反応しない時の対処方
 

<p id=”a10″></p>
これを記載することで、ジャンプ出来るようになるはずです。

 

こちらは3分あれば対処出来るので、落ち着いてやってみてくださいね。

 

【まとめ】ページ内リンクを設定してみよう!

 

以上が、『ページ内リンクの設定方法』でした。

 

主に2つの手順に、ダメだった時の対処方法。

これさえ知っておけば、いつでもページ内リンクを設定することが出来ます。

 

個人的におすすめなのは、記事下から注目度が高い見出しへ飛ぶことですね。

半ば中途半端な位置から上に移動するよりは、下から上にい一気に上がるような感じにしましょう。

真ん中とかから上に上がっても、それほど意味がなかったりしますからね。

 

このページ内リンクを設定する場所や、ジャンプする場所はよく考えてから設置するのがいいですよ!

ぜひ参考にしてみてくださいね(^^)
最新情報をチェックしよう!