CSSの圧縮はブラウザの解釈を一切変えずにファイルサイズだけを縮める処理です。スタイルの適用結果はまったく同じままで、消えるのは人間が読むためだけに存在していた部分だけです。
実際に削除されるもの
圧縮ツールはルール間の空白や改行、/* ... */形式のコメント、ブロックの閉じ括弧の直前にある最後のセミコロン、0.5em → .5emのような値中の余分なゼロを取り除きます。文字コンテンツそのものには一切手を加えません。
日本語を含むCSSと文字コード
content: "→"のような値や、日本語コメントを含むCSSファイルも、圧縮によって文字自体が化けることはありません。圧縮ツールが操作するのは空白・コメント・構文であって、テキストのバイト表現ではないからです。注意すべきなのは、UTF-8以外の文字コード（Shift_JISなど）で書かれた古いCSSファイルを結合・圧縮する場合で、ツールやビルドパイプラインが暗黙にUTF-8を前提にしていると文字化けの原因になります。非ASCII文字を含むCSSファイルはUTF-8で保存し、必要なら先頭行に@charset "UTF-8";を明示しておくのが安全です。
圧縮後のファイルが同じ見た目になる理由
ブラウザのCSSパーサーはトークン間の空白や改行を完全に無視します。これらは人間が読みやすくするためだけに存在しているため、取り除いても計算後のスタイルは一切変わらず、ファイルがコンパクトになるだけです。
何のために使うか
- 本番公開前にCSSファイルのサイズを小さくする。
- 転送データ量を減らしてページの読み込みを速くする。
- ソースコードをざっと見ただけではスタイルの構造が分かりにくくする。
固定回線が主流の環境での圧縮の意味
日本は世界的に見ても固定回線・モバイル回線ともに高速な部類に入るため、CSSファイルが数KB小さくなっても、ユーザーの体感速度としてはほとんど変わらないことが多いです。それでも圧縮には意味があります。アクセス数の多いサイトでは、1リクエストあたりの転送量が減ることがサーバーやCDNの帯域コストの削減に直結するためです。エンドユーザー体験というより、運用コストの観点で効いてくる最適化と考えると分かりやすいでしょう。