CSS(スタイルシート)縮小ツールを使ってサイトの読み込み時間を短くしよう

 CSS(スタイルシート)を圧縮すると、ブログの表示速度を速めることができるらしい。

 それは良いけどCSSの圧縮ってどういうこと?

 

CSS(スタイルシート)の圧縮とは?

・コメントを取り払う。

・カラーコードを簡略化する。
例)"#000000" ⇒ "#000"

・不要なスペースや改行を取り外す
*1行ですべてのスタイルシートを表示すると、圧縮は最高になるが、スタイルシートそのものが見えにくくなるため、その後の編集や管理がしにくくなる。

 

webサービスを利用してCSSを圧縮

1、http://e-optimize.jp/services/csstidy/css_optimiser.phpへアクセス。

2、『CSS Input:』の欄にCSSを貼り付け。

3、『圧縮率(コードレイアウト):』を選ぶ。
*1行ですべてのスタイルシートを表示すると、圧縮は最高になるが、スタイルシートそのものが見えにくくなるため、その後の編集や管理がしにくくなる。
 セレクタごとに1行表記とするとある程度圧縮でき、かつ、編集もしやすいかも。

4、『Options』を選択し、『実行』ボタンを押す。
*オプションを欲張りすぎると、サイトの表示がおかしくなることもあるので、ご注意。

5、一番したの枠に、圧縮をしたCSSが表示されるので、そのCSSをコピーして、ブログのCSSとしてアップロードする。

 

 『セレクタごとに1行表記』で40.2% (-6752
Bytes)位CSSを軽くできた。

コメントを残す




*

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

関連記事

noimage
noimage
noimage

Xperia(TM) acro HD SO-03D はdocomoOnlineShopが安いかも

noimage
noimage
noimage
noimage
noimage

meta keyword(メタ キーワード)をSEOに役立てよう

noimage

通話相手のSkypeアカウントを登録する方法

noimage
noimage
noimage
noimage
noimage

音を出すと、パソコンソフトが起動する

noimage

32ビットOSと64ビットOSの違い

Menu

HOME

 TOP