サポート » 使い方全般 » ブラウザに画像,cssをキャッシュさせる方法

  • みなさまこんにちは。

    サイトを訪れた方のブラウザに画像ファイル、cssファイルをキャッシュさせたいのですが、方法が分からずに困っています。

    やりたいこと:

    • サイト訪問者のブラウザに画像ファイルやcssファイルをキャッシュさせて、サイト内での巡回を高速&快適にしたい
    • cssファイルに付いては変更することがあるため、サイトの更新をしたときには、サーバにファイルを新たに取りに来てもらうための設定もしたい

    試みたこと/ここまでに理解できたこと:

    • META http-equiv="Expires" content="36000"を設定することで、ブラウザに対して「キャッシュしてくださいね」と要請できる
    • その他にも、last modifiedetagcache controlなどを併用しつつ制御することが必要

    分からないこと

    • 具体的にどのファイルに記述するのかが分からない
    • 上記やりたいことを実現するために、上記必要なメタタグのcontentをどのように設定するべきなのかが分からない

    参考にしたサイト

    環境

    • サーバ:ロリポップ
    • WordPressバージョン:2.9.1

    以上になります。

    今までは、html/css、WordPressで利用されるテンプレートタグ、簡単なjQueryなどデザインに関わる知識のみでサイト作りをしてきましたので、HTTPヘッダについての知識は学んできませんでした。かなりの時間、調べ物をしてみましたが、解決ができずに困っております。
    また、このカテゴリへの投稿が正しいのかもよくわかりませんが、お力をお借りできれば幸いです。
    どうぞよろしくお願いします。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • wordpressにキャッシュさせるのじゃダメなんでしょうか?

    takuyaさん

    ありがとうございます。

    wordpressにキャッシュさせるのじゃダメなんでしょうか?

    WordPressへのキャッシュですと、
    写真をダウンロードすることにはかわりがないので、
    やはりブラウザでのキャッシュが可能になるとうれしいです。

    方法を御存知でしたら、教えていただければ幸いです。

    WordPress とは直接関係ない話題なので、このフォーラムでの質問としては不適切ですね。

    ヒントを少しだけ。
    Webサーバとして Apache を使用しているのであれば、mod_expires モジュールを有功にして .htaccess に適切な記述をすれば、css, js, 画像ファイルのような静的ファイルをキャッシュさせることはできます。
    これ以上の情報は、他で調べた方が良いでしょう。

    wokamotoさん

    ヒントを少しだけ。

    ありがとうございました。ヒントを頼りに調べを進めたいと思います。

    ウェブサイト高速化1
    ウェブサイト高速化2
    ウェブサイト高速化3
    レンタルサーバによっては、mod_expiresモジュールをインストールしていない(利用できない)場合もあります。
    .htaccessに、次のコードを記載してアップロード後、エラーが出ればインストールされていません。

    ExpiresActive On
    ExpiresByType text/css "access plus 4 weeks"

    不幸にもエラーが出れば、レンタルサーバ管理者に嘆願すればいいでしょう。
    WADAX, C’s Server, Heteml, vvv7なんかは、拝み倒しました。
    気をつけなければいけないのは、更新されるページでは、
    <FilesMatch “\.(php|xml)$”>
    ExpiresDefault A120960
    </FilesMatch>
    なんてすると、トップページにキャッシュが効いてしまうので、
    php/xmlなどは、mod_expiresしない方が無難です。

    munusさん

    ご教授ありがとうございました。
    頂いた情報をもとに、もろもろ調べてみました。ロリポップで、上手に使えるようで、
    かなり早くなった印象があります。
    どうもありがとうございました。
    他の方々の参考までに、現在私のサイトの.htaccessに書いているコードが下記です。

    ExpiresActive On
    ExpiresByType image/jpeg M3600
    ExpiresByType image/gif M3600
    ExpiresByType image/png M3600
    <Files ~ "\.(jpg|gif|png)>
    Header set Cache-Control max-age=3600
    </Files>

    cssの編集が終り、しばらくアップデートが無くなるときには、
    ExpiresByType text/css "access plus 4 weeks"
    を加えようと思います。

    私の調べた限りでは、

    cssファイルに付いては変更することがあるため、サイトの更新をしたときには、サーバにファイルを新たに取りに来てもらうための設定もしたい

    については、cssを編集したときには、cssの名前を変更すれば、ブラウザはそれをキャッシュしないので、改めて取りに来てくれる、ということでした。

    キャッシュしておいてほしい時間は、10分くらいです。その後キャッシュが捨てられれば、ユーザにとって、大きな影響はないとも思いました。

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「ブラウザに画像,cssをキャッシュさせる方法」には新たに返信することはできません。