ホーム > ネット > .htaccess 使い方 ブラウザのキャッシュ期間をコントロールする
目次 | 元のページ 前のページ | 次のページ サイトマップ | ページEND

.htaccess 使い方 ブラウザのキャッシュ期間をコントロールする


モバイル ユーザビリティ 確認方法


ウェブサイトのモバイル フレンドリー 度について、下枠左側の 「 モバイル フレンドリー テスト 」 にて、URLを指定して、ページ毎に確認することができます

検出された問題の詳細については、同様に、下枠右側の 「 PageSpeed Insights 」 で確認します

モバイル フレンドリー 度確認 検出された問題の詳細確認
モバイル フレンドリー テスト PageSpeed Insights




.htaccess 使い方 ブラウザのキャッシュ期間をコントロールする ( モバイル ユーザビリティの問題 対処法 )



モバイル ユーザビリティを確保するため、サーバー上のページファイルがブラウザから閲覧される際、ブラウザのキャッシュが活用されるよう、サーバー上の「.htaccess」ファイルに、キャッシュの有効期間を設定しておく必要があります



「 mod_expires 」 (Expires ヘッダー) 設定方法



ルートディレクトリに、ファイル名 「 .htaccess 」( パーミッション(属性値) : 644 : 通常のhtmlファイルと同じ)を作成し、以下枠内を記述します

「 mod_expires 」の設定内容は、配置したディレクトリ配下にも継承されます

※.尚、当設定は、レンタルサーバー等で、Apache サーバー等 mod_expires 機能を有するサーバーOSが使われており、かつ、mod_expires モジュールがサーバー側でロードされていることが前提になります
「さくらのレンタルサーバー」では、2012年07月19日、本機能がサポートされました



項目 内容 (補足)
ファイル名 .htaccess (先頭は 「 」 (ドット))
パーミッション (属性値) 644 (通常のhtmlファイルと同じ)
書式 ExpiresByType ファイルタイプ名 "(access|modification) plus N (minutes|days|weeks|months|years|)"
記述例 # ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 10 minutes"
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
説明 # ブラウザ キャッシュ有効期間
「#」で始まる行は、コメント行です
ExpiresActive On
mod_expires の Expires 機能をオンにする
ExpiresByType
キャッシュの有効期間を設定するファイルタイプを指定します
「text/html」 / 「text/css」 / 「image/gif」 / 「image/png」 / 「image/jpeg」 / 「image/pdf」 / 「application/x-shockwave-flash」 / 「application/rss+xml」 / 「application/x-javascript」
「access」 / 「now ('access' と等価)」 / 「modification」
「acces」と「now」は実質1つなので、アクセスしてからの時間でキャッシュ期間を決める(access)のか、ファイルの更新日時からキャッシュ期間を決める(modification)のかを指定します
「plus」は省略可能で、あってもなくても構いません
access アクセスしてからの時間を指定する
now ('access' と等価)
modification ファイルの更新日時から時間を指定する
「1 days」 / 「1 weeks」
キャッシュの有効期間を指定します
指定単位 「years」 / 「months」 / 「weeks」 / 「days」 / 「hours」 / 「minutes」 / 「seconds」




ExpiresByType ブラウザキャッシュ期間設定 設定前後の比較 設定の効果



「ExpiresByType」設定で、ブラウザのキャッシュ期間を設定することによる効果を、ブラウザキャッシュ設定前後の 「 PageSpeed Insights 」 (Google提供)での評価について、当サイトのトップページ 「 https://abhp.net 」 で試行してみました


