ホームページのスマホ表示とパソコン表示の違いの見分け方

みなさんこんにちは。

合同会社リードの金子です。

今回はホームページのスマホ表示とパソコン表示の違いの見分け方を紹介したいと思います。

自社のホームページがスマホ対応になっていない!!

と気づく方って案外少ないんです・・・

というよりかは、

そして、そもそもスマホ表示なんて気にしていない。

会社のパソコンでしか見ていない・・・

そもそもスマホで確認もしたことも無ければ、気にもしていない方って、まだまだ多いんです。

だからこの記事をご覧になっているあなたは、もうスマホ表示について気にしているので、もうこの時点で改善できたようなもんです!

私のクライアントさんでも、スマホで見れるからスマホ対応になっているでしょ、問題ないでしょ。

なんていう感じで言われたりすることもあるのですが、実際にスマホ画面で解説をして「ここが~こうでですね~」と、あれこれと説明すると「なるほどね」と納得してくれます。

スマホ表示の違いさえ知っていればもっと多くの人がスマホ対応にする意識をしてもらえるかと思い、今回はスマホ表示とパソコン表示の違いを解説していきたいと思います。

ちなみに、何故スマホ表示が大切なのかは、記事の最後でさらりとお伝えしておりますので、これからのホームページに役立ててください。

目次

ホームページのスマホ表示とパソコン表示の違いの見分け方

ホームページのスマホ表示とパソコン表示の見分け方としては2つあると思います。

その2つがこちら

1、画像や文字が拡大や縮小しなくても確認できるか
2、パソコンのレイアウトとスマホのレイアウトが別になっているか

この2つの確認をしていくことで、スマホ表示なのかパソコン表示なのかを見分けることが可能ですので、順番に解説していきます。

1、画像や文字が拡大や縮小しなくても確認できるか

まず、スマホでホームページを表示したときに、画像や文字が問題なく確認できるかどうかをチェックします。

例えば、スマホで観覧したときに、このような感じのサイトがあったとして

スマホでメニューなどをタップしようとしても、小さすぎて目的のメニューが押せない・・・

もしくは、メニューの文字すら小さすぎて見えない・・・

スマホを2本の指で、タッチスクリーンを、つまんで拡大しないと読めない・・・

こんな表示の場合には、スマホ対応になっていません。

文字が小さすぎたりする場合もありますが、この逆もある場合があり

画像などが大きすぎて、レイアウトそのものが崩れている・・・

こういった場合もスマホ対応になっていない特徴です。

2、パソコンのレイアウトとスマホのレイアウトが別になっているか

スマホで表示したときに、文字も画像も普通っぽいけど、パソコンで見たときに、やたらと表示状態がスリム

【パソコン表示画面】

もしくは、やたらと左より

こんな感じの表示であれば、スマホ対応になっておりません。

というよりかは、スマホでもなんとか見やすくするようにわざわざパソコン表示状態を無視したレイアウトなのかもしれませんが、これらはスマホ対応ではなく、本来のスマホ対応はパソコン表示とスマホ表示のレイアウトが別々なレイアウトになります。


【スマホ表示】※スクロールで確認


【パソコン表示】※スクロールで確認

スマホ表示では、画像などが横並びなどにはなっていないレイアウトで、基本的に縦並び表示なのが特徴です。

パソコンで見たホームページとスマホで見たホームページがしっかりと別表示になっているか。

ちゃんと縦並び表示で、文字や画像は見やすくなっているか。

この辺をチェックしてみてください。

これからスマホ表示が必須な理由

ここまでで、何となくスマホ表示とパソコン表示の違いは分かってもらえたと思いますが、そもそも何故スマホ表示をする必要があるのか?

スマホでも何とか見れなくはないし、何となく分かればいいのでは?

な~んて思っているとヤバイですよ~。

いまやスマホの観覧率は70%近くにもなっています。

つまり、7割の人がパソコンではなく

スマホで観覧する時代です。

わざわざ残りの少数派の30%の人達に合わせる必要なんてありませんよね。

もはやホームページの表示確認自体がパソコンでの表示を確認するのではなくスマホでいかに見やすなっているのか。

スマホ視点でホームページのレイアウトを考えなくてはなりません。

今はまだいいかな・・・なんて思っていると、どんどん遅れを取ることになります。

この機会に是非一度、スマホからのレイアウト確認をして、自社ホームページの改善に繋げてもらえたらと思います。

それではまた!