いつまで使えばいい?CSS3ベンダープレフィックスの切り時チェック!

いつまで使えばいい?CSS3ベンダープレフィックスの切り時チェック!

もりた

もりた

コーヒーは命の水!もりたです。

css3の正式勧告はいつだろうと指をくわえながら使っている現在ですが、そんな中どうしても使わなければいけないベンダープレフィックス。
全部書き出すとすごくいっぱいあるみたいなんですけど、とりあえず-webkit-と-moz-だけは書くようにしてるよという人は多いんじゃないでしょうか。私のことです。
でもあれってコードが長くなるからめんどくさいなーと思ってる人は多いんじゃないでしょうか。私のことです。

そのベンダープレフィックスっていつ使うのをやめればいいのかなと思ったら、こういうことらしいです。

ベンダープレフィックス(接頭辞)とは、ブラウザベンダーが独自の拡張機能を実装したり、草案段階の仕様を先行実装する場合に、 それが拡張機能であることを明示するために付ける識別子のことです。
【中略】
ただし、ベンダープレフィックスは、 草案(Working Draft)が勧告候補(Candidate Recommendation)になったときには外すことが推奨されています。

引用元:ベンダープレフィックス-CSSの基本[HTMLクイックリファレンス]

なるほどー。

css3の開発状況はW3Cのサイトで確認することができます。
リンク先で緑色の「CR」「PR」「REC」になってるプロパティだったらベンダープレフィックスを外すよう推奨されてるってことなんですね。
なるほどなるほどー!

でもこれって、具体的にどのプロパティで外していいかわかりにくいですね…。
ということで、ベンダープレフィックスを外しても大丈夫かチェックするためのページを作ってみました。

ベンダープレフィックス チェック用ページ

一つのプロパティにつき、

  • ベンダープレフィックスがなにもついていないもの
  • webkit/mozila/Opera/IEのベンダープレフィックスがついたもの

の2個の要素をセットにして表示させています。
主要なすべてのモダンブラウザで、ベンダープレフィックスなしの要素が
正常に表示されているプロパティは「CR」以上、
逆の場合はまだ「WD」というわけです。
まあ…IE9はプロパティ自体を実装してないことが多いですけど。
複数のブラウザで一緒に開くと、実装状況がわかって面白いです。

IEに関してはメジャーバージョンアップがこない限り変動はないのかもしれませんが、
Google chromeやFirefox、Operaといったモダンブラウザの対応状況は随時変化があると思うので、ときどきチェックして、不要なコードをすっきりさせてみてはいかがでしょう。

LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。

Webサイト制作の実績・料金を見る

この記事のシェア数

デザイナーでイラストレーターのもりたです。 好きなモビルスーツはνガンダム、好きなレイバーはイングラム、好きな勇者はガオガイガーです。

このメンバーの記事をもっと読む
デザイン力×グローバルな開発体制でDXをトータル支援
お問い合わせ 会社概要DL