全項目 "access plus 1 weeks" 設定
設定前 PageSpeed Insights 」 「ブラウザのキャッシュを活用する」 指摘項目
https://abhp.net/img/TopPage_Tytle_000001.gif(有効期限が指定されていません)
https://abhp.net/img/TopPage_Tytle_000002.gif(有効期限が指定されていません)
https://platform.twitter.com/widgets.js (30 分)
https://st.shinobi.jp/…ices/admaxdsp/static/javascripts/trac.js (30 分)
https://apis.google.com/js/api.js (30 分)
https://apis.google.com/js/platform.js (30 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://oauth.googleusercontent.com/…e:rpc:shindig.random:shindig.sha1.js?c=2 (60 分)
https://pagead2.googlesyndication.com/pagead/osd.js (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://cdn-ak.b.st-hatena.com/…27f0bec3bfa0736c1f3315f1d829a2ae45c8dd90 (10.3 時間)
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 1 weeks"
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 PageSpeed Insights 」 「ブラウザのキャッシュを活用する」 指摘項目
https://platform.twitter.com/widgets.js (30 分)
https://st.shinobi.jp/…ices/admaxdsp/static/javascripts/trac.js (30 分)
https://apis.google.com/js/api.js (30 分)
https://apis.google.com/js/platform.js (30 分)
https://gum.criteo.com/…sync?c=1&r=2&j=OX_idp_criteo_cb482607700 (60 分)
https://mathid.mathtag.com/d/i.js (60 分)
https://ox-d.openx.jp/w/1.0/jstag (60 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://oauth.googleusercontent.com/…e:rpc:shindig.random:shindig.sha1.js?c=2 (60 分)
https://pagead2.googlesyndication.com/pagead/osd.js (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://cdn-ak.b.st-hatena.com/…79ad2285399bf3e11d4fb03a5709474001ba5fa0 (7.5 時間)
https://cdn-ak.b.st-hatena.com/…27f0bec3bfa0736c1f3315f1d829a2ae45c8dd90 (7.5 時間)
効果 "access plus 1 weeks" 設定
当サイトのファイルである下記が消えていますので、キャッシュ設定されたことが確認できます
https://abhp.net/img/TopPage_Tytle_000001.gif(有効期限が指定されていません)
https://abhp.net/img/TopPage_Tytle_000002.gif(有効期限が指定されていません)

※.他のファイルは、当サイトページに貼り付けてある広告、SNSアイコン等の為、当サイト側の設定では手出しできません

"access plus 1 days" 設定
全項目 「1 weeks」を「1 days」に変更してみると、下記の様に修正を求めるメッセージが出ました
https://abhp.net/img/TopPage_Tytle_000001.gif (24 時間)
https://abhp.net/img/TopPage_Tytle_000002.gif (24 時間)
評価 一律同じ設定を行うのであれば、"access plus 1 weeks" を設定する必要があることが分かります



ファイルタイプ毎に設定値を変え できるだけ短いキャッシュ期間で効果が出るように試行する



上記での試行で、一律同じ設定で効果を出すには、"access plus 1 weeks" を設定する必要があることが分かりましたが、サイトページによっては、もっと短い期間で更新している場合、1週間の間、サイトページの閲覧者は更新に気づかないことになります

ファイルタイプ毎に設定値を変えることにより、サイトページの閲覧者にできるだけ最新情報を提供でき、かつ、ブラウザキャッシュも活用できるよう、上記同様、当サイトのトップページ 「 https://abhp.net 」 の 「 PageSpeed Insights 」 (Google提供) での効果を試行してみました


全項目 "access plus 1 days" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 1 days"
ExpiresByType text/css "access plus 1 days"
ExpiresByType image/gif "access plus 1 days"
ExpiresByType image/png "access plus 1 days"
ExpiresByType image/jpeg "access plus 1 days"
ExpiresByType image/pdf "access plus 1 days"
ExpiresByType application/x-shockwave-flash "access plus 1 days"
ExpiresByType application/rss+xml "access plus 1 days"
ExpiresByType application/x-javascript "access plus 1 days"
設定後 PageSpeed Insights 」 「ブラウザのキャッシュを活用する」 指摘項目
https://platform.twitter.com/widgets.js (30 分)
https://st.shinobi.jp/…ices/admaxdsp/static/javascripts/trac.js (30 分)
https://apis.google.com/js/platform.js (30 分)
https://apis.google.com/js/rpc:shindig_random.js?onload=init (30 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://pagead2.googlesyndication.com/pagead/osd.js (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://abhp.net/img/TopPage_Tytle_000001.gif (24 時間)
効果 下記行が引っ掛かっています
https://abhp.net/img/TopPage_Tytle_000001.gif (24 時間)
text/html と text/css のみ "access plus 1 days" / 他項目 "access plus 1 weeks" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 1 days"
ExpiresByType text/css "access plus 1 days"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 PageSpeed Insights 」 「ブラウザのキャッシュを活用する」 指摘項目
https://img.ak.impact-ad.jp/ic/pone/tags/3377/036033_5.js(有効期限が指定されていません)
https://js.gsspcln.jp/t/033/892/a1033892.js(有効期限が指定されていません)
https://syndication.twitter.com/settings (10 分)
https://www.googletagmanager.com/gtag/js?id=UA-106464651-1 (15 分)
https://platform.twitter.com/widgets.js (30 分)
https://js.ad-stir.com/js/adstir.js (60 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://samuraifactory-d.openx.net/w/1.0/jstag (60 分)
https://sp.gmossp-sp.jp/…uid=8e0166cd-22d4-4504-8807-59787ca7ab7f (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://abhp.net/css/CSS_000000.css (24 時間)
効果 下記行が引っ掛かっています
https://abhp.net/css/CSS_000000.css (24 時間)

