レスポンシブWebデザイン習得へのステップ

質問

レスポンシブWebデザインを習得したいと考えています。

現在、実務で使っている手法は2005年ごろ「ウェブ標準」という言葉が流行していた頃の
XHTML+CSSをなんとなく使っている程度（極めていない）なのですが、
ステップとしては、

1. HTML5+CSS3の基礎
2. スマートフォン向けサイト構築の基礎（モバイルファーストという観点から）
3. レスポンシブWebデザインの具体的な手法

という風に身につけていく必要があると考えています。
手順として正しいでしょうか？

回答No.1

ORUKA1951 · ベストアンサー

この世界時の流れが速すぎて
　⇒HTML5が持つ本当の意味( http://www.atmarkit.co.jp/news/200801/25/html.html )
この記事が2008/01/25ですからね。
　HTML5は、今からでも使えますが後方互換や古いＩＥがしぶとく使われている現状からHTML4.01strictを復習しておくほうが良いでしょう。XHTML1.0strict/XHTML1.1でも良いでしょう。必ずstrictであること。

1. HTML5+CSS3の基礎
　ということは、HTML4.01strictとCSS2.1
2.具体的な方法は、
レスポンシブwebデザイン　PC背景とスマホ背景変 - Webデザイン・CSS - 教えて！goo( http://okwave.jp/qa/q8042818.html )
　に書きましたが、
基本1) ページはリキッドで作成する
基本2) floatは使わず絶対配置
基本3) 背景画像(内容と関係ない画像)はサイズが変わっても支障のないもの
基本4) コンテンツとして意味のある画像や、一部が切れてはまずい画像(背景も含む)は、imgでマークアップし、display:blockとして、親コンテナブロックのサイズを参照して伸縮させる。
基本5) スマホなどモダンブラウザにはmediaqueryでスタイルシートを切り替える。

お礼

ご丁寧に回答をいただき、ありがとうございます。

まず。@ITの記事自体が非常に興味深いものでした。
そして、ご指摘のように、私が実務で制作するウェブ・ページの対象者は、
そのような環境を使われている可能性の高い層で、
HTMLのバージョンは、そういったものを中心に考えることを心がけたいと思います。

漠然と、レスポンシブWebデザインをするためには
HTML5+CSS3でなければならない、という解釈をしていました。

具体的な方法として挙げていただいた点は
ひとつづつ確認し学んでいきたいと思います。