ITエンジニア/デザイナ向けにオープンソースを毎日紹介

deCSS3はCSS3のプロパティを解除してCSS3非対応Webブラウザの表示を確認できるブックマークレットです。

最近のモダンなWebブラウザは大抵CSS3に対応しています。格好いいイフェクトを実現するのも容易ですが、レガシーなWebブラウザでの表示をつい怠ってしまいがちです。そこでCSS3の設定を外してくれるdeCSS3を使って表示を確認してみましょう。


こんな感じのギャラリーが…


一直線に。


それでも拡大表示はできるので実用レベル。


上から現れるアラートが…


こんなに細く。でもアニメーションはしているからまだ大丈夫。


配布サイトで実行すると…


ちょっとのっぺり。

deCSS3はアニメーションやボックスシャドー、メディアクエリー、トランジションといった幾つかのプロパティを外してくれます。deCSS3で確認すれば、レガシーなWebブラウザでの表示がある程度保てているかどうか、手軽に確認できるでしょう。

deCSS3はJavaScript製のソフトウェア(ライセンスはWTFPL)です。


MOONGIFTはこう見る

レガシーなWebブラウザをどこまでサポートするかは常に問題になります。基準になるのは大手のWebサイトのポリシーと思われますが、大手サイトに比べて小さなWebサイトでは開発リソースも多くないのでそこまで手間をかけられないという問題もあります。

個人的にはWebサイトにおけるアクセス比率において非サポートWebブラウザが20%を切った辺りから考えるべきではないかと思います。ぜひアクセス解析を使って現状をチェックしてみましょう。思いのほか対応ブラウザが多ければ、表示が崩れない程度でサポート対象外とするのも十分考えられるでしょう。

deCSS3 - a bookmarklet for graceful degradation.

davatron5000/deCSS3

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2