そこで、実際に作ってみようとする時、参考になるのが、ストレートなタイトルの、こもりまさあき著「レスポンシブ・ウェブデザイン標準ガイド あらゆるデバイスに対応するウェブデザインの手法
HTMLとスタイルシートでWebページを作成している方なら、すぐに理解でき、参考になるかと思います。画像や動画、Mapの扱い、ツールなど実例多数。
ただ、サンプルのソースのフォントサイズは、老眼にはちと厳しいです。が、出版社サイトでダウンロードが可能です。
CSS3の仕様の中に、JavaScriptのように、ブウラザのサイズに合わせて、適用させるスタイルを切替える機能(Media Queries)がつき、最近のブラウザが、それに対応してる事で実現できた技法ですが、例によってIE8以下では、対応していないところもあり、その対策についても書かれています。
一番、参考になったのは、まずシンプルなスマホ用のレイアウトから始め、徐々に大きいサイズのデザインを考えていく、という基本線。
他の例では、逆の順番でやっているケースも多いようですが、実際試してみると、その理由が納得できます。ただ、コンテンツ・テンコ盛りを要求しがちなクライアントの理解を得るのは、大変かもしれません。
尚、「あらゆるデバイスに対応する」とはいっても、当然、デバイス側のブラウザがCSS3に対応していないといけません。PCのIEについては、ある程度対応できるので大枠は、いけそうです。
しかし、古いフューチャーフォンの場合は、PHPやPerlなどサーバー側で対応する、従来の手法が必要になります。旧ケータイ用のページが必要な場合は、この本だけでは十分ではありませんので、念のため。
「レスポンシブ・ウェブデザイン標準ガイド あらゆるデバイスに対応するウェブデザインの手法