※.他のファイルは、当サイトページに貼り付けてある広告、SNSアイコン等の為、当サイト側の設定では手出しできません

text/html のみ "access plus 1 days" / 他項目 "access plus 1 weeks" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 1 days"
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 PageSpeed Insights 」 「ブラウザのキャッシュを活用する」 指摘項目
https://platform.twitter.com/widgets.js (30 分)
https://st.shinobi.jp/…ices/admaxdsp/static/javascripts/trac.js (30 分)
https://apis.google.com/js/platform.js (30 分)
https://apis.google.com/js/rpc:shindig_random.js?onload=init (30 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://pagead2.googlesyndication.com/pagead/osd.js (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
効果 下記行が消え、当サイトのファイルで引っ掛かるものはなくなりました
https://abhp.net/img/TopPage_Tytle_000001.gif (24 時間)



text/html と text/css の キャッシュ期間をさらに短く hours 設定で効果をみる



text/html と text/css の キャッシュ期間をさらに短くした場合の影響を、上記同様、当サイトのトップページ 「 https://abhp.net 」 の 「 PageSpeed Insights 」 (Google提供) で見てみました


text/html と text/css のみ "access plus 1 hours" / 他項目 "access plus 1 weeks" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 1 hours"
ExpiresByType text/css "access plus 1 hours"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 https://img.ak.impact-ad.jp/ic/pone/tags/3377/036033_5.js(有効期限が指定されていません)
https://img.gsspat.jp/…4c4/3945eae156e89e777c7fb3427aa03043.gif(有効期限が指定されていません)
https://js.gsspcln.jp/t/033/892/a1033892.js(有効期限が指定されていません)
https://media.gssp.asia/ls/opt_icon.png(有効期限が指定されていません)
https://media.gssp.asia/ls/opt_icon_text.png(有効期限が指定されていません)
https://syndication.twitter.com/settings (10 分)
https://www.googletagmanager.com/gtag/js?id=UA-106464651-1 (15 分)
https://platform.twitter.com/widgets.js (30 分)
https://abhp.net/css/CSS_000000.css (60 分)
https://js.ad-stir.com/js/adstir.js (60 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://samuraifactory-d.openx.net/w/1.0/jstag (60 分)
https://sp.gmossp-sp.jp/…uid=aaec3f41-9b86-4202-be75-8c7eca55f5ee (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://cdn-ak.b.st-hatena.com/…79ad2285399bf3e11d4fb03a5709474001ba5fa0 (3.6 時間)
https://cdn-ak.b.st-hatena.com/images/entry-button/standard-en.svg (8 時間)
効果 当サイトのCSSファイルである下記が引っ掛かっています
https://abhp.net/css/CSS_000000.css (60 分)

※.他のファイルは、当サイトページに貼り付けてある広告、SNSアイコン等の為、当サイト側の設定では手出しできません

テキスト項目である、ExpiresByType text/html は、"access plus 1 hours" 設定にしても、修正を求めるメッセージが出ませんので、text/html 項目だけは、"access plus 1 hours" 設定で問題ないようです
text/html を "access plus 1 hours" / text/css を "access plus 1 days" 設定
他項目 "access plus 1 weeks" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 1 hours"
ExpiresByType text/css "access plus 1 days"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 https://img.ak.impact-ad.jp/ic/pone/tags/3377/036033_5.js(有効期限が指定されていません)
https://mts0.google.com/…fqLLQ5bCX4VlBgziJ7j5haGG0KuDcDndiaLWozyg (6.7 分)
https://syndication.twitter.com/settings (10 分)
https://www.googletagmanager.com/gtag/js?id=UA-106464651-1 (15 分)
https://platform.twitter.com/widgets.js (30 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://samuraifactory-d.openx.net/w/1.0/jstag (60 分)
https://sp.gmossp-sp.jp/…uid=882f5409-b60c-459c-9f45-caa23d8cd2ee (60 分)
https://cdn-ak.b.st-hatena.com/images/entry-button/standard-en.svg (106.3 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://cdn-ak.b.st-hatena.com/js/bookmark_button.js (11 時間)
https://abhp.net/css/CSS_000000.css (24 時間)
効果 当サイトのCSSファイルである下記が引っ掛かっています
https://abhp.net/css/CSS_000000.css (24 時間)

