ホームページはマルチディバイスの時代へ

※ このデモは、①パソコンで、②Internet Exlorer以外のブラウザ(Chrome、Safari、Firefox)で、ご確認ください。
スマートフォンの急増は、ウェブにとっても大きな変化をもたらしています。今までPCで閲覧されていたウェブページが、小さなスマートフォンやタブレットで閲覧されるようになりました。さらに今回の変化は、単にディバイスが増えたのではなく、PCよりも便利なディバイスが登場し、PCを脅かしていると思えます。個人的にはスマートフォンとタブレットが登場してから、PCでネットショップを見ることは、全くなくなりました。
当然、PC用に作られたページは、スマートフォンでは閲覧し難く、企業はスマートフォンに最適化したページを作ることが急務となっています。しかし、多くの企業が、予算や時間的な制約、技術的な知識不足から、スマートフォン対応ページだけを、新たにPCページとは別に作っています。
残念ながら、このことはページ更新等の運用とスピードが重要なウェブにおいて、時間もコストも2倍以上になることを意味します。
これを避けるために、1ソースを元にデザインだけをフレキシブルに変えるレスポンシブWebデザインを提案いたします。

レスポンシブWebデザインとは?

レスポンシブWebデザインでは、元となる情報(HTMLファイル)は1つです。
そして、スマートフォンやタブレットには、CSSと呼ばれるデザインファイルを変更することで対応します。そのため、ページの更新にあたっては、そのHTMLファイルひとつだけを変更すれば、全てのディバイスに反映されます。
もしレスポンシブWebデザインを使わず、PCとスマートフォンページを別々に制作した場合は、PCとスマートフォンの2ファイルを変更しなければなりませんので、時間もコストも2倍掛かることになります。

レスポンシブWebデザインの弱点?

レスポンシブWebデザインは考え方も先進です。
そして、古いブラウザ、特にマイクロソフトのInternet Explorerに対応しません。
いまだにInternet Explorer 6でのアクセスが最も多いようなサイトには向きません。(IE6が最も多いということは、スマートフォンでのアクセスが少ないということにもなり、スマートフォン対応が不要とも考えられますが。)
しかし、これは重要なことだとは、私は思っておりません。スマートフォンやタブレットが、PCのアクセス数を追抜くのは時間の問題であるとともに、時代に乗り遅れたInternet Explorerはシェアを減らつつあります。
※ ブラウザ対応は、最新版と1つ前の2バージョン対応とさせていただきます。

ナビをクリックしてください

能書きはさておき、「スマートフォンのサイズ」「タブレットのサイズ」「パソコンのサイズ」をクリックしてください。 元のHTMLファイルはひとつだけです。でも画面のサイズによって、それに最適化したデザインに変更されます。 これがレスポンシブWebデザインです。
Copyright © YellowMagnet.Com All Rights Reserved.