スマートフォン対応サイトをレスポンシブWebデザインで作る

以前、スマートフォンに対応したサイト作成について記事を書きました。

⇒スマートフォンに対応したアフィリエイトサイトの作成
　

そのための手法として３つをご紹介しましたが、

　
「レスポンシブWebデザイン」

　
という手法があるのを最近、知りました。

　
実は、グーグルもこの手法を推薦してます。

　
⇒Google がお勧めするスマートフォンに最適化されたウェブサイトの構築方法

レスポンシブWebデザインにすることで、グーグルの負荷も軽くなるし、ＳＥＯ的にもよいということです。

　
さて、

　
「レスポンシブWebデザインとはどんなものなのでしょうか？」

　
ぐぐれば、きちんとした定義があるので、そちらを見ていただらいいと思いますが、簡単に言えば

　
「HTMLを１つにして、CSSを変えることで、デバイスの横幅に合わせて見え方が変わるデザイン」
　
ってことです。

　
現在、携帯電話、スマホ、ＰＤＡ端末、パソコン、テレビなどいろんな解像度のデバイスがあります。

　
ひとつひとつに対応するのは大変です。ですから、HTMLファイルひとつだけで、すべてのデバイスに対応するように作り込むのです。

　
これがうまくやれれば、サイト作成の負担は減ります。

そのためには、最初からしっかり構造設計をする必要があります。

　
テクニック的なものは、ありますが、ある程度定形化されているので、そんなに難しくはないです。

ただし、基礎的な部分はHTML5に依存するので、HTML5は学んだほうがいいと思います。

　
レスポンシブWebデザインはCSSを切り替えることで、スマートフォンなども含むすべてのデバイスに対応するものですが、実はプログラムを使えば、同じようなことはできます。
　

というより、プログラムを使うとなんでもできちゃいますけどね。

　
レスポンシブWebデザインは必ずしもプログラムを使わないようですが、例えばPHPなどを使えば、自由度はすごくあがります。

　
WordPressなどのCMSはその代表です。

　
実はWordPressのデザインにもレスポンシブWebデザインに対応したものがあります。

　
このデザインを使えばレスポンシブWebデザインなので、スマートフォンなども含むすべてのデバイスに対応できます。

　
自分でCSSなどをいじる必要もないので超楽ちんです（＾＾）。

　
ウェブサイトをHTMLで作る時には、レスポンシブWebデザインでやるといいでしょうね。PC用のサイトを作るよりは、手間がかかりますが、今後を考えたらいろんなデバイスに対応するのがベターです。

　　
また、プログラム組めるのなら、それでもいいのですが、プログラム実行環境が必要となります。

これからのサイト作成は、フレキシブルに対応できるサイトが必須です。