【レポート】

使われていないCSSを探す方法

 

Webページの制作に携わったことがあるならCSSも扱ったことがあるだろう。当初は小さかったCSSファイルも、デザインの変更や調整を続けるうちに、どんどん大きくなっていき、簡単には全体を見渡すことができなくなる。既存のデザインが崩れたりパラメータ間の調整を取るため、既存のCSSには手を加えずに新しいスタイルを追加していくことになるため、ファイルはどんどん大きくなっていく。

こうした状況はCSSファイルのメンテナンスという観点からはあまり好ましいものとはいえない。編集を繰り返していくうちに、すでに使われなくなっているスタイルもあるだろう。そうしたスタイルはできれば削除した方が、ファイルの中身の見通しがよくなる。そんな場合に活用できるツールがThe David Walsh Blogの記事「uncss: Find Unused CSS」において紹介された。

紹介されているツールは「uncss」というツール。指定したURLからHTMLをダウンロードしてきてJavaScriptを実行、使われているスタイルシートを展開したのち、スタイルをまとめてパース、さらに実際にHTMLで一致することないセレクタを見つけ出して使われていないスタイルを除くという処理をしていると説明がある。サイト全体に渡って適用するには追加でスクリプトを組む必要があるが、使われていないCSSを除去する基本的なツールとして活用を検討できる。

関連キーワード


転職ノウハウ

あなたが本領発揮できる仕事を診断
あなたの仕事適性診断

シゴト性格・弱点が20の質問でサクッと分かる!

「仕事辞めたい……」その理由は?
「仕事辞めたい……」その理由は?

71%の人が仕事を辞めたいと思った経験あり。その理由と対処法は?

3年後の年収どうなる? 年収予報
3年後の年収どうなる? 年収予報

今の年収は適正? 3年後は? あなたの年収をデータに基づき予報します。

激務な職場を辞めたいが、美女が邪魔して辞められない
激務な職場を辞めたいが、美女が邪魔して辞められない

美人上司と可愛い過ぎる後輩に挟まれるエンジニアの悩み

人気記事

一覧

イチオシ記事

新着記事

[実力試し]HTML5 認定試験 Lv1 想定問題 (8) 指定可能な属性
[08:30 8/30] 企業IT
[ガラスの仮面]3Dギャグアニメ化 現代社会を風刺する学園ドラマに大胆アレンジ
[08:00 8/30] ホビー
DEEPCOOL、水冷ユニットを標準搭載するミドルタワーPCケース「GENOME」
[08:00 8/30] パソコン
声優・竹達彩奈、ワイン×料理研究家・大橋みちことともに宅バル動画に登場
[08:00 8/30] ホビー
キャリアのiPhoneをApple 表参道で買いたくなる理由 - 知られざるサービスがすごかった
[08:00 8/30] スマホとデジタル家電

求人情報