ホームページに電話番号リンクを設定する方法｜注意点3つも解説
ホームページに電話番号を載せているのに、「まったく問い合わせが来ない…」と感じたことはありませんか？
その原因の一つとして大きいのが、電話番号がクリックできない＝電話番号リンク（TELリンク）が未設定であることです。
スマホでサイトを見る人が増えた今、わざわざ番号をメモして、電話アプリを開いて、手入力して…という操作はユーザーにとって大きな負担です。ほんの小さな手間でも、問い合わせを諦めるきっかけになってしまいます。
一方で電話番号リンクを設置するだけで「ワンタップで電話できる」という便利な導線が生まれ、問い合わせ率が大幅に改善するケースも多くあります。
KajiUI/UXが重要視されるようになった今、電話番号リンクを設定するのは必要不可欠になってきています！
特に、接骨院や訪問看護などの医療・健康系、水道修理や電気工事などの生活サポート系、美容院やネイルなどの美容系、行政書士や税理士などの士業系といったBtoCジャンルは、電話がよくかかってくるジャンルだといえます。
BtoCに該当するジャンルの方は、なるべく電話番号リンクを設置するようにしましょう。
Service
【最安15万円〜】
全てセット料金のホームページ制作サービス
サイト企画〜公開まですべてセット料金になっており、「余計な料金は一切いただかない」というのをモットーにしています。
最安15万円〜からホームページが作れて、すべてオリジナルデザインで制作可能です。また自社管理できる「Studio」というツールを用いているので、プランによっては維持費0円で運営できます。
期間限定で制作費用の3万円割引キャンペーンもやっていますので、ぜひお気軽にご相談ください！
電話番号リンク（TELリンク）とは？
電話番号リンク（TELリンク）とは、スマホでタップするとそのまま電話アプリが起動するリンクのことです。
たとえば、次のような文字をタップするだけで、電話発信画面が立ち上がります。
スマホユーザーが増え、Webサイトの閲覧の7〜8割がスマホというケースも珍しくない現代では、この電話番号リンクは問い合わせのしやすさに直結します。
そのため、スマホ主体のユーザーが多い業種では特に重要な導線になります。
KajiBtoCのホームページは、スマホ閲覧の割合が比較的高いです！
また、TELリンクを設定することで問い合わせが増えるケースは非常に多いですが、SEO評価に直接関わるわけではありません。ただし、ユーザビリティ向上や離脱率の低下につながるため、結果的にSEOへの間接的なプラス効果が期待できます。
SEO対策を本格化したいサイト運営者にとって、電話番号リンクを設置するのは必須だといえます。
ホームページに電話番号リンクを設定すべき理由
電話番号リンクは「あると便利」ではなく、現代では「必須」と言えるレベルです。
ここでは、特に重要な理由を解説します。
それぞれ具体的に説明します。
電話番号リンクは標準化してきているから
新しく作られるホームページでは、電話番号リンクはほぼ標準で実装されています。
そのため、電話番号にリンクがついていないだけで、ユーザーからは次のように見られる可能性が高まります。
- 少し古いサイトだな…
- 更新されていない活気のサイトなのかな？
- ユーザー目線が足りないサイトだな…
- クオリティの低いサイトだな…
人は細かい部分でサイトの質を判断することが多く、TELリンクの有無はその差になってしまいます。
競合サイトが整っている場合は特に、「電話番号リンクなし＝見劣りするサイト」と評価される可能性があります。
問い合わせ率が上がるから
電話番号リンクをつける最大の理由は、問い合わせ率が上がるからです。
通常、電話番号リンクがない場合、ユーザーは次の操作を行う必要があります。
- ホームページで番号を確認
- ホームボタンに戻る
- 電話アプリを開く
- 番号を手入力する
- 電話をかけて発信画面へ
- お問い合わせ
これだけの手間が増えるため、離脱率が上がるのは当然です。
一方、ホームページに電話番号リンクがあれば、下記の手順で電話をかけられます。
- 電話番号をタップするだけで発信画面へ
- お問い合わせ
Kaji電話をかけるまでの手順が少なくなるので、離脱率をなるべく下げられます！
ユーザーの手順が少なくなりユーザーファーストなだけでなく、心理的ハードルも大きく下がります。特にスマホユーザーが多いサイトの場合、ワンタップで電話できるかどうかは問い合わせ数に直結します。
実装自体も難しくないため、電話番号リンクは特段の理由がない限り、実装すべきだといえます。
電話番号リンクの設定方法
電話番号リンクの設定方法について、今回はメジャーである3つの方法で解説します。
それぞれ具体的に説明します。
HTMLで設定する
HTMLが編集できる環境であれば、HTMLで電話番号リンクを設定するのがおすすめです。
例えば、「0120-345-6789」という電話番号にかかるリンクを設置したい場合は、下記のようなHTMLを書きます。
<a href="tel:01203456789">0120-345-6789</a>ただし、上記の場合だと、下記のようなテキストリンクになってしまいます。
Kajiテキストリンクだと目立たないのでスルーされる可能性があります。ボタン化するなどのデザイン面での工夫が必要です！
視認性を上げる、クリック率を上げるには、CSSを用いて電話番号リンクをカスタマイズしなければなりませんので注意しましょう。
WordPressを利用している場合
WordPressを利用している場合、下記の2パターンで実装するのがおすすめです。
- カスタムHTMLブロックを利用する
- リンク機能を利用する
◼︎カスタムHTMLブロックを利用する方法
WordPressのエディタ画面に入って、カスタムHTMLブロックを挿入して、下記のコードを貼り付けます。
<a href="tel:01203456789">0120-345-6789</a>電話番号の部分は変更してください！
◼︎リンク機能を利用する方法
エディタ上でテキストを入力した上で、リンクボタンをクリックします。
そしてリンクには「tel:01203456789」のように、「tel:〇〇」の〇〇の部分を変更してリンクを挿入するようにしましょう。
Studioを利用している場合
Studioで電話番号リンクを設定する手順は、下記のとおりです。
- 電話番号を設定したい要素を選択して、右パネルを開く
- リンクを設定する
- 動作確認する
①電話番号を設定したい要素を選択して、右パネルを開く
②リンクを設定する
tel:0120-345-678上記のコードをリンク欄に入力します。
Kaji電話番号部分は、任意で変更してください！
③動作確認する
ライブプレビューを開いて、クリックしたときに動作するかを確認します。
参考：電話をかけるリンクの設定方法 | Studio Help
電話番号リンク設置後の注意点3つ
電話番号リンクは設定して終わりではありません。
間違った電話番号をリンクしてしまっていたり、ボタンを押しても反応しないというケースがよくあります。
そこで電話番号リンク設置後に必ず確認すべき点3つを紹介します。
それぞれ具体的に説明します。
スマホで実際にタップして発信画面が開くか
CMSによっては、プレビューと本番で挙動が違うことがあります。
- 本番ではリンクが効かない
- 間違った番号（ダミー番号）につながってしまう
- ボタン位置がずれてタップしづらい
こうしたリスクを防ぐため、必ずスマホ実機でテストしましょう。特に「番号間違い」は企業イメージの低下にも繋がるため、最も注意すべきポイントです。
プレビューで正確に作動したからといって、本番環境でも上手くいくとは限りません。サイトが露出する前に、電話番号リンクが正しく設定できているかしっかり確認するようにしましょう。
電話の対応時間を記載しておく
電話番号リンクの近くに、必ず対応時間を明記しましょう。
- 何回電話しても繋がらない
- どのタイミングで電話すれば繋がるのかわからない
といった不満は、そのまま企業イメージの低下につながります。
そのため、電話番号リンクの近くには、下記のような文言を載せておくのがおすすめです。
- 平日 10:00〜18:00
- 土曜・日曜・祝日は定休日
- 営業時間外のお問い合わせはフォームをご利用ください
ユーザーが迷わず連絡できるよう、配慮してあげることによってユーザーの心理的ストレスを軽減させることができます。
ボタンにはクリックされやすいデザインを施す
電話番号リンクは設定しただけでは十分ではなく、ユーザーが視認しやすいデザインにすることが問い合わせ増加の大きなポイントになります。
なぜならスマホユーザーはスクロールが速く、文字だけの番号はどうしても視界に入りづらく、気づかれずに通り過ぎてしまうケースが多くあるからです。
そこで、ボタン化や色づけなど、視認性を高める工夫が重要になります。
Kajiボタン化することで、「押していい場所」とユーザーも判断しやすくなります！そのため、気づかずにスルーされる可能性が下がります！
Studioなどの高性能なノーコードツールでサイトを作れば、ボタンデザインにもサイトの世界観を反映させたり、オリジナリティ溢れるボタンに変更することができます。
どのようなボタンデザインがあるのか確認したい方は、ぜひ以下の記事をご覧ください。
ホームページ制作は「Terace」にお任せ！
当メディアを運営する私達は、ホームページ制作のサービス「ラク子」を運営しています。
Kaji「デザイナー」と「フロントエンジニア」のフリーランス3名で運営中！
- ポッキリ価格でホームページを制作できる
- 専属デザイナーが完全オリジナルのデザイン作成
- 納品後1ヶ月間は無料の電話サポートあり
- 自社更新できるホームページが作れる
- ホームページ制作期間中は何度でも無料相談できる
- 顔の出ているフリーランス3人が運営
- 維持費0円でホームページを運営できる
また「ラク子」の料金プランは、下記のとおりです。
ポッキリ価格でホームページが作れるサービスであり、個人事業主や中小企業からよく選ばれています。サービス利用者の声を聞きたい方は、ぜひ以下のインタビュー記事をご覧ください。
今だけ、毎月3組まで制作費用が3万円割引になるキャンペーンを行っています。
先着順で締め切るので、気になる方はぜひお早めにお問い合わせください！
送信中です
ebook
【無料のお役立ち資料】
初ホームページ制作のよくある質問集
ホームページ制作に関するよくある質問14選にすべて答えています。
「自作するべきなのか」か「Web制作会社に任せるべきか」など、これまでホームページ制作をやっていく中で1番よく受けた質問を厳選しています。
無料でダウンロードできるので、これからホームページを作成する予定の方はぜひ参考にしてみてください！
※コメントは最大500文字、5回まで送信できます