書店やウェブ上には、ありがたいことに素晴らしいCSS3の書籍やブログがたくさんあります。きっと、今までCSS3のプロパティを勉強して様々なことを理解しているでしょう。
でも、今現在のCSS3の情報を理解できるからといってCSS3の学習を止めてはいけません。
「text-shadow」や「box-shadow」などはCSS3でもまだ始まりにしかすぎないのです。これからが本当のCSS3の時代が到来します。
皆さんがCSS3をもっと学ぶべき理由を紹介します。
CSS3の大半はWDの状態
最初にCSSの現在のW3Cにおける仕様策定の進捗状況を調べてみましょう。 ここにある表をみてください。これは、CSSのワーキンググループの仕様策定の進捗状況を示します。
表を拡大してみます。オレンジ色の部分が多いことに気づくでしょう。
そこに書かれた「WD」とは 「Working Draft」 といって、まだ完全に仕様が固まっていないことを意味します。「inactive」 はワーキンググループの途中で活動が止まっていることを意味します。
見ていただくとわかりますが、CSSは仕様がこれから固まるものが多く残されています。
現在販売されているCSS3の書籍は、WDの状態でないプロパティを中心に説明しています。書籍は販売時に内容が変わることが予想される内容の掲載を避ける必要があるからです。これは致し方ないことですし、誰が悪いわけではありません。
WDから先に進まない３つの理由
では、なぜWDから先に進まないのでしょうか？
これには大きく３つの理由があるのかもしれません。
- 新しくCSS3のモジュールが提案されるから
- 技術的な検証が議論が必要だから
- ブラウザ同士の目指す仕様が異なるから
１，新しくCSS3のモジュールが提案されるから
次々と新しいCSSのモジュールが提案されることで、CSSのWGの議論が追いつかないということです。WGでは日夜頑張って議論がされていますが、単純に議論することが多く進まないという理由があります。
２，技術的な検証が議論が必要だから
ブラウザがCSSを実装するには、どのように実装するべきかというロジックが必要です。
そのロジックを構築するためには、様々な技術的問題をクリアをしなければなりません。時にはCSS3の内容がCSS２に影響を与える場合など、CSS2に立ち戻る必要もあります。Web標準では後方互換性を保つ必要があるので議論に時間がかかります。
３，ブラウザ同士の目指す仕様が異なるから
ブラウザの目指す仕様が異なるために議論が進まないことがあります。例えば、flexboxというプロパティには、Legacyと呼ばれる古い構文が存在します。これは、IE10が実装していますがIE11では新しい構文を実装しています。Chromeは一貫して新しい構文を実装しています。このようにおなじFlexboxでもブラウザによって目指す方向が違うことがあったりするので、その意見をあわせるために時間がかかることがあります。
-ms-」があるが、IE11ではベンダープリフィックスはない。CSS3の”真打ち”はレイアウトモジュール
「真打ち」とは、落語などで最も身分が高く実力のある人を意味します。
CSSにもし真打ちがあるとすれば、それはレイアウトモジュールでしょう。というのはレイアウトはCSSの大きな問題の一つでしたが、 CSS3ではその問題を解決するだけの実力があります。
floatは力不足だった
floatをレイアウトのために私達は利用しています。理解をすると非常にたくさんの様々なレイアウトを構築できる素晴らしいプロパテイでしょう。 しかし、floatプロパティはレイアウトを組むためのプロパティではありません。画像周りのテキストの流れをコントロールするだけのものでした。
そのせいかfloatを利用する時には、「clearfix」や「overflow:hidden」で親要素の高さの問題などに対処する必要があります。「float」を利用すると結果としてハックのような方法が必要になってしまいます。
またFloatでは、コンテンツの順番をHTMLに制御されるたり、テキストのvertical-alignを揃えたりするのに苦労してしまいます。
レイアウトモジュールが与える解決策
一方、CSS3のレイアウトモジュールでは様々な有用なプロパティが策定中です。例としてflexbox, grid,regionなどのプロパティです。Flexboxは自由にコンテンツの順番を入れ替えたり、verticalな文字揃えも自由自在に行うことができます。
レイアウトはブラウザベンダーにとってはレンダリングエンジンの設計において技術的に仕様が固まるまで長時間がかかってきました。
しかし、ここにきてCSS3のレイアウトモジュールは大きく動きだしています。下記の表をみるとFlexboxなどは、モダンブラウザの最新バージョンでは、ほとんど実装されるレベルまできました。
視野を広くしよう
仕事が多くなると新しい知識のアップデートがおろそかになってしまいますが、視野を広くたもち、将来的に自分のフィールドで何が起きているかを理解し広い視野で計画をたてて勉強することを考えることが必要です。普段は目の前の案件が忙しいかもしれませんが、少し自由研究の時間をつくりましょう。
CSS3は、2014年に本格的に勉強が必要になるでしょう。
参考リンク
The CSS working group is irrelevant
CSS current work& how to participate
- http://www.w3.org/Style
0 件のコメント:
コメントを投稿