記事内に広告を含む場合があります。

スマホサイトとPCサイトの違い・PCでスマホサイトを見る方法

WordPressでサイトを作る場合、複数のデバイス(画面サイズ)に自動的に対応できる「レスポンシブデザイン」と呼ばれる制作方法をおすすめします。

スマホサイトとPCサイトを別々に作成すると手間がかかりますが、レスポンシブデザインなら1つのURLに対して1つのHTMLで対応可能です。これにより、ページの運用コストを削減し、ユーザーに対して統一したメッセージを届けられます。
Googleは2012年頃からレスポンシブデザインでのサイト制作を推奨しています。

昨今では殆どのサイトで、PCからのアクセスよりもモバイルからのアクセス数が多くなっているため、そもそもコンテンツをPC用、スマホ用と分ける必要性がなくなりつつあります。
ユーザーがどんなデバイスでアクセスしてきても、コンテンツを見やすく提供できるようにしましょう。

ブログの始め方はこちらの記事をご覧ください。
【ブログの始め方】初心者がブログで稼げるようになる方法と手順

スマホサイトとPCサイトのURLを分けるべきか

スマホ用とPC用で別々の内容を表示したい場合、URLをそれぞれ分けて作成する方法もあります。

しかし、この方法はおすすめできません。

URLを分ける際のデメリットとして、以下の点が挙げられます。

・管理が大変になる
・検索エンジンの制御が複雑になる

スマホサイトを作る時の注意点

WordPressブログの場合、使用しているWordPressテーマがレスポンシブ対応であれば、基本的にスマホ対応ができているはずです。

ただし、スマホ対応が十分かどうかは、Googleが示す「モバイルフレンドリー」であるかどうかを基準に判断されます。

レスポンシブで制作されたからといって、必ずしもモバイルフレンドリーになっているわけではありません
そのため、注意が必要です。

モバイルフレンドリーになっているか

レスポンシブデザインのテーマを使ってサイトを作ったからといって
モバイルフレンドリーになっているとは限りません

必ず、モバイルフレンドリーかどうかを確認しておきましょう。

テキストの量や改行が適切か

レスポンシブデザインで制作する際に、パソコンでの見え方よりもスマホでの見え方を意識する必要があります。

特に改行や段落の取り方については、PCとスマホでは見え方が異なるので、
更新する度にスマホでの見え方を確認しましょう

PCとスマホでの見え方の違い

ブログを制作する際、パソコンで作業していても、実際の読者はスマホからアクセスしているケースが多く見られます。

そのため、スマホでの見え方を意識してページを作成することをおすすめします。

たしかにパソコンでのデザインよりもスマホを意識したサイトのデザインの方が重要ですね。

PCでスマホページを見る方法

スマホでの見え方を確認する際、毎回スマホでチェックするのは手間がかかりますよね。

Googleのブラウザ「Google Chrome」を使用すれば、PCから簡単にスマホビューを確認できます。

ページ上で右クリックして「検証」を選択してください。
スマホのようなアイコンが表示されるので、そのアイコンをクリックすることでスマホビューに切り替えられます。

参考 モバイルサイトを実装する 3 つの方法developers.google.com