メインコンテンツにスキップ
すべてのコレクションサイト監査問題
CSS ファイルサイズが大きすぎます
CSS ファイルサイズが大きすぎます

Ahrefsのサイト監査で「CSSファイルサイズが大きすぎる」問題についての詳細と、ウェブサイトでそれを修正する方法をご覧ください。

Anna avatar
対応者:Anna
今週アップデートされました

この問題を引き起こす原因は何ですか?

この問題は 15kB を超えるCSSファイルを報告します。

なぜ重要なのでしょうか?

大きなCSSファイルは、ページ読み込みのパフォーマンスを低下させる可能性があります。

それを修正する方法?

1. まず、CSS ファイルが HTTP 圧縮されていることを確認する必要があります。 このレポートの「圧縮」列を確認してください。

最も一般的な圧縮方式には、gzip と Deflate があります。 HTTP圧縮は大きなCSSファイルの転送速度を大幅に向上させることができます。

CSS ファイルの HTTP 圧縮を有効にするには、開発者の助けが必要な場合があります。

2. CSS ファイルは、必要以上に大きくなります。 CSS の minifier を使用して CSS コードを縮小できます。

ウェブサイトが比較的小さく、頻繁に更新されない場合は、ファイルを手動でミニファイするためのオンラインサービスを使用できます。 例えば cssnanoMinify など。

または、更新されたコードをデプロイする前に、CSSを最小化する自動ワークフローを設定することもできます。 GulpWebpack のようなツールを考えてみましょう。

こちらの回答で解決しましたか?