http://design-spice.com/2011/08/24/html5css3-webdesign-concept/
http://www.adobe.com/jp/devnet/dreamweaver/articles/html5pack_css3_part6.html
要件定義の段階で対象ブラウザと合わせて、どの方針で進めるか決めたほうがいいですね。
なにも決めないと、ポリフィルで作ることになるので、グレイスフル デグラデーションで進めることを事前に了承取りたいですね。
Progressive Enhancement(プログレッシブ エンハンスメント)
どのブラウザでも基本的な水準のユーザーエクスペリエンスを提供をし、
新しく高水準のブラウザにはCSS3やjsなどでよりリッチなデザインや機能を提供するという考え方。
Graceful Degradation(グレイスフル デグラデーション)
最近のブラウザ(モダンブラウザ)を基準として制作し、
古いブラウザにもそれなりに最低限の機能を提供するという考え方。
⇒これが理想
Polyfill(ポリフィル)
古いブラウザでもjavascriptや独自実装を使用してhtml5やcss3を扱える様にし、
最近のブラウザ(モダンブラウザ)と同等の機能デザインを実装するという考え方。
⇒一番めんどくさい
例えば、対象ブラウザがIE7以降の場合で、ブロックにドロップシャドウや角丸がある場合、
css3のbox-shadow,border-radiusがIE7,8で使えないので、以下のいずれかになります。
- 画像でコーディングする
- js, filter等で拡張してcss3を使えるようにする(Polyfill)
- box-shadow,border-radius非対応のブラウザでは、ドロップシャドウや角丸がなくてもOK(グレイスフル デグラデーション)
どのブラウザでも同じ表示になるようにというのが基本なので、1か2になりますが、
事前に「古いブラウザでは多少見た目が変わる」「機能的には問題ない」という了承を得ていれば3で進めることができます。