※.他のファイルは、当サイトページに貼り付けてある広告、SNSアイコン等の為、当サイト側の設定では手出しできません

text/html を "access plus 1 hours" / 他項目 "access plus 1 weeks" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 1 hours"
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 https://img.ak.impact-ad.jp/ic/pone/tags/3377/036033_5.js(有効期限が指定されていません)
https://js.gsspcln.jp/t/033/892/a1033892.js(有効期限が指定されていません)
https://syndication.twitter.com/settings (10 分)
https://www.googletagmanager.com/gtag/js?id=UA-106464651-1 (15 分)
https://platform.twitter.com/widgets.js (30 分)
https://js.ad-stir.com/js/adstir.js (60 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://samuraifactory-d.openx.net/w/1.0/jstag (60 分)
https://sp.gmossp-sp.jp/…uid=9f0e1f3b-31d6-4d4a-b840-55e31a5c55e8 (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://cdn-ak.b.st-hatena.com/js/bookmark_button.js (2.5 時間)
https://cdn-ak.b.st-hatena.com/…11b891cc7f6eb2b4fbb73e9762c820a65483ec97 (2.7 時間)
https://cdn-ak.b.st-hatena.com/…79ad2285399bf3e11d4fb03a5709474001ba5fa0 (2.7 時間)
効果 当サイトのファイルで引っ掛かるものはありません

※.他のファイルは、当サイトページに貼り付けてある広告、SNSアイコン等の為、当サイト側の設定では手出しできません

text/html を "access plus 10 minutes" / 他項目 "access plus 1 weeks" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/html "access plus 10 minutes"
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 https://img.ak.impact-ad.jp/ic/pone/tags/3377/036033_5.js(有効期限が指定されていません)
https://syndication.twitter.com/settings (10 分)
https://www.googletagmanager.com/gtag/js?id=UA-106464651-1 (15 分)
https://platform.twitter.com/widgets.js (30 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://samuraifactory-d.openx.net/w/1.0/jstag (60 分)
https://sp.gmossp-sp.jp/…uid=8bc9862a-b204-42b5-bf17-83f2dcea6ed5 (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://cdn-ak.b.st-hatena.com/images/entry-button/standard-en.svg (8.2 時間)
https://cdn-ak.b.st-hatena.com/…11b891cc7f6eb2b4fbb73e9762c820a65483ec97 (8.4 時間)
https://cdn-ak.b.st-hatena.com/…79ad2285399bf3e11d4fb03a5709474001ba5fa0 (9.2 時間)
効果 当サイトのファイルで引っ掛かるものはありません

※.他のファイルは、当サイトページに貼り付けてある広告、SNSアイコン等の為、当サイト側の設定では手出しできません

text/html と text/css の "access plus xxxx"行 を削除 / 他項目 "access plus 1 weeks" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 https://abhp.net/css/CSS_000000.css(有効期限が指定されていません)
https://img.ak.impact-ad.jp/ic/pone/tags/3377/036033_5.js(有効期限が指定されていません)
https://js.gsspcln.jp/t/033/892/a1033892.js(有効期限が指定されていません)
https://syndication.twitter.com/settings (10 分)
https://www.googletagmanager.com/gtag/js?id=UA-106464651-1 (15 分)
https://platform.twitter.com/widgets.js (30 分)
https://js.ad-stir.com/js/adstir.js (60 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://samuraifactory-d.openx.net/w/1.0/jstag (60 分)
https://sp.gmossp-sp.jp/…uid=32841654-294c-403f-8dcc-ff761e8c9abb (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://cdn-ak.b.st-hatena.com/images/entry-button/standard-en.svg (8.1 時間)
効果 当サイトのCSSファイルである下記が引っ掛かっています
https://abhp.net/css/CSS_000000.css(有効期限が指定されていません)

※.他のファイルは、当サイトページに貼り付けてある広告、SNSアイコン等の為、当サイト側の設定では手出しできません

