CSSやJavaScriptファイルを圧縮する「YUI compressor」の使い方を説明します。

「YUI compressor」を使って、
CSSやJavaScriptファイルを圧縮し通信量を削減すると、
Webページの表示を速くすることができます。

また、私の経験則ですが、
古めのInternetExplorer(6,７あたり)では、CSSファイルのサイズを圧縮することで、
（通信とは関係ない部分で）レンダリングの速度が上がるようです。

YUI compressorとは

YUIcompressorとは、CSSやJavaScriptファイルを圧縮するツールです。
CSSやJavaScriptを圧縮することで、
Webページの表示を速くする事が出来ます。
圧縮は改行・スペース・タブ等を取り除く処理を行って行うので、
圧縮によってページの表示・挙動が変化することはありません。

インストール

  1. YUIcompressorのサイトにアクセスします。
    　http://developer.yahoo.com/yui/compressor/

  2. 以下の通りリンクをたどり、YUIcompressorをダウンロードします。
    　→QuickLinks: Download
    　→yuiconpressor-2.4.8.jar
    　対象ファイル: yuicompressor-2.4.8.jar

  3. 取り出したファイルを任意のディレクトリに格納します。
    　例えば、C:\Program Files\yuicompressor\yuicompressor-2.4.8.jar

使い方

  1. スタート→全てのプログラム→アクセサリ→コマンドプロンプトを選び、
    　コマンドプロンプトを起動します。

  2. コマンドプロンプトに「cd 」と入力し、
    　圧縮したいCSS/JavaScriptファイルがあるディレクトリをコマンドプロンプトにドロップ、
    　Enterキーを押下して、ディレクトリを移動します。

例えば「C:\MyProject\myhtml\docs\css」に移動する場合、
　> cd C:\MyProject\myhtml\docs\css

  1. 以下のコマンドを入力して、css/javascriptを圧縮します。
    　> java -jar <yuicompressor-2.4.8.jarのパス> <圧縮元ファイル名> <圧縮先ファイル名>

例えば、
　yuicompressor-2.4.8.jarのパス: C:\Program Files\yuicompressor\yuicompressor-2.4.8.jar
　圧縮元ファイル名: index.css
　圧縮先ファイル名: index-min.css
の場合は、
　> java -jar “C:\Program Files\yuicompressor\yuicompressor-2.4.8.jar” index.css index-min.css