ホームページ、スマホで見づらくない？｜5分でできる確かめ方と直し方の選び方

ホームページを見に来る人の多くは、今はスマホから見ています。

業種によっては、7〜8割がスマホという会社も珍しくありません。

ところが、作った人も管理している人もパソコンで見ていることが多く、スマホでの見え方に気づいていない、ということがよくあります。

■「スマホ対応」には2つの作り方があります

・1つのページが、画面の幅に合わせて並び方を変える作り方（レスポンシブデザイン）。

・パソコン用とは別に、スマホ用のページを用意する作り方。

今は1つ目が主流です。

ページを1つ直せば両方に反映されるので、更新の手間も少なく済みます。

■5分でできる確かめ方

自分のスマホで、自社のサイトを開いて、次を見てください。

・文字を拡大しなくても読めるか。

・横にずれたり、画面からはみ出したりしていないか。

・ボタンやリンクが小さすぎて、押し間違えないか。

・メニューが開けるか。

・電話番号を押すと、電話がかけられるか。

・お問い合わせフォームが、スマホで最後まで入力できるか。

トップページだけで終わらせず、サービスの紹介、料金、会社案内、お問い合わせのページも開いてみましょう。

崩れは、あとから足したページや、表の多いページに出やすいものです。

■パソコンで確かめる方法

パソコンで見るときは、ブラウザの幅を細くしてみるだけでも、おおよその崩れ方が分かります。

Chromeを使っている場合は、もう少し正確に見られます。

1. 確かめたいページを開く。

2. 画面の上で右クリックし、「検証」を選ぶ。

3. 開いた画面の左上にある、スマホとタブレットの形の印を押す。

4. 上に出る機種の一覧から、スマホを選ぶ。

元に戻すときは、同じ印をもう一度押します。

ただし、本物のスマホとは文字の大きさや押しやすさが少し違います。

最後は手元のスマホでも確かめてください。

■無料の点検ツールも使えます

Googleの「PageSpeed Insights」にページのアドレスを入れると、スマホで開いたときの表示の速さや、文字やボタンの大きさについての指摘が出ます。

Search Consoleを使っている場合は、スマホでの見え方に関する問題が出ていないかも見ておきましょう。

■見づらくなっている主な原因

・作った時期が古く、スマホでの表示を考えていないテーマを使っている。

・表を横に広く作っている。

・画像の中に文字を入れていて、スマホでは小さくて読めない。

・あとから足したプラグインや部品が、スマホで崩れている。

■直し方は4つ

1. 崩れている部分だけ直す

表やボタンなど、気になる箇所が限られているなら、ここから始めるのが手軽です。

2. スマホ用の設定がある今のテーマで、設定を見直す

テーマによっては、スマホの表示を切り替える設定があります。

3. スマホでの表示に対応したテーマに入れ替える

デザインが変わるため、入れ替える前にテスト環境で確かめます。

4. リニューアルする

古いテーマで、ほかにも直したいところが多いなら、作り直したほうが手間も費用も少なく済むこともあります。

・部分的に直す（手間と費用：小さい）：崩れが数か所だけ。

・テーマの設定を見直す（手間と費用：小さい）：今のテーマに設定がある。

・テーマを入れ替える（手間と費用：中くらい）：テーマが古く、崩れが全体にある。

・リニューアル（手間と費用：大きい）：ほかにも直したいことが多い。

どれを選ぶかは、崩れている範囲と、今のサイトをあと何年使うかで決めましょう。

■よくある質問

Q. スマホでは見られるのですが、それで十分ですか？

A. 見られることと、読みやすいことは別です。文字を拡大しないと読めない、ボタンが押しにくい、という状態なら直す価値があります。

Q. スマホ用のプラグインを入れれば済みますか？

A. 手軽ですが、今のテーマと合わずに崩れることや、更新が止まっているものもあります。入れる前にバックアップを取り、表示を確かめながら試しましょう。

Q. iPhoneとAndroidで見え方は違いますか？

A. 大きくは変わりませんが、フォームの入力や文字の大きさに差が出ることがあります。身近に両方あれば、どちらでも見ておくと安心です。

■よくあるご相談の例

「スマホで料金のページを開くと、表が画面からはみ出して右側が読めない」というケースがよくあります。

サイト全体は問題なく、その表だけが崩れていることも少なくありません。

表を、スマホでは横に動かして読める形に直すだけで済み、作り直すまでもないことが多いです。

■スマホで見やすいかは、問い合わせの数に直結します

スマホで読みにくいページは、内容を読まれる前に閉じられてしまいます。

Googleも、スマホでの見え方を基準にサイトを評価しています。

まずは、ご自分のスマホで一度、お客様になったつもりで見てみてください。

■直したい方、まず見てほしい方へ

表やボタンの崩れなど、スマホでの表示の不具合を直します。

WordPressの修正・不具合を解決します

https://coconala.com/services/748092

どこから直せば問い合わせにつながるのか知りたい方には、効果が見込める1か所をお伝えするお試し版の診断があります。

お試し版｜売上を止めるボトルネックを診断します

https://coconala.com/services/364970