スマホサイトを作る方法は、大きく分けて２つの方法があります。
具体的には、下記の２つの方法です。
■ スマホサイトを作る２つの方法
１．１つのホームページで、パソコンとスマホのどちらでも
綺麗に見れるように作成する「レスポンシブ・ウェブデザイン」
２．パソコン用サイトとスマホ用のサイトを別々に作成する
「スマホ専用サイト」
|
１つのホームページで、パソコンとスマホのどちらでも綺麗に見れるように作成する「レスポンシブ・ウェブデザイン」と、
パソコン用サイトとスマホ用のサイトを別々に作成する「スマホ専用サイト」です。
まずは、１つ目の方法である、「レスポンシブ・ウェブデザイン」について、お伝えしますね！
１つのホームページで、パソコンとスマホのどちらでも、
綺麗に見れるように作成する「レスポンシブ・ウェブデザイン」
「レスポンシブ・ウェブデザイン」とは、訪問者が使っている端末の「画面サイズ」によって、ホームページの形が自動的に切り替わるようにする方法のことです。
たとえば、ホームページの訪問者が「パソコン」を使っていたら、パソコンの画面サイズに合わせたホームページが表示されますし、
ホームページの訪問者が「スマホ」を使っていたら、スマホの画面サイズに合わせた形のホームページが表示されます。
このように、訪問者が使っている端末の「画面サイズ」によって、表示させるホームページの形を切り替えることを、「レスポンシブ・ウェブデザイン」と言います。
なぜ、このようなことができるのかというと、ホームページにアクセスがあったときに、その訪問者の画面サイズを判断して、その画面サイズに合わせたスタイルシートのファイルを使うためです。
ホームページは１つなのですが、スタイルシートのファイルを複数用意しておくことで、画面サイズに合わせた形のホームページを表示させることができる、ということですね。
「レスポンシブ・ウェブデザイン」のメリット
- １つのホームページでコンテンツを管理できるため、更新がラク！
- ホームページのURLも１つで良いので、管理もしやすい！
|
「レスポンシブ・ウェブデザイン」のメリットは、文章や画像を表示させているホームページは１つであるため、今後の更新がラクということです。
また、ホームページのURLも１つで良いので、管理もしやすいというメリットがあります。
特に、「更新がラク」というのは、ホームページの運営者にとっては大切なことなので、これが、レスポンシブ・ウェブデザインの大きなメリットになります。
「レスポンシブ・ウェブデザイン」のデメリット
- １つのホームページで、スマホとパソコンの両方で綺麗に表示されるように作りこむ必要があるため、作成が難しい。
- レイアウトやデザインの自由度が低くなってしまう。
- コンテンツを削ることができない。
- スマホでアクセスしたときも、ページ全体を読み込むため、表示が遅くなってしまう。
- 商品の購入率が落ちる傾向がある。
|
「レスポンシブ・ウェブデザイン」のデメリットは、１つのホームページで、スマホとパソコンの両方で綺麗に表示されるようにホームページを作りこむ必要があるため、作成がとても難しいということです。
実際に、現在ホームページを持っている人が、そのホームページを「レスポンシブ・ウェブデザイン」にする場合、ほぼすべて作り直すことになりますし、パソコンとスマホの両方の表示を気にしながら作るため、レイアウトやデザインの自由度も低くなってしまいます。
さらに、スマホを使っている人は、ホームページの文章をあまり読んでくれないので、要点だけをうまくまとめる必要があるのですが、スマホからのアクセスがあった場合だけ、文章を削るということができないのですよね。
また、スマホでアクセスをしたときも、ページ全体を読み込むため、通信速度が遅い外でホームページにアクセスした場合、表示が遅くなってしまいます。
そして、何よりも、「レスポンシブ・ウェブデザイン」は、パソコンサイトをスマホの画面サイズに合わせて表示させているだけであるため、商品の購入率が落ちてしまう傾向があるというのが、最大のデメリットになります。
「レスポンシブ・ウェブデザイン」の実現方法
「レスポンシブ・ウェブデザイン」のホームページは作成が難しいため、WEBデザイナー以外の人が、自分で行うのは、現実的ではありません。
たとえば、現在ホームページを公開している人が、そのホームページを「レスポンシブ・ウェブデザイン」にするためには、スタイルシートのファイルを変更することが必要です。
具体的には、画像解像度やウィンドウの幅、デバイスの向きなどの指定条件に合わたスタイルシートを使うことが必要になりますし、ホームページも全体的に修正していくことも必要になります。
ただ、ホームページの作成に、WordPress（ワードプレス）を使っている場合は、自動的にスマートフォンに対応したサイトを表示してくれるプラグインがありますし、「レスポンシブ・ウェブデザイン」に対応したテンプレートもあります。
そのため、WordPress（ワードプレス）を使っている人であれば、比較的、簡単に実現することができますよ。
あとは、Wix やJimdo などのホームページ作成ソフトであれば、できあがるサイトが、元々「レスポンシブ・ウェブデザイン」になっているので、普通にホームページを作れるだけで、「レスポンシブ・ウェブデザイン」になります。
「レスポンシブ・ウェブデザイン」を実現するためには、このような方法を行うことが、一般的です。
「レスポンシブ・ウェブデザイン」について、私が思ったこと
１つのホームページで、訪問者が使用している画面サイズに合わせて、表示が自動的に最適化されるので、「レスポンシブ・ウェブデザイン」はとても画期的だと思いました。
何よりも、コンテンツは１つのホームページで管理されているため、１つのホームページだけを更新していけば良いということが、運営者にとっての大きなメリットですよね。
ただ、「レスポンシブ・ウェブデザイン」は、ホームページの運営者にとっては、ラクで良いのですが、お客様（ホームページに訪れた人）にとっては、メリットが少ないです。
実際に、「レスポンシブ・ウェブデザイン」は、表示を最適化しているだけであり、スマホからアクセスした場合、表示も遅くなりますし、使い勝手もあまり良くありません。
そもそも、パソコンでホームページを見る人と、スマホでホームページを見る人は、明らかに動作が違うにも関わらず、１つのサイトで、どちらのユーザーも使いやすいように作ることに、無理があるのですよね。
「これは便利だ！」と言われて、画期的なアイディアだと思われた「レスポンシブ・ウェブデザイン」ですが、実際にホームページを運営してみると、「ホームページの運営者の管理がラク」というメリットだけで、それ以外のメリットがないのが現状です。
「レスポンシブ・ウェブデザイン」が、これから、どのような方向に進んでいくのか、よく見ていきたいと思っていますが、、、
私が実際にホームページを運営してみた感想としては、「レスポンシブ・ウェブデザイン」よりも、スマホ専用サイトを作った方が、売り上げは多くなりました。
「レスポンシブ・ウェブデザイン」が悪いというわけではなく、動作の異なるパソコンユーザーと、スマホユーザーの両方のことを考えながら作ることは、とても難しいというのが、私が思ったことになります。
それでは、次のページでは、パソコン用サイトとスマホ用のサイトを別々に作成する「スマホ専用サイト」について、お伝えしますね！
