.htaccess ブラウザキャッシュ設定ジェネレーター

PageSpeed Insightsの「静的なアセットの効率的なキャッシュポリシー」警告を解消し、サイトの表示速度を向上させる mod_expires の記述を生成します。
画像は1年、CSSは1週間など、実務の運用要件に合わせた安全なキャッシュコードをコピペで作成できます。

⚙️ ファイル種類別のキャッシュ期間設定

ファイルの種類ごとに、ユーザーのブラウザにデータを保存(キャッシュ)させる期間を選択します。

画像・メディア (jpg, png, webp, svg 等)

更新頻度が低いため長めが推奨です。

CSS / JavaScript

保守・改修の頻度に合わせて調整してください。

Webフォント (woff, woff2, ttf 等)

基本変わらないため1年が推奨です。

HTML / 動的ページ

更新が反映されなくなるため原則「なし」です。

📄 .htaccess に記述するコード

⚠️ PageSpeed Insightsの警告と注意点

多くの方が、Google PageSpeed Insightsの「静的なアセットの効率的なキャッシュポリシー(Serve static assets with an efficient cache policy)」という警告を解消するためにこの設定を調べているかと思います。
Googleの判定基準では「すべての静的ファイルを1年間キャッシュすること」が理想とされていますが、実際の制作現場でそれを鵜呑みにすると大変なことになります。

💡 スコア改善と保守性の「安全な落とし所」

PSIの要求とクライアントワークのバランスを取るには、以下の設定が実戦的です。

  • ✅ 画像・Webフォント:迷わず「1年」に設定
    一度公開したら変更されることが少なく、ファイルサイズも大きいため、ここを1年にするだけでPSIのスコアは大きく改善します。
  • ⚠️ CSS・JavaScript:「1週間」〜「1ヶ月」が実用的
    PSIには怒られるかもしれませんが、頻繁に改修が入るサイトでここを1年にすると、クライアントから「修正したと言われたが、自分のPCでは変わっていない(デザインが崩れている)」というクレームに直結します。

👑 どうしてもCSS/JSを「1年」にして満点を狙う場合

スコア満点を目指してCSSやJSのキャッシュも「1年」に設定する場合は、ファイルを更新した際にブラウザへ「新しいファイルだよ」と強制的に認識させるキャッシュバスター(クエリパラメータ付与)の仕組みが絶対に欠かせません。

<!-- WordPressでの自動キャッシュ突破(filemtime)の記述例 -->
wp_enqueue_style( 'main-style', get_template_directory_uri() . '/style.css', array(), filemtime( get_theme_file_path( '/style.css' ) ) );

filemtime を使うと、ファイルを上書き保存した瞬間にURL末尾のパラメータが変わり、強力な1年キャッシュも即座にクリアできます。