webdesignkeys

CSSやjavascriptなどを利用した動的なサイト作りやwebデザインに関するネタを紹介!

Subscribe by RSS RSS Icon
Follow me Twitter Twitter Icon
 
 

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Comment

コメントの投稿













管理者にだけ表示を許可する
 

CSSファイルの不要な記述を削除しファイルサイズを圧縮できるサービス

clean_css_top_000.jpg

CSSの各属性の属性値は、省略して記述することができます。例えば、黒を表す#000000は#000と書くことができるように、属性値には、省略形が存在します。今回、紹介する「CLEANCSS」は、簡単な操作だけで、自動でこの処理を行いファイルを圧縮してくれるサービスです。誰でもフリーで簡単に利用することができます。
■参考サイト
CLEAN CSS

CSSコードの削減は以下のような入力ボックスにて行います。
コードを直接入力する場合には、上部ボックスの「CSS-Dode」と書かれた領域に、またアップロードされたCSSファイルを圧縮するためには、「CSS from URL:」と書かれた領域にURLを入力して「Process CSS」を押して実行してください。

■入力ボックス
clean_css_cssinput_001.jpg

入力、実行後は以下のようなメッセージが表示されます。
例のごとく、#000000は#000へと変換されていることがわかります。
他には、0pxが0に変換されていることや、normalが400へと変換されていることがわかります。

■Message
clean_css_message_002.jpg

変換後の結果はメッセージの下のボックスにて表示されるので、圧縮後のファイルはそこからコピーペーストして利用してください。
私が例に行ったCSSファイルは、12.676KBから10.489となり17,3%の削減となりました。

Comment

コメントの投稿













管理者にだけ表示を許可する
 
<< PREV | HOME | NEXT >>

FC2 template
fc2_template_question.jpg

Category

NEWS
 

Comment

Archives

Favorite
125x125 banner 1
125x125 banner 2
125x125 banner 3
125x125 banner 4

Object
CoRich word of mouth information
Web service is developed through word of mouth information. ⇒CoRich
web design keys fc2 blog ranking!!
It challenges the ranking on my site. Please click this links. ⇒FC2 Blog Ranking
Proin magna amet fermentum dignissim
Nulla gravida, lacus molestie convallis dolor sem suscipit nisl, ut pharetra erat leo in elit.
Fusce pulvinar euismod urna vel viverra
Quisque malesuada laoreet tellus vel iaculis. Morbi nulla leo euismod pulvinar erat.
Class aptent taciti sociosqu ad litora
Curabitur vestibulum est eu purus bibendum eu eleifend diam tempor. Fusce metus eros, faucibus ut hendrerit ac.

Links

 
 
 
 
 
 
Copyright Info.

Nulla enim nibh, conse ctetuer sed, vesti bulum eleme ntum, sagittis nec, diam. Mauris blan dit vehi cula neque. Read More

 
Other Links
 
 
 
 
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。