text/html "access plus xxxx"行 を削除 / 他項目 "access plus 1 weeks" 設定
設定
内容
# ブラウザ キャッシュ有効期間
ExpiresActive On
ExpiresByType text/css "access plus 1 weeks"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/pdf "access plus 1 weeks"
ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
ExpiresByType application/rss+xml "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
設定後 https://img.ak.impact-ad.jp/ic/pone/tags/3377/036033_5.js(有効期限が指定されていません)
https://js.gsspcln.jp/t/033/892/a1033892.js(有効期限が指定されていません)
https://syndication.twitter.com/settings (10 分)
https://www.googletagmanager.com/gtag/js?id=UA-106464651-1 (15 分)
https://platform.twitter.com/widgets.js (30 分)
https://js.ad-stir.com/js/adstir.js (60 分)
https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js (60 分)
https://samuraifactory-d.openx.net/w/1.0/jstag (60 分)
https://sp.gmossp-sp.jp/…uid=2024f56c-c586-4df7-a2b3-90109a1d3c6b (60 分)
https://www.google-analytics.com/analytics.js (2 時間)
https://cdn-ak.b.st-hatena.com/js/bookmark_button.js (2.6 時間)
https://cdn-ak.b.st-hatena.com/images/entry-button/standard-en.svg (10.3 時間)
https://cdn-ak.b.st-hatena.com/…79ad2285399bf3e11d4fb03a5709474001ba5fa0 (11.8 時間)
効果 text/html に対する設定を削除しても、当サイトのファイルで引っ掛かるものはありません
元々 text/html に対する設定は不要だったようです
ただし、明示的に 「text/html」 を 「"access plus 1 hours"」、あるいは、「"access plus 10 minutes"」 等設定しておくのも ”あり” だと思います

※.他のファイルは、当サイトページに貼り付けてある広告、SNSアイコン等の為、当サイト側の設定では手出しできません




ExpiresByType で キャッシュ期間を設定した際の 「HTTP レスポンスヘッダー」 情報



ExpiresByType で キャッシュ期間を設定した際の 「HTTP レスポンスヘッダー」 (Response Headers) 情報です


「HTTP レスポンスヘッダー」(Response Headers)情報の表示例です

サーバー上の 「.htaccess」 ファイルで、「 ExpiresByType text/html "access plus 10 minutes"」 を設定していますので、「HTTP レスポンスヘッダー」 に、「Cache-Control:max-age=600」 が設定されていることが分かります

サーバー上の 「.htaccess」 ファイルから 「 ExpiresByType text/html "access plus 10 minutes"」 を削除すると、「HTTP レスポンスヘッダー」 に、「Cache-Control:max-age=」 行が設定されないことが分かります

サーバー上の 「.htaccess」 ファイルから 「 ExpiresByType text/html "access plus 10 minutes"」 を削除すると、「HTTP レスポンスヘッダー」 に、「Cache-Control:max-age=」 行が設定されないことが分かります


※.HTTP レスポンスヘッダー の確認方法につきましては、「Google Chrome デベロッパー ツール HTTP レスポンスヘッダー 確認方法」 をご参照下さい




モバイル ユーザビリティの問題 ブラウザのキャッシュを活用する 参考情報



.htaccessにて設定をする


ExpiresActive On
ExpiresByType image/gif "access plus 1 days"
ExpiresByType image/jpeg "access plus 1 days"
ExpiresByType image/png "access plus 30 days"
ExpiresByType application/x-shockwave-flash "access plus 1 years"
ExpiresByType application/rss+xml "access plus 30 minutes"
ExpiresByType application/x-javascript "access plus 20 days"
ExpiresByType text/html "modification plus 15 minutes"
ExpiresByType text/css "access plus 20 days"

はじめの行はmod_expiresを使用するという宣言になります
ExpiresActive On
使用の宣言に続き、以下のような感じに設定をしていきます
ExpiresByType ファイルタイプ "(access|modification) plus N (minutes|days|weeks|months|years|)"

【負荷対策】Apacheのモジュールmod_expiresでキャッシュを利用する - エーエイチレフ linuxサーバー技術情報 」 より



転送と有効範囲


.htaccess をWebサーバへ転送する際はアスキーモードで転送します。転送後は .htaccess のパーミッションを "644(rw-r--r--)" に設定します
ただし、共有サーバでは、"604(rw----r--)" の場合もあります

.htaccess の設定は、配置したディレクトリ以下に対して有効になります
そのため、Webサイト全体に対して設定を有効にしたい場合は、ルートディレクトリに配置しましょう
階層別に分けて配置した場合、より深い階層に配置した .htaccess の設定が優先されます

