私たちは、ホームページをスマホ対応にするために、多くのケースではレスポンシブウェブデザインにするのが一番良いと考えていますが、スマホに対応するには、他に後2つ方法があります。
スマホ専用のホームページをつくる
端末ごとに専用のホームページをつくる方法です。パソコン用ホームページとは別に、スマホ用ホームページやタブレット用ホームページをつくります。この場合、各デバイスごとに異なるHTMLファイルを持つことになるので、下記のようにデバイスごとにホームページURLが異なります。
PCホームページ http://◯◯◯.com/
スマホホームページ http://◯◯◯.com/sp/
そのメリットは、HTML/CSSファイルがPCとスマホ向けで別なので、独立した運用管理ができる。PC向けのデザインとスマホ向けのデザインをそれぞれの環境に合わせたものにできるといった点です。しかし、HTML/CSSが完全に独立した別物なので更新するときは両方とも更新しなければならない。URLが異なるため流入が分散するのでSEOやSNSによるシェアに弱いというデメリットもあります。
同一URLで、端末によって違うhtml、cssを返すようにする
ページが呼び出された際にUA(ユーザーエージェント)を判別して表示内容を振り分けます。サーバーサイド(PHPなど)、クライアンサイド(JavaScriptなど)などを用いて対応します。
PC向けのデザインとモバイル向けのデザインをそれぞれに適応したものにできる。SEOやSNSによるシェアに強いというメリットがありますが、URLが同じでも呼び出しているソースは別々なので、両方のHTMLを更新しなければならない点が先の方法と同じでメリットで、更にhtml、cssコーデイングとは別にプログラミングをする必要があります。
レスポンシブウェブデザインを利用する
先の2つの記事で書きましたが、私どもが推奨する方法です。
CSS3のメディアクエリを利用することで、端末(ディスプレイサイズ)ごとに異なるCSSを適用させます。レスポンシブテーマを使用してワードプレスで作成するとこの動作になります。HTMLが同じなので、1度でPC向けホームページとモバイル向けホームページの両方が更新される。SEOやSNSによるシェアに強いというメリットがあり、何といっても、グーグルが推奨しています。
スマホ対応ワードプレスセルフプラン
スマホ対応ワードプレス新規構築プラン
スマホ対応ワードプレスリニューアルプラン
ご存知通りド素人です。WEBページの表示内容の定義と見せ方の定義を分離して、後者は予め複数用意しておき、表示するデバイスにあわせて切り替えてやるっていう感じですか。
だいたい合っているかなです。他2つの方法というのは、定義と見せ方の変更ではなく、見せるホームページ自体を変えます。ここは近いうちに具体的な方法を書こうかな。
定義と見せ方の変更はレスポンシブの方ですね。