坂本 義和 
スマートフォンが普及している現在、士業のホームページを制作する際もスマホ対応であることは必須と言えます。
士業のサービスを調べる方の多くはまだパソコンをお使いとお考えの方も多いと思います。
ですが、私たちの経験によると、移動中や空き時間にスマホで情報収集、パソコンをつかってじっくりと比較検討。
そんな方が増えているそうです。
ですので、一番最初の閲覧についてはスマホでホームページを見られると考えたほうがよいです。
では、スマホ対応していないホームページをスマホで閲覧するとどうなるでしょうか。
最近のスマホの画面は大きくなっているものの画面が見切れてしまうなどの問題が起きます。
そうするとホームページを見ないで検索画面に戻ったりなど、WEB集客をする観点で確実に不利になります。
今回の記事では、士業ホームページをスマホ対応する必要性と、対応させる方法について解説いたします。
これからホームページを作りたい方、ホームページはあるけれどスマホ対応していない方、スマホ対応させるためにリニューアルを考えている方はぜひ参考にしてみてください。
ホームページのスマホ対応とは？
そもそもホームページのスマホ対応についてしっかりとお伝えします。
ホームページのスマホ対応とは、スマホなどのタブレット端末からホームページを閲覧した時に最適化されていることを指します。
ホームページはスマホからでも閲覧可能ですが、パソコン閲覧のみを想定して作られている場合、文字が小さくなる、レイアウトが崩れるなどの問題が生じ、ホームページの情報が分かりづらくなってしまいます。
またパソコンとスマホでは、画面の大きさだけではなく操作方法もマウス・指と異なるため、どちらか片方のみの対応だと操作しづらく、ホームページ閲覧をやめてしまう（これはWEBの用語で離脱といいます）リスクが高まります。
ユーザーの離脱を防ぎ集客率を高めるためには、スマホ・パソコンの両方に対応する必要があります。
ホームページがスマホ対応していないとホームページの活用においてマイナスになってしまう理由
ホームページがスマホ対応していないと、以下のような理由でホームページの活用においてマイナスになってしまいます。
- スマホユーザーがホームページから離脱してしまい、ホームページコンテンツの閲覧をしてもらえない、問合せに誘導できない
- GoogleがMFI（モバイルファーストインデックス）というロジックを適用している
理由をそれぞれ見ていきましょう。
スマホユーザーが「すぐに」離脱してしまい問合せの機会を失う
冒頭にもお伝えしたように、士業の領域でもスマホ利用者は増えています。
士業のホームページをより活用するためにはスマホ対応をしていく必要があります。
スマホ対応をしていないホームページでは、文字が小さくて読みにくい、リンク部分が小さすぎて上手くタッチできないといったストレスが発生し、閲覧者がホームページから離脱する確率を引き上げます。
一般的にですが、ホームページの閲覧者がすぐに離脱してしまうホームページというのは、ホームページの滞在時間が短いことになります。
そうすると、検索した閲覧者にとってホームページは役に立たなかったと「数字上」は判断できてしまいます。
Googleは検索エンジンの品質をとても重要視しています。
閲覧者にとって役に立つホームページ、役に立つコンテンツがGoogleに評価されます。
ホームページから離脱するのは必ずしも悪いことではありません。
役に立って満足したから閲覧を終了することもあるからです。
ですが、「すぐに」離脱してしまうホームページはどうでしょうか。
おそらくスマホ対応していないホームページの閲覧時間は１秒にも満たないのではないでしょうか。
そうすると、検索エンジンからの評価は当然低くなります。
検索順位も低下し、WEBでの集客力の低下につながってしまいます。
GoogleがMFI（モバイルファーストインデックス）に移行
2021年3月から、GoogleはMFI（モバイルファーストインデックス）の強制移行を実施しました。
MFIとは、簡単に申し上げればスマホ対応したホームページを優先して評価し、検索結果の順位を決めるGoogleの検索エンジンの仕組みのことです。
（厳密にはスマホのページが優先して検索エンジンのデータベースにのるようになる、ですが上記のように理解してください）
この仕組みの導入によって、パソコン用ページの内容ではなくスマホ用ページの内容を評価して検索結果を表示するようになりました。
なのでGoogleに評価されるためには、スマホ対応しているのは一つの重要な要素なのです。
もちろんスマホ対応をしていないからと言って検索で表示されなくなるということはありません。
ですが、いろいろな過程を経て検索で上位表示されなくなっていくようになります。
集客をお考えの先生にとってはスマホ対応は重要と言えます。
ただし、パソコンで閲覧するユーザーを無視していいわけではなく、どちらのユーザーにも見やすいホームページであることも必要です。
冒頭に書いたようにスマホとパソコンを用途に応じて使い分けている方も少なクリません。
そのため、パソコン・スマホの両方に対応しどちらのユーザー、どちらからのアクセスにも利用しやすいホームページを制作する必要があります。
ホームページをスマホ対応させる方法
ホームページをスマホ対応させるには以下の3つの方法があります。
- レスポンシブデザインで可変レイアウトにする
- セパレートURLで別々のURLを用意する
- ダイナミックサービングで動的な配信をする
こちらもそれぞれ見ていきましょう。
なお、結論から申し上げればレスポンシブデザインが圧倒的にコストパフォーマンスはいいです。
むしろ残りの２つはこういうのもあるんだなという感じで読んでいただければと思います。
レスポンシブデザインで可変レイアウトにする
レスポンシブデザインとは、パソコン・タブレット・スマホなど異なる端末のサイズに合わせてデザインレイアウトを変化させ、ホームページの見た目を見やすい表示に変化させることのできる技術です。
画面幅に合わせてデザインレイアウトを変化させられるため、多様な端末でホームページを見ることができる現在、ほぼすべての端末でホームページを見やすいデザインで表示させることができます。
レスポンシブデザインのメリット
- htmlファイルが一つのため修正がしやすい→制作コストが安い
- 端末ごとではなく画面の横幅ごとでデザインを最適化できるためユーザーにとって見やすい
- Googleがレスポンシブデザインを推奨しているので、検索で上位表示されやすい
- ひとつのURLでホームページを作れるため評価が分散しづらい
レスポンシブデザインのデメリット
- 特にスマホでは、ページを表示するときに時間がかかる
- パソコンとスマートフォンでホームページのデザインを大幅に変えることが難しく、複雑な内容のホームページに向いていない
- CSSの記述が増える
セパレートURLで別々のURLを用意する
セパレートURLは、パソコンとスマホのホームページを別々に用意し、表示する端末用に用意したデザインを表示させる方法です。
セパレートURLのメリット
- パソコン・スマホ用でそれぞれホームページのデザインを作成するため、独立した運用ができる
- スマホだけコンテンツの順序を大幅に変えるなど、パソコン・スマホそれぞれの特長を活かしたデザインにすることができ、自由度が高い
- レスポンシブデザインに比べページの表示速度が早い
セパレートURLのデメリット
- Googleが想定していないホームページの作り方かつURLが二つあるため、一般的なSEO対策をしても効果が出にくい
- パソコン・スマホ用のホームページをそれぞれ管理しなければならないため、更新時などにミスが起きやすく運営コストが高い
- 想定していない端末でユーザーが流入すると適切なページが表示されず、表示に時間がかかる、適切な表示がされないなどの理由により離脱に繋がる可能性がある
ダイナミックサービングで動的な配信をする
ダイナミックサービングとは、一つのURLに対してHTMLとCSSをパソコン用・スマホ用に２セット用意し、ユーザーがアクセスした端末によってサーバーサイドでパソコン向け・スマホ向けのHTMLを出しわける方法です。
ダイナミックサービングのメリット
- レスポンシブデザインで作ったページよりも読み込みが早い
- URLが一つなのでSEO評価が分散しない
- 端末ごとに異なるホームページの情報を持たせるため、パソコン用・スマホ用でデザインを大幅に変更できる
ダイナミックサービングのデメリット
- ホームページの修正・更新時にはパソコン用とスマホ用の両方のHTML・CSSを変更する必要があるためミスが起きやすく運営コストが高い
- レスポンシブデザインやセパレートURLと比較してホームページの作り方が高度なため、導入にコストがかかったりトラブルが起こった時の対応が難しい
- Googleが想定していないホームページの作り方のため、一般的なSEO対策をしても効果が出ない可能性が高い
レスポンシブデザインでホームページを対応させる方法
Googleが推奨しているレスポンシブデザインでホームページをスマホ対応させる方法は以下の通りです。
- 自動変換ツールを使用して自分でスマホ対応にする
- レスポンシブデザインで制作できるホームページ制作会社に依頼する
それぞれの方法について解説します。
①自動変換ツールを使用して自分でスマホ対応にする
すでにホームページを持っている場合、ご自身で自動変換ツールを使用してスマホ対応にすることが可能です。
現在のホームページの作り方を変える必要がないので、ホームページの情報量が大きく、リニューアルコストが高くなってしまう場合におすすめです。
ただし、どの自動変換ツールも月額・年間の継続的な利用が必要です。
利用をやめてしまうともとのスマホ対応していないホームページに戻ってしまうこと、ツールによっては利用に初期費用がかかることがありますので注意しましょう。
あとこれは個人的な感想なのですが、だいぶ見やすくはなるのですが、システム的な限界があるなとは思っています。
ただコスト面では優れた方法なので検討には値します。
②レスポンシブデザインで制作できるホームページ制作会社に依頼する
こちらの方が私たち【ゼロワン】としては自信をもっておすすめできます。
レスポンシブデザインで制作できるホームページ制作会社、例えば弊社【ゼロワン】に依頼するのがおすすめですし、安心でもあります。
既存のホームページがある場合でも、月額・年間で変換ツールを利用するコストと比較すると、リニューアルしてレスポンシブデザイン対応のホームページを新たに作る方が、結果的に費用を抑えられることがあります。
もしどのくらいかかるか不安な場合は必ずお見積りをとってください。
また私たちは、ホームページリニューアルの必要性について無料診断サービスを提供しておりますのでよろしければ御覧ください。
ホームページがスマホ対応しているかのチェック項目
ホームページがスマホで「見られる」からといってスマホ対応しているわけではありません。
今のホームページデザインでは「モバイルファースト」という考え方があり、スマホでみたときに「見やすいかどうか」が重要視されており、先に書いた通りGoogleも検索エンジンにおける順位付けの判断基準に「いれているかもしれない」と言われています。
では「スマホ対応」しているかどうかはどのように判断すべきでしょうか？
単純にいえば、自分がスマホで見たときにそのままで見やすいかどうか、閲覧しやすいかどうかで、少しでも見にくい、閲覧しにくかった場合は「スマホ対応」として不十分といえるかもしれません。
以下に簡単なチェック項目をお伝えします。
- スマホで閲覧したとき・パソコンで閲覧したときで見た目のレイアウトが変化しているか
- スマホから閲覧したときに内容がはみ出ず、文字や画像などがきちんと閲覧できるか
- スマホ用・パソコン用、それぞれに合う操作方法になっているか
それぞれのチェック項目について説明していきます。
スマホで閲覧したとき見た目のレイアウトが変化しているか
パソコンとスマホの最大の違いは画面サイズです。
そうすると、スマホとパソコンの表示されるホームページは、スマートフォンで閲覧した時とパソコンで閲覧したときとでは変えるべきなのです。
スマホから閲覧したときに内容がはみ出ないか
パソコン表示のみ前提のホームページだと、スマホ表示では文字が小さすぎて読みにくい、画像が表示されない、リンクが小さすぎて押しにくいといった不具合が生じます。
他にも、スマホ対応していないホームページは内容が画面幅に合わず表示されない部分がでてくるので確認しましょう。
私の経験上、リンクがおしにくいというGoogleのシステムからの「ツッコミ」が入りやすいです。
スマホ用に合う操作方法になっているか
画面サイズにつづく、パソコンとスマホの違いは操作方法です。
（画面サイズが違うから操作方法も違うともいえるのですが）
マウスやトラックパッドを前提に作られているパソコンのホームページと、指で操作することを前提に作られているホームページは当然表示方法も変わるはずです。
クリックとタップも違います。
スマホ対応していないホームページの場合、マウスのクリック操作を前提としているためスマホでは操作しづらいことがあります。
利き手にもよりますが、タップしにくいホームページはイライラしませんか？
ホームページが正式にスマホ対応しているか確認する方法
ホームページがスマホ対応しているかどうかは、Googleのモバイルフレンドリーテストから確認できます。
（これが先ほどかいたGoogleのシステムからの「ツッコミ」の場所です）
- モバイルフレンドリーテストにアクセスする
- URLを入力し、「URLをテスト」をクリック
- ホームページの分量によっては時間がかかるので少し待つ
モバイルフレンドリーテストは、ホームページがスマホ対応に最適化されているかを調べられるGoogleのツール名称です。
確認方法を説明していきますので、ぜひ試してみてください。
①モバイルフレンドリーテストにアクセスする
まずはGoogleのモバイルフレンドリーテストにアクセスしましょう。
②URLを入力し、「URLをテスト」をクリック
「テストするURLを入力」にスマホ対応しているか調べたいURLを入力し、「URLをテスト」をクリックします。
上記のような画面が表示されますので、しばらく待ちましょう。
③20～120秒で結果が表示される
大体20秒～120秒の間に結果が表示されます。
スマホ対応の場合
ホームページがスマホ対応している場合、「このページはモバイルフレンドリーです」と表示されます。
スマホ対応していない場合
ホームページがスマホ対応していない場合、「このページはモバイルフレンドリーではありません」という表示と、修正すべき項目がリストに表示されます。
まとめ
士業ホームページがスマホ対応必須な理由と確認方法、対応させる三つの方法について解説してきましたがいかがでしょうか。
スマホユーザーが増加している昨今、スマホ対応していないホームページでは他のスマホ対応しているホームページに負けます。
スマホ対応のホームページ制作の方法は三種類ありますが、Googleが推奨しているレスポンシブデザインが特におすすめです。新たに士業ホームページを制作したい、スマホ対応していない今のホームページからリニューアルしたいという方は、ぜひ私たちにご相談ください。