.htaccessの書き方 murashun.jp 」 より



ブラウザのキャッシュを活用する


このルールは、サーバーからのレスポンスに明示的なキャッシュ ヘッダーが含まれていないことや、リソースが短時間のみキャッシュされるよう指定されていることを PageSpeed Insights が検出した場合にトリガーされます

概要


静的なリソースをブラウザでキャッシュすると、ユーザーがサイトに複数回アクセスした場合に時間を節約できます
キャッシュ ヘッダーは小さなサブセット(画像など)だけでなく、キャッシュできる静的なリソースにすべて適用されます
キャッシュできるリソースには、JS ファイル、CSS ファイル、画像ファイル、その他のバイナリ オブジェクト ファイル(メディア ファイル、PDF など)があります
一般に HTML は静的ではないため、デフォルトではキャッシュ可能と見なさないようにしてください
サイトの HTML にとってどのようなキャッシュ ポリシーが適しているか検討する必要があります

推奨される解決方法


サーバーでブラウザのキャッシュを有効にします
静的なリソースのキャッシュの有効期間は 1 週間以上にしてください
広告やウィジェットなどのサードパーティ リソースの場合は、キャッシュの有効期間を 1 日以上にします
キャッシュ可能なすべてのリソースで、次のような設定をおすすめします:
• Expires を 1 週間以上、できれば最大で 1 年間先に設定します(より広くサポートされているため、Cache-Control: max-age よりも Expires をおすすめします)
RFC のガイドラインに違反するので、1 年以上先には設定しないでください。
• リソースの変更時期が正確にわかっている場合は、短い有効期間を設定してもかまいません
ただし、すぐに変更される可能性があるものの、変更時期がわからない場合は、長い有効期間を設定して、URL フィンガープリント(後述)を使用してください

Expires ヘッダーと Cache-Control: max-age ヘッダー


これらのヘッダーでは、ウェブ サーバーから新しいバージョンが提供されているかどうか確認せずに、ブラウザでキャッシュ済みのリソースを使用できる期間を指定します
無条件で適用される「強いキャッシュ ヘッダー」です
設定後にリソースがダウンロードされると、有効期限や最大期間に達するかユーザーがキャッシュを消去するまで、ブラウザはそのリソースに対する GET リクエストを発行しません

Last-Modifed ヘッダーと ETag ヘッダー


これらのヘッダーでは、キャッシュする目的で、ファイルが同じかどうかをブラウザが判断する方法を指定します
Last-Modified ヘッダーでは、日付を使用します
ETag ヘッダーでは、リソースを一意に識別する値を使用します(ファイルのバージョンやコンテンツ ハッシュが一般的です)
Last-Modified は、ブラウザがキャッシュからアイテムを取得するかどうかを判断する際にヒューリスティック(経験則)を適用するという意味で、「弱い」キャッシュ ヘッダーです

これらのヘッダーを使用すると、ブラウザでは、ユーザーが明示的にページを再読み込みした場合に条件付きの GET リクエストを発行することで、キャッシュ済みリソースを効率的に更新できます
条件付きの GET では、サーバーでリソースが変更されていない限り、完全なレスポンスは返されないため、完全な GET よりも待ち時間が短くなります

どちらのキャッシュ ヘッダーを使用すべきか


キャッシュできるすべてのリソースで、Expires と Cache-Control: max-age のいずれか、Last-Modified と ETag のいずれかを指定することが大切です
Expires と Cache-Control: max-age の両方、または Last-Modified と ETag の両方を指定すると冗長になります

URL フィンガープリントの使用


ときどき変更されるリソースの場合、サーバー上でリソースが変更され、サーバーがブラウザに新しいバージョンが提供されたことを通知するまで、ブラウザでリソースをキャッシュしておくことができます
リソースの各バージョンに一意の URL を指定すると、この方法を実現できます
たとえば、「my_stylesheet.css」というリソースがあるとします
このファイル名を「my_stylesheet_fingerprint.css」に変更できます
リソースが変更されると、フィンガープリントも変更されるため、URL も変わります
URL が変更されるとすぐに、ブラウザはリソースの再取得を強制されます
フィンガープリントを使用すると、頻繁に変更されるリソースでも、有効期限をそれより先の方の日付に設定できるようになります

フィンガープリントの一般的な方法として、ファイルのコンテンツのハッシュをコード化した 128 ビットの 16 進数が使用されます

もう 1 つの方法は、アプリケーションの新しいバージョンごとに新しいリリース ディレクトリを作成して、各バージョンのすべてのアセットをバージョン別のディレクトリに格納することです
この方法にはバージョン間でアセットに変更がない場合でも、URL が変わるため再ダウンロードが強制されるという欠点があります
コンテンツ ハッシュを使用するとこの問題の影響を受けなくなりますが、やや複雑になります

ブラウザのキャッシュを活用する    PageSpeed Insights    Google Developers 最終更新日: 4月 11, 2014 」 より





PageSpeed Insights について | PageSpeed Insights | Google Developers


Page Speed Insights では、携帯端末やデスクトップ端末向けのページのパフォーマンスを測定します
URL を 2 回(モバイル ユーザー エージェントと PC ユーザー エージェントで 1 回ずつ)取得します

PageSpeed のスコアの範囲は 0~100 ポイントです
スコアが大きいほど良好で、85 以上のスコアはそのページのパフォーマンスが高いことを示します
なお、PageSpeed Insights は継続的に改良されているため、新しいルールの追加や分析の改良に伴ってスコアが変わることがあります

PageSpeed Insights では、次の項目について、ページのパフォーマンスをどの程度改善できるか測定します

スクロールせずに見える範囲のコンテンツの読み込み時間: ユーザーが新しいページをリクエストした瞬間から、スクロールせずに見える範囲のコンテンツがブラウザで表示されるまでの経過時間
ページ全体の読み込み時間: ユーザーが新しいページをリクエストした瞬間から、ブラウザでページが完全に表示されるまでの経過時間
ただし、ネットワーク接続のパフォーマンスは大きく変動するため、PageSpeed Insights では、ページのパフォーマンスのうちネットワークに依存しない部分(サーバー設定、ページの HTML 構成、画像やJavaScript、CSS などの外部リソースの使用方法)のみを考慮します
提案された解決策を実装すれば、ページの相対的なパフォーマンスは改善されるはずです
ただし、それでも、ページの絶対的なパフォーマンスはユーザーのネットワーク接続に左右されます

各提案には、重要性を表す優先度インジケータが表示されます

アイコン 名前 説明
赤色の感嘆符 赤色の感嘆符 この問題を修正すると、ページのパフォーマンスが大幅に改善されます
黄色の感嘆符 黄色の感嘆符 それほど忙しくない場合はこの問題の修正を検討してください
緑色のチェックマーク 緑色のチェックマーク 大きな問題は見つかりません。パフォーマンスは良好です

PageSpeed Insights の最近の更新では、モバイルのパフォーマンス向上に力を入れています
詳細については、PageSpeed Insights のモバイル分析についての記事や、Google I/O 2013 で行われた素早いモバイル ウェブサイトに関するプレゼンテーションをご覧ください
PageSpeed Insights で実行された分析の詳細なリストもご覧いただけます

フィードバックのお願い
Google では PageSpeed Insights に関する皆様からのフィードバックをお待ちしています
テスト ツールや推奨されたベスト プラクティスについてご意見やご提案がある場合は、ディスカッション グループ(page-speed-discuss)に投稿してください

お問い合わせ
PageSpeed Insights についてご質問がある場合は、よくある質問をご覧いただくか、ディスカッション グループにメッセージを投稿してください

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License. For details, see our Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

最終更新日: 4月 11, 2014

PageSpeed Insights について  |  PageSpeed Insights  |  Google Developers 」 より


目次 | 元のページ 前のページ | 次のページ サイトマップ | ページTOP
ホーム > ネット > .htaccess 使い方 ブラウザのキャッシュ期間をコントロールする
   

© 2014 abhp.net All Rights Reserved.

関連情報サイト


mod_expires - Apache HTTP サーバ バージョン 2.4
Apache Expiresヘッダフィールドを追加する方法
HTTPヘッダチューニング Expiresヘッダについて | REDBOX Labo
Apacheのmod_expiresでファイルタイプごとにキャッシュをコントロールする方法 | OXY NOTES
はじめる - ウェブマスター向けモバイルガイド
遂にさくらのレンタルサーバでmod_expiresが使用可能に!さっそく試してみた
.htaccessの書き方 murashun.jp
PageSpeed Insights について  |  PageSpeed Insights  |  Google Developers

ページTOP
ページTOP
ページTOP
ページTOP