1300の優良サイトが選んだシリース、第5回は「CSSのポリフィル・シム」です。
レガシーIEは、CSSに不具合や新標準への未対応という問題があります。日々追加されるCSS3プロパティや新しいセレクタへの対応を必要とする場合、「ポリフィル」または「シム」と呼ばれる機構を持つライブラリにて対応します。
今回、1300のサイトを調査し、利用頻度の高いCSSポリフィル・シムライブラリについて調査しました。
この領域でベストプラクティスと呼べるものはありませんが、網羅的な調査の結果得られた本サイトのライブラリ一覧は、制作の中で生じた課題に対する解決策の殆どカバーしているはずです。また、利用実績も可視化しているため、実用性判断の材料として活用してみてはいかがでしょうか。
IE7-js (35件 - シェア：2.69%)
公式サイトはIE7-jsという名前ですが、現在はIE7、IE8、IE9と3つのラインナップがあるようです。擬似クラス、属性セレクタ、透過PNG、position:fixed、margin:0 auto、max-height/width、min-height/width、その他IE5/6のバグ修正に対応します。
- 公式サイト：https://code.google.com/p/ie7-js/
- ライセンス：MIT License
- 開発：Dean Edwards
- 内訳：IE7.js(12件)、IE8.js(2件)、IE9.js(21件)
jQuery exFixed (37件 - シェア：2.84%)
レガシーIEで、CSS2標準のposition:fixedを動作できるようにするjQueryプラグインです。
- 公式サイト：http://d.hatena.ne.jp/cyokodog/20090323/jQueryExFixed
- ライセンス：MIT / GPL Lincenses
- 開発：Cyokodog(日本人)
css3-mediaqueries.js (19件 - シェア：1.46%)
レガシーIEで、CSS3標準のMediaQueriesを動作できるようにするライブラリです。
- 公式サイト：https://code.google.com/p/css3-mediaqueries-js/
- ライセンス：MIT License
fixed.js (16件 - シェア：1.23%)
レガシーIEで、CSS2標準のposition:fixedを動作できるようにするライブラリです。
- 公式サイト：http://www.doxdesk.com/software/js/fixed.html
- ライセンス：無料の表記のみ
- 開発：Andrew Clover
selectivizr (13件 - シェア：1.00%)
レガシーIEで、Web標準のSelectors Level 3を動作できるようにするライブラリです。かつては「ie-css3.js」という名称でした。
- 公式サイト：http://selectivizr.com/
- ライセンス：MIT License
- 開発：KeithClark project.
- 内訳：selectivizr(8件)、ie-css3.js(5件)
respond.js (13件 - シェア：1.00%)
レガシーIEで、max-height/width、min-height/width、MediaQueriesといった、レスポンシブWebデザインに必要なCSS機能を動作できるようにするライブラリです。
- 公式サイト：https://github.com/scottjehl/Respond
- ライセンス：MIT / GPLv2 licenses
- 開発：Scott Jehl
jQuery corner (9件 - シェア：0.69%)
レガシーIEで、border-radiusを実現するjQueryプラグインです。
- 公式サイト：http://jquery.malsup.com/corner/
- ライセンス：MIT and GPL licenses
- 開発者：Dave Methvin、Mike Alsup
minmax.js (8件 - シェア：0.61%)
レガシーIEで、max-height/width、min-height/widthが動作できるようにするライブラリです。
- 公式サイト：http://www.doxdesk.com/software/js/minmax.html
- ライセンス：不明
- 開発者：Andrew Clover
最後に
統合的に多くのCSSをポリフィルしてくれるもの、最小のポリフィルをしてくれるもの、jQueryを使ったシム、様々な提供方法がありますが、共通してW3CのCSS3を参考にしています。主として、レスポンシブWebデザインやリキッドレイアウトを実現するためのライブラリに偏っているようです。
同じ目的のものでさえ、これだけ豊富な種類が公開されているのです。CSS3の中でも新しいものは使えない環境がまだまだ多く存在しますが、諦めないでライブラリを調査してみるというのも手ではないでしょうか。
