【SWELL】「ページ内リンク」を簡単設定【図解付き】ウェブサイトに役立つ便利な仕組み。「アンカーリンク」や「記事内リンク」とも呼ばれる方法。

ウェブサイト閲覧時に便利な「ページ内リンク」の作成方法と、設定する事によるメリットについて紹介します。

「ページ内リンク」とは
  • 同じサイトページの特定場所へ移動させるリンクのこと
  • 「アンカーリンク」「記事内リンク」「ページジャンプ」と呼びかたが違うだけ

※注意 サイト内の別のページにジャンプする「内部リンク」ではありません。

このように「ページ内リンク」を簡単に作成できます。

「👇Conoha WING 5,000円割引 公式リンク👇」 へジャンプする。

下記の「目次」は、SWELLで自動生成される「ページ内リンク」です。

目次

簡単な2STEPで「ページ内リンク」を設定できます。

作成方法を画像付きで解説

STEP
リンク先にHTMLアンカーを設定

①リンク先(ジャンプ)したい場所を左クリックで選択します。

②ブロックの設定から「高度な設定」をクリック ※下へスクロールする

∟「HTMLアンカー」に任意の文字を入力 <例「test-1」

  • ハイフン(-)アンダーバー(_)コロン(:)ピリオド(.)半角記号を含めることができます。
  • 大文字と小文字を区別される→「test-1」「TEST-1」
  • スペース使用不可「test 1」
  • 一文字目は必ずアルファベットを使用「test-1」
STEP
リンク元に「#〇〇〇」を設定

①リンクさせたい文字を左ドラックして選択する。

②リンクボタンをクリック

③ハッシュタグ(#)をつけて先ほどの「test-1」を入力

∟「#test-1」と入力してEnterをクリック

  • 「ページ内リンク」の場合は新しいタブで開かない方が閲覧しやすい
  • ハッシュタグ(#)シャープ(♯)を間違わない

下記リンクボタンからお申込み下さい。割引が自動適用されます(クーポンコードの入力不要)

月額505円~

国内シェアNo,1

スムーススクロールとは

「SWELL」のデフォルト設定は「スムーススクロール」が設定されています。

「ページ内リンク」をクリックすると、素早くスクロールしながら移動する機能です。

スクロールしながらジャンプすることで、ページ内で移動したことがわかりやすくなります。

ページ内リンクを作成するにあたって

2つのメリット

①ユーザーの利便性向上

 ∟サイト訪問者が求めている情報にすぐたどり着けることが、有益な情報の提供につながる。

②SEOの向上

 ∟ユーザーの求める情報がすぐに見つかることで、離脱率の低下につながる。

結果的に検索順位の上昇につながる。

2つの注意点

①リンクであることを認識できるようにする。

 ∟リンクは基本「青」がリンクだと理解されやすい。そもそもリンクだと理解できないものはクリックされない。

②リンクを作成する際のテキストは内容を的確に伝える。

 ∟<例> 「詳細を読む」ではなく「〇〇の詳細」など。リンク先は期待通りのコンテンツに移動するためのもの。

さいごに

ページ内リンクの作成方法はとても簡単です。

もう一度確認する場合は下記ボタンが「ページ内リンク」です。

\ もう一度確認する /

ぽこらぱぱ

質問があれば、お問い合わせフォームまたはXから連絡下さい。

初心者がブログで挫折しないための情報をメインで更新していくので「ホーム画面への追加」や「ブックマーク」よろしくお願い致します。

目次