Loading…

WordPress カスタマイズ カスタマイズ 伝えたいこと 備忘録

CSS圧縮後(minify)にCSS整形方法カスタマイズの為

このセッションは  IPv4  で確立しています

本日の人気記事BEST10

所要時間目安:2

This session is using  IPv4  is established in

WordPress カスタマイズ カスタマイズ 伝えたいこと 備忘録

目次に行く・戻る

サイト運営しているうちにCSSがものすごい大きくなってしまうことがありますよね。昔使用していたCSSがそのままだったり、もしくはコメントアウトしたものが残っていたりなどです。そういった不要なCSSをサイト表示速度改善のためにCSS圧縮をすることがあります。

すると、だいたい1行にまとめられて結構な縮小になります。

この記事を読む方へのオススメ

その後、サイト運営を続けているうちにCSSが同じようなことになりつつあることがあります。

しかし、以前のCSSをCSSminifyなどにて1行に圧縮してしまった為に古いCSSのどこのどの部分がどこに該当するのかわかりにくくなってしまいます。

以下のようになってしまいます。

なので、CSSの圧縮は有名ですが逆の圧縮を元に戻すCSS整形をすることにより見やすくなります。


CSS整形が可能なサイト一覧は以下になります。

Messy stylesheets can be impossible to edit. Use DirtyMarkup's free online tool to tidy up your CSS code. Beautify even the ugliest / unformatted CSS.
Minify処理などで難読化してあるスタイルシートのコードに、インデントや改行を付けて見やすく整形するツールです。他サイトのCSSを分析したい時、間違えてMinify前のコードを消してしまった時などにご利用下さい。
このサイトでは簡単に使える便利なウェブツールを公開しています。うまく使うことでWeb開発や日々の作業を効率化することができます。
インデント・改行を調節し、ソースコードを整形します。
整形前のテキスト欄に入力されたコードが、自動的に改行やインデントを付加した見やすい状態にして表示します。

上記の中でも一番おすすめなサイトは一番はじめに紹介したDirtyMarkup Formatter - CSS Beautifier for Stylesheetsサイトですかね。

CSS整形後は以下のように人の目で見てわかるように修正・整形・直してくれます。

それぞれのCSSが見やすくなります。

その他のCSS整形サイトもみんな綺麗に整形してくれます。それぞれのサイトで整形後の容量が少しだけ異なりますが長過ぎる(多すぎる・大き過ぎる)CSSだとわかりにくいです。

CSS整形後の容量が一番少ないツールサイトをご利用されるか、CSS整形後の容量が一番多いツールサイトをご利用されるかなど、

CSSの整形後の容量で、どのサイトが一番自分の使用しているCSS合っているのかの判断材料にしても良いのかもしれません。

25


アドセンス336pxPC閲覧記事下表示1つ目コード

関連記事

高梨沙羅選手イモトアヤコ似でなく相武紗季似になってきた

伝えたいこと 備忘録 時事ネタ

高梨沙羅さん綺麗になって相武紗季さん似になった気がする。

もう言わずと知れた女子スキージャンプ(ラージヒルジャンプ)で超有名人である高梨沙羅選手です。 最近テレビを見て、あれっ、ものすごくキレイになったなぁと思いました。そして、2014年に行われた冬季オリン…

もっと読む

インフィード広告アドセンス

WordPressFTPダウンロードエラー設定変更

WordPress アップグレード 伝えたいこと 備忘録

WordPressFTPソフトでダウンロード出来ない場合の対処方法

WordPressのアップデート・アップグレードには必須と言っていいFTPソフト(FFFTPなど)でのサーバー上の大事なフォルダ類のバックアップです。 一応、バックアップ対象フォルダはwp-conte…

もっと読む

インフィード広告アドセンス

仮歯が外れてしまった

伝えたいこと 備忘録 噛みあわせ 治療

仮歯が取れた!!そんな時どうしたら良いのか2つの方法

多くの方々はこれまでの人生において歯医者さんに行ったことがない人というのはほとんどいないと思います。 なぜなら、小学生の時などには必ず歯科検診もあるからです。 この歯科検診を含めれば、 すべての人が歯…

もっと読む

インフィード広告アドセンス

Noto Sans CJKフォントインストール後画像

PC Windows10 カスタマイズ 伝えたいこと 備忘録

Windows10のフォントが汚いので変更方法

Windows10は、リリースされてからもうすぐ(3ヶ月で)1年になろうとしてます。 Windows10のデフォルトのフォントは汚いので、システムフォントを変更する方法です。 すでに多くの人はご存知か…

もっと読む

WordPress, カスタマイズ, カスタマイズ, 伝えたいこと, 備忘録」同じカテゴリーの記事一覧


おすすめの記事一部広告

    Multiplex 広告

アクセスランキング

目次に戻る

よろしかったらシェアよろしくお願いします。

-WordPress, カスタマイズ, カスタマイズ, 伝えたいこと, 備忘録

目次に戻る

目次に戻る


コメントを閉じる

comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください