レスポンシブWEB（ウェブ）デザインとは | デザインで世界を平和にするサイト☆I Love Design

2013.12.19レスポンシブウェブデザインとは

スマートフォンが主流になってきた2013年の携帯電話業界。

インターネットもパソコンではなくスマホで見ているという人も多いと思います。

どのようなデバイスで見ても見やすく最適化されたサイトも増えています。

そんなデザインの方法として、今やレスポンシブウェブデザインが注目されています。

レスポンシブウェブデザイン(Responsive WEB Design)とは、ひとつのHTMLでパソコンやタブレット、スマートフォン等どんなデバイスでも見やすいように最適化して表示するという考え方から出来ているデザインのことです。

これまでは、アクセスしたデバイスによって、パソコン用、スマートフォン用などと振り分けてサイトを表示させていることも多かったのですが、それでは、それぞれサイトを作らなければいけませんでした。

「今ホームページを持っているんだけど、スマートフォン用のサイトを作って欲しい」

そんなオーダーもありましたが、弊社がホームページの制作で提供しているWordPressのテーマはレスポンシブウェブデザインになっているものだけを使っているので、わざわざスマホ用にサイトを作らなくてもいいわけです。

Googleもこのデザイン方法を推奨しているので、SEO的にも有利ですしね。

基本的にはパソコンで表示されてるもののパーツの形をCSSで装飾を変えたりし、画面のサイズによってデザインを切り替えている事が多いです。

この画面サイズによって表示方法を変えるというのが、メディアクエリという方法です。

ただ、この場合パソコンで表示している画像をスマートフォンで見ると小さくなるのは当たり前です。

しかし、それでは困るので、パソコン用にはこのAの画像、スマートフォン用にはBの画像、あいだの大きさのタブレットではCの画像・・・のように、サイズによって表示させる画像を切り替えたりもします。

レスポンシブウェブデザイン(Responsive WEB Design)でホームページを作る場合、パソコン用だけにデザインしたらすむ話ではなく、むしろスマートフォン用にデザインしたものをいかにパソコンでもスカスカにならずに表示させるか・・といったデザインの工程となります。

これがモバイルファーストという考え方なのですが、そのモバイルでの使い勝手、見やすさのままパソコンでも違和感なく表示させるようにデザインするには、WEBデザイナーとコーダーとの連携、お互いの理解が必要となってきます。

弊社でも、その連携が可能になったからこそ、レスポンシブウェブデザインのサイトを提供できるようになりました。

これからの時代、ホームページへのアクセスはスマートフォンからの方が増えてくるでしょう。

一人一台の携帯の時代から、スマホへ機種変更せざるを得なく慣れば、否が応でもスマホからインターネットを利用する場面も増えるでしょう。

そんな時代に対応すべく、まずはレスポンシブウェブデザインを実装してみましょう〜！

コメントは受け付けていません。