Googleサイトでのリンクの貼り方を解説!ボタン・画像・テキストごとに設置のポイントも紹介

2022年06月11日(土) Googleサイト

こんにちは。マニュアル作成・社内wikiツール「NotePM」ブログ編集局です。

Googleサイトを作ってみたものの、リンクの貼り方がわからない人もいるのではないでしょうか。リンクを適切に貼ることによってユーザビリティが高まるだけでなく、検索エンジンからサイトが評価されやすくなる可能性があります。本記事では、Googleサイトでのリンクの貼り方について解説をしていきます。

 

 

Googleサイトでのリンクの貼り方を理解しよう

Googleサイトでページ内にリンクを貼ることにより、ユーザビリティを高めることができます。ユーザーが必要とする情報への導線を作ることで、ユーザーが長くサイトに滞在してくれる可能性が高まります。また、検索エンジンのクローラーはリンクをたどって情報を集めるため、回遊しやすい構造にしておくことでサイトが評価されやすくなると言われています。さらに検索で来たユーザがしっかりとサイトの記事を読んだというユーザー行動も評価を高める要因になる可能性があるため、リンクを貼ることは非常に有用です。

Googleサイトでリンクを貼ることができる要素は3つあります。

  1. テキスト
  2. 画像
  3. ボタン

それぞれの具体的なリンクの貼り方をモ見ていきましょう。

Googleサイト上のテキストへのリンクの貼り方

Googleサイトでテキストへのリンクを貼る方法はとても簡単です。細かい手順を紹介します。

テキストにリンクを貼るときのポイント

テキストにリンクを貼るときのポイントとしては、シンプルな青色の下線と青文字が好ましいということです。ハイパーリンクは緑色にするなどの設定もできますが、一般的なユーザーは青色の文字と下線をリンクと認識する場合が多いので、他の色に指定している場合はリンクに気づかないことがあります。またリンクしていないのに、青色の文字と下線を引くような装飾をすると、ユーザーにストレスを与えてしまいがちです。

リンクの貼り方

リンクの貼り方は非常に簡単で、基本はリンクのアイコンをクリックしてリンク先を指定するのみになります。さらに詳しく見ていきましょう。

  1. Googleサイト上でテキストボックスを選択し、文言を入力します。

  2. ここではタイトルの部分にハイパーリンクを設定するので、タイトル部分を中央に移動させて、大きく目立たせます。ハイパーリンクを設定する文字を反転させて、中央揃えにした上で、太文字「B」を選択します。

  3. 「リンクを挿入」をクリックします。

  4. リンクにはリンク先のアドレスを入力して適用を押します。すでにGoogleサイトでページを作成している場合は、ページの名称を入れると検索することができるので便利です。リンク先にGoogleドキュメントやGoogleスプレッドシーツなどを選択することもできます。

  5. 下線が引かれハイパーリンクが設定されましたが、黒文字になっておりリンクされているのかがはっきりとわかりません。色を青に変えるために再び対象の部分を反転させて「テキストの色」をクリックします。そして青色を選択します。

  6. ハイパーリンクとして認識されやすくなりました。

Googleサイト上の画像へのリンクの貼り方

次にGoogleサイトで画像にリンクを貼る方法について見ていきましょう。画像の場合、リンクされているかどうかユーザーに気づいてもらえなかったり、クローラーに何の画像かを理解してもらえない可能性があるので注意が必要です。

画像にリンクを貼るときのポイント

画像にリンクを貼るときに注意したいポイントとしては、ハイパーリンクを貼っても画像に変化がないので、ユーザーが気づかないことです。画像内に「詳細はこちら」「クリックしてください」といった文言やボタンを入れるなど、クリックすると変化があることを示すデザインにする必要があります。前後のテキストに画像をクリックするとリンク先に飛ぶという説明を書いておくのも良いでしょう。

リンクの貼り方

  1. 右の「挿入」から画像を選びます。

  2. パソコンからアップロードする場合は「アップロード」を選び、Google Driveに保存している画像やGoogleから使える画像を見つける場合は「選択」を選びます。Googleからの画像検索は、基本的には著作権フリーの画像を探すことができますが、Googleが個別に確かめているわけではないため、トラブルが発生する可能性もあります。使用する際にはサイトの著作権や使用権について確認してから使用するようにしましょう。

  3. 画像が貼り付けられました。次に画像をクリックして、「リンクを挿入する」を押します。

  4. リンク先のアドレス、またはGoogleサイトでつけたページの名称を検索して、適用をクリックして完成です。

  5. alt属性に画像の説明キーワードを入れておくこともできます。それでは実際にキーワードを入れてみましょう。画像を反転させて、「その他の編集オプション」をクリックします。

  6. 「代替テキストを追加」を選択します。

  7. 説明に画像の説明書きを入れます。「適用」を押して終了です。

Googleサイト上のボタンへのリンクの貼り方

ボタンを作成するのもリンクが貼っていると思わせるのには良い方法です。ホームページ上にボタンを作成すると、リンクが認識されやすくなります。それでは、細かいポイントを見ていきましょう。

ボタンにリンクを貼るときのポイント

ボタンがあるとユーザーの注目を集めることができますが、注意したいのはボタンを周囲と同系色にしてしまうと目立たなくなってしまい、クリックせずに通り過ぎてしまうことがあります。具体的な例を見ていきましょう。

例1 ボタンを背景色と同じにした場合

例2 ボタンを緑にした場合

例1と例2を比べるとどちらをクリックしたくなるか一目瞭然ではないでしょうか。背景色やホームページ全体の配色と比べて、ボタンが浮立つようになっているかどうか確かめてみましょう。

リンクの貼り方

  1. まずボタンを作ってみましょう。右の挿入から「ボタン」を選択します。

  2. ボタンの中の文言を「名前」に入力し、リンク先のアドレスを入力したあと、挿入を押します。

  3. ボタンが挿入されました。

  4. ボタンの色を変える場合は、右端にあるテーマから変更すると簡単です。任意のテーマを選択し、カラーを選びます。例では「シンプル」というテーマを使っています。もっと細かく色を指定したい場合はフォントスタイルのプルダウンを押して好きな色を選ぶと良いでしょう。

  5. ボタンの色が紫に変更されました。

まとめ

Googleサイトでのリンクの貼り方は意外と簡単ではなかったでしょうか。サイト内部にリンクを貼りユーザーを誘導することで、問い合わせ件数を増やすなどホームページの目的を達成することができます。また、ボタンの色やテキストのハイパーリンクの色を変えるだけでクリックされる可能性が大きく変わる可能性もあります。本記事を参考にGoogleサイトでリンクを設定してみて下さい。

 

この資料でわかること

• 個人のノウハウを引き出す社内wikiとは?
• 社内wikiを導入し浸透させるために必要なこと
• 社内wikiツールの選び方

 

おすすめの情報共有ツール

マニュアル作成・ナレッジ共有ツール 「NotePM」 は、社内の知りたいことが簡単に確認できるツールです。「社内のほしい情報を探すのが大変」「ナレッジ共有が上手くいっていない」とお悩みの方は、NotePMの無料トライアル をお試しください。

NotePMサービス紹介資料はこちら >