えー、
ブログやホームページを運用されている方であれば、一度は気にしたことのあるはずのファイル圧縮についてです。
英語ですと、「Minify」と言います。
中でもAMP対応する場合には、CSSのファイルサイズが50KBまでと決まっています。
多くの場合、なんのCSSコードだったのか分かるようにコメントアウトしたり後でカスタマイズして重複していたりすることもあると思われます。
プロモーションを含みます
サイト表示速度を高速化とAMPの為にCSSファイルをMinify圧縮する方法
メルカリ招待コード：
2025年9月18日 (木曜日)本日の人気記事トップ１０
-
KABU&カード紹介キャンペーンやってるよ！紹介コードを利用して、新規入会すると、株引換券1,000枚プレゼント！👇 紹介コードはこちらEHJ4XU8DP4A6
｢カブアンドの株は利用額に応じてもらえるので､私も使っています！｣｢前澤さんが始めたカブアンドの仕組みがとても斬新だと思いました。株がもらえるって斬新な仕組み。｣｢私はメインカードをKABU&カードに切り替えました。株がもらえるので。｣
This session is using IPv4 is established in
今日は2025年9月18日です。
この記事は2017年1月17日のものです。現在は状況が異なる可能性がありますのでご注意ください。
-
2025年9月18日 (木曜日)↓における週間月間人気記事トップ３は？↓
-
- 本日
- 週間
- 月間
計測データがありません。
-
エクストレイルT32前期型インストルメントルパッドから後期型インストルメントパッドに交換（換装） 2PV
エクストレイルT32前期型と後期型はプロパイロットやパーキングブレーキの電子化などその他些細なデザイン変更や4WDの電子制御化（完全な？）など以外前期型とほとんど変わらないかと思われます。（フロントグ…
-
Windows10でエラーコード0x800705b4の対処方法 2PV
Windows10で前回の記事でも紹介したWindows Updateができないくて、その対処方法を記載しました。 そしたら、 一応、sfc /scannowの実行でいくつかのWindo…
-
エクストレイルT32前期型インストルメントルパッドから後期型インストルメントパッドに交換（換装） 2PV
エクストレイルT32前期型と後期型はプロパイロットやパーキングブレーキの電子化などその他些細なデザイン変更や4WDの電子制御化（完全な？）など以外前期型とほとんど変わらないかと思われます。（フロントグ…
-
Windows10でエラーコード0x800705b4の対処方法 2PV
Windows10で前回の記事でも紹介したWindows Updateができないくて、その対処方法を記載しました。 そしたら、 一応、sfc /scannowの実行でいくつかのWindo…
ファイル圧縮と言ってもHTMLやJavaScriptやCSSと大きく3つのファイルがあると思います。
その各々においてファイル圧縮をするツールやサイト、プラグインなど、
いくつかあります。
しかし、！！
HTMLなど下手なサイトやツールなどでファイル圧縮（Minify）しても、表示が崩れたりしてしまいます。
サイト表示速度測定サイトのGTMatrixなどでもMinifyされたCSSなどの提案があります。
ですが、
GTMatrixでのファイル圧縮（minify）はあまりオススメしません。
なぜなら、これまでに何回か使用した際にデザインが崩れてしまったことがあるからです。
CSSのファイル圧縮を今回思い立ったのは何を隠そう（何も隠していませんがσ(^_^;)）、AMP対応しているとCSSが基準の50KB以上になってしまったりして超越することがあるからです。
（普通、超えることがあるからです。ですよね、日本語の表現として。）
さておき・・・・・・。
CSSは多くの場合かなりのファイル圧縮（minify）が可能です。
私の場合ですが、思うようにしようとした所AMP用のCSSが50.02KBとわずかに超えてしまいました。
そして、もちろんAMPバリゲーターでERRORとなりました。
なので、少しだけ妥協してCSSを削っていました。
でも、なんとなくユーザビリティに欠くなぁ。
と思い、しょうがない圧縮しよう。
という経緯です。
HTMLとJavaScriptのファイル圧縮方法（サイト）は後述するとして、まずはCSSのファイル圧縮サイトです。
上記したようにいくつかありますが、
以下のMinify your CSSというサイトが良いと思われます。
なぜか？
それは、私が使用してCSSのファイル圧縮後に適用してみてもデザインが崩れることもなく思い通りに表示されたからです。
こちらでCSSのファイル圧縮をしてみた所50.02KBだったものが、30.8KBにまでなりました。
計算上では、約39%も圧縮できました。
いかにコメントアウトや重複してしまっていたコードがあったのかが分かります。orz
同じように通常表示のサイトのCSSもファイル圧縮したら・・・・・・。
もっと圧縮率は高いと思われますがしません。
なぜかは秘密です。
（特に秘密にする必要はありませんがm(__)m）
これだけファイル圧縮できたので、他にもCSSを追加することも出来るようになりました。
が、追加しません。
なぜか？
そ
・
れ
・
は
追加する予定も追加するものもないからです。
ただ単にそれだけです。
最後にHTMLの圧縮サイトとJavaScriptの圧縮サイトを紹介したいと思います。
HTML圧縮サイトは以下になります。
JavaScript圧縮サイトは以下になります。
あなたにおすすめ
¥1,980 （2025/07/06 13:22時点 | Amazon調べ）
ポチップ 
あなたが訪問してから
⏰ 0 秒経過 🎉入学入社まであと…入学入社祝いはどんなPresent（プレゼント）でどのように過ごされますか？
ホワイトデープレゼントは以下などの豊富なキャンペーン商品から選ぶと良いと思います。
今週の人気記事トップ１０
- カーメイトのエンジンスターターでエラー15表示と対処方法
- アイドリングストップシステム異常警告灯表示対処方法
- ECUをリセットする方法。アイドリング不安定だったのでしょうがなく
- TOYOTAキーレスリモコンの設定方法とキーナンバー（キー番号）
- ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法
- エクストレイルT32前期型インストルメントルパッドから後期型インストルメントパッドに交換（換装）
- 車のキーナンバー確認方法。キーレス紛失や壊れた時
- 日産ディーラーオプションナビMM316D-WからMM518D-L交換（換装）NISSAN純正ナビリモコン
- キーIDが正しくありません。エクストレイルT32インテリジェントキー電池交換CR2032
- エクストレイルT32マイナーチェンジ後ステアリング外し方
おすすめの記事一部広告
- ECUをリセットする方法。アイドリング不安定だったのでしょうがなく108
- アイドリングストップシステム異常警告灯表示対処方法90
- 車のキーナンバー確認方法。キーレス紛失や壊れた時89
- エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ84
- カーメイトのエンジンスターターでエラー15表示と対処方法83
- ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法67
- TOYOTAキーレスリモコンの設定方法とキーナンバー（キー番号）59
- エクストレイルT32マイナーチェンジ後ステアリング外し方59
- キーIDが正しくありません。エクストレイルT32インテリジェントキー電池交換CR203247
- ステアリング交換とステアリングスイッチの増設と外し方後期型仕様に44
Total663
よろしかったらシェアよろしくお願いします。
コメントを表示（0）
新着コメント