Web Service

ボタン1つでCSSファイルを軽量化!圧縮や整形が簡単にできる「csCSSc」

CSSファイルを簡単に圧縮したり整形したりできるツール「csCSSc」を使ってみました。ボタン1つで簡単にできるのでとても便利ですね!600行くらいのCSSファイルを試しに圧縮してみたところ1KBほど軽量になりました。少しでもサイトの読み込み時間を速くしたい時には是非活用していきたいっすね。以下、簡単な使い方です。

[ads_center]

使い方

使い方はとても簡単です。エディタで目的のCSSファイルを開いてコードを全部コピーします。で、サイトへ行きコードをペーストして「Compress」というボタンをクリックするだけです。これで圧縮することができます。

圧縮

csCSScの使い方 圧縮
圧縮する時には3つのオプションがあります。

include comments
コメントを含めることができます。
single line
コードを全部1行にします。
sort styles
セレクタをアルファベット順にソートします。

必要に応じてチェックを入れるといいかと思います。WordPressのテーマのstyle.cssなんかは最初にコメントで必要な情報を記述しなきゃいけないのでその場合はinclude commentsにチェックを入れないといけないですね。

整形

先程の圧縮したコードが出来上がったテキストエリアに整形したいコードをコピー&ペーストして、その下にある「Decompress」というボタンをクリックするとコードが整形されます。

csCSScの使い方 整形

こんな感じでボタン1つでとても簡単に圧縮&整形することができるのでとても手軽でオススメです。こういう便利なツールをどんどん活用して効率的に作業していきたいですね。

WordPressのログイン時のツールバーWordPressでランダム記事の一覧をプラグインを使わないで表示させるやり方前のページ

the_tagsを使ってWordPressの投稿タグを表示させたり表示形式を替えたりしてみる次のページWordPressのログイン時のツールバー

関連記事

  1. Web Service

    WebサイトのタイトルとURLを簡単に取得できて自分用HTMLリンクも作成できるChrome拡張機能…

    現在見ているWebサイトのタイトルとURLを簡単に取得できたり、自分用…

  2. Web Service

    iPhoneアプリのRead it LaterがPocketにリニューアルしたので使ってみたらヤバか…

    ふと、iPhoneを弄っていたらアップデートできるアプリがあったのでし…

  3. CSS3 Box Shadow Generator
  4. ヘボン式ローマ字

    Web Service

    ヘボン式ローマ字を使う時の注意事項や便利な一覧表、入力変換サービスなど

    ヘボン式ローマ字を使う時の注意事項や便利な一覧表、入力変換サービスなど…

  5. 目覚まし時計

    Web Service

    朝起きるのに便利!Macで指定した時間にアラームを鳴らしてくれるアプリ「目覚まし時計」

    Macで目覚まし時計をセットしたくてアプリを探していたらよさそうなのが…

  6. Web Service

    検索結果を見やすくしてくれるChrome拡張機能「Google検索でキーワードをハイライト表示」

    PCブラウザでChromeをお使いの方に便利な拡張機能のご紹介です。「…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. あらびきソーセージパイ
  2. REACH フロス
  3. MacBook AirとApple Watch
  4. エアリズムコットンタンクトップ
PAGE TOP