えー、
ブログやホームページを運用されている方であれば、一度は気にしたことのあるはずのファイル圧縮についてです。
英語ですと、「Minify」と言います。
中でもAMP対応する場合には、CSSのファイルサイズが50KBまでと決まっています。
多くの場合、なんのCSSコードだったのか分かるようにコメントアウトしたり後でカスタマイズして重複していたりすることもあると思われます。
メルカリ招待コード：
プロモーションを含みます
サイト表示速度を高速化とAMPの為にCSSファイルをMinify圧縮する方法
2025年7月20日 (日曜日)本日の人気記事トップ１０
This session is using IPv4 is established in
今日は2025年7月20日です。
この記事は2017年1月17日のものです。現在は状況が異なる可能性がありますのでご注意ください。
2025年7月20日 (日曜日)↓における週間月間人気記事トップ３は？↓
- 本日
- 週間
- 月間
計測データがありません。
-
WordPressプラグインの中に、Push7というプラグインがあります。最新バージョンで3.0.7となっています。これはブラウザなど該当サイトが記事更新などした際に、プッシュ通知をするプラグインです…
-
エクストレイルおすすめエンジンオイルにプロステージSの10W-40を試してみた 2PV
車にとってエンジンオイルは心臓部であるエンジンを保護するための重要な潤滑剤（潤滑油）です。他にもクーラント液やブレーキフルードなどのオイル関係はありますが、一番シビアな環境にあるエンジンを直接保護する…
-
エクストレイルT32マイナーチェンジ後ステアリング外し方 1PV
エクストレイルT32型（NT32も含め）がマイナーチェンジしてから早いもので、もうすぐ2年になります。エンジンなどの大きな変更などはなく、室内の内装デザインや外装のちょっとしたデザイン変化、そして、一…
-
WordPressプラグインの中に、Push7というプラグインがあります。最新バージョンで3.0.7となっています。これはブラウザなど該当サイトが記事更新などした際に、プッシュ通知をするプラグインです…
-
エクストレイルおすすめエンジンオイルにプロステージSの10W-40を試してみた 2PV
車にとってエンジンオイルは心臓部であるエンジンを保護するための重要な潤滑剤（潤滑油）です。他にもクーラント液やブレーキフルードなどのオイル関係はありますが、一番シビアな環境にあるエンジンを直接保護する…
-
エクストレイルT32マイナーチェンジ後ステアリング外し方 1PV
エクストレイルT32型（NT32も含め）がマイナーチェンジしてから早いもので、もうすぐ2年になります。エンジンなどの大きな変更などはなく、室内の内装デザインや外装のちょっとしたデザイン変化、そして、一…
ファイル圧縮と言っても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（プレゼント）でどのように過ごされますか？
ホワイトデープレゼントは以下などの豊富なキャンペーン商品から選ぶと良いと思います。
今週の人気記事トップ１０
- ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法
- エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ
- アイドリングストップシステム異常警告灯表示対処方法
- エクストレイルT32で電動レカロをバッ直でなく車に取り付ける方法
- エクストレイルフォグランプが下を向きすぎている光軸調整方法
- 車のキーナンバー確認方法。キーレス紛失や壊れた時
- ECUをリセットする方法。アイドリング不安定だったのでしょうがなく
- カーメイトのエンジンスターターでエラー15表示と対処方法
- エクストレイルおすすめエンジンオイルにプロステージSの10W-40を試してみた
- ノートPCファンの異音でLIFEBOOKAH77/E分解
おすすめの記事一部広告
- エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ97
- ECUをリセットする方法。アイドリング不安定だったのでしょうがなく76
- アイドリングストップシステム異常警告灯表示対処方法68
- カーメイトのエンジンスターターでエラー15表示と対処方法65
- ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法63
- 車のキーナンバー確認方法。キーレス紛失や壊れた時60
- エクストレイルフォグランプが下を向きすぎている光軸調整方法32
- エクストレイルT32マイナーチェンジ後ステアリング外し方31
- エクストレイルT32で電動レカロをバッ直でなく車に取り付ける方法29
- TOYOTAキーレスリモコンの設定方法とキーナンバー（キー番号）28
Total619
よろしかったらシェアよろしくお願いします。
コメントを表示（0）
新着コメント