先日「CSSを整理整頓！使われていないセレクタをチェックできる「CSS Redundancy Checker」」でお伝えした使わなくなったCSSを確認できるWEBサービスですが、このサービスのfirefox拡張版とも言えるのが今回紹介する「Dust-Me Selectors」です。





前回のチェック時にも痛感しましたが、色んな機能を抜き差ししているとあっという間に使われないCSSセレクタで汚れていくものです。またテンプレート等を使用している場合せっかくセレクタが用意されているのにも関わらず使っていないなんて事もあります。

詳しくは以下

「Dust-Me Selectors」より拡張機能をインストール後、firefoxを再起動。再起動後firefoxの右下に以下の用のアイコンが出ればインストール完了です。





使い方は至って簡単で、使われていないCSSセレクタを見るには、アイコンをクリックすれば解析してくれます。そして下記の様に使われていないCSSをまとめてリストアップしてくれます。





スタイルシートは何個でも読み込みができ蓄積されていきます。保存されたリストはCSVデータで出力も可能です。前回紹介した「CSS Redundancy Checker」と同じく読み込んでいるページと使われているCSSの差異を読み込んでいるみたいなのでブログなどでチェックすると上記の様に散々な結果となります…。

手軽に高速に使われていないCSSセレクタを参照できるため、WEB制作者にはオススメのfirefox拡張です。

Dust-Me Selectors

関連記事

---

ジャンル別Firefox拡張機能のまとめ
ジャンル別Greasemonkeyスクリプトのまとめ
HDの中身をシムシティ風の都市を再現「StepTree」
ロシア製トイカメラ風画像変換ジェネレーター
あらゆるソフトをまとめてアップデート「AppFresh 」