WordPressならブラウザキャッシュを設定してページ表示速度を高速化する方法

ブラウザキャッシュを設定してWordPressを高速化!
The following two tabs change content below.
塩畑 貴志
フリーランスパソコンファシリテーターの塩畑 貴志(ソルティー)ともうします。フリーランスの起業に必要な知識、パソコンの使い方、ブログ・SNSを活用したアクセスアップ方法を教えています。ネットだけでなく、アナログまで幅広く考え、一番効果的な方法を一緒に見つけます。「とりあえずやってみる」がモットー。困っている人は放っておけないタイプ。カラオケ好きのネコ派です。

どうも、ソルティーです!

 

みなさん、学校のテストはいつも何点取っていましたか?

私はいつも100点……!と言いたいところですが、いつも80点取るのがやっと。

学校の勉強は苦手でした。

ですが、WordPressでは表示速度スコアというのは非常に大事!なるべくならこの点数を改善していきましょう!

 

さて、今回はページ表示速度高速化 第二弾!

ブラウザキャッシュを組み込む方法です。

第一弾はこちら

Gzip圧縮による設定です。やってない方はこちらも効果が高いのでやってみてくださいね。

 

この設定することで、読み込みスピードが改善され、ユーザーに優しい作りになりますよ。

カンタンなのでぜひやってみましょう!

 

スポンサーリンク

キャッシュとは

キャッシュとはお金のこと……ですが、ここで言うキャッシュはページの再読み込みを防ぐ、表示高速化の仕組みのことです。

キャッシュを設定していない場合、ページのデータを読み込まれる度に作るようになってしまい、動作が遅くなります。

キャッシュがないと都度作るので遅くなる

 

しかし、キャッシュを設定しておけば、一度読み込んだ時に作っておいたデータを残しておけるので、まったく同じデータを要求された時、すでに作ってあるデータを提供でき、表示速度の改善が期待できます。

WordPressとブラウザキャッシュ:キャッシュがあると、データはすぐ渡される

 

キャッシュの種類について

一口にキャッシュと言っても、実はいろいろなキャッシュがあります。

先程の画像ではサーバーがキャッシュデータを渡していましたが、これはページキャッシュと言います。

ブラウザキャッシュ

Safari、Google Chromeなどインターネットを閲覧するブラウザのキャッシュデータ。ブラウザキャッシュがあれば、もう一度同じページを開く時の時間が短くなる。

ページキャッシュ

サーバー側で保持しているキャッシュデータ。設定した期間キャッシュデータを保持し、キャッシュしておくことで生成の時間がなくなる。

データベースキャッシュ

データベースの返答結果のキャッシュデータ。一般的には記事情報を保持することが可能。

オブジェクトキャッシュ

PHPなどのプログラミング言語に使う変数のキャッシュデータ。キャッシュしておくとプログラムの工数が少なくなる。

 

今回設定するのは1のブラウザキャッシュです。

ブラウザキャッシュを設定しよう

ブラウザキャッシュは何も設定しないままでは有効になりません。

しかし、コピペするだけでカンタンに設定できるので、ぜひやってみましょう!

.htaccessの設定

ブラウザキャッシュはサーバー側で設定をするので、.htaccessファイルにて設定を行います。

ウェブサイトの肝となるファイルなので、編集の際はバックアップを取り、十分に気をつけながら設定するようにしてください

編集作業は自己責任でお願いします

 

私はエックスサーバーで行っています。

エックスサーバーのFTPの設定方法が分からない方はこちらをチェックしてみましょう。

あわせて読みたい

FTPソフトの設定について

もし、他のサーバーであっても、[レンタルサーバー名 FTP]で検索すれば出てきます。

 

まず、FTPソフトで.htaccessを探しましょう。

[サイト名フォルダ] → [public_html]にあります。

WordPressとブラウザキャッシュ:public_htmlに.htaccessファイルがある

この.htaccessをダウンロードし、下記のコードをファイルの一番下にコピペしましょう!
※不安なら書き込む前の.htaccessをバックアップしておきましょう。

コピペでOKです。

 

このコードでは、ブラウザキャッシュだけでなく、フォントもキャッシュしています。

ブラウザの保持期間を自分で設定したい人は…

daysは日、weeksは週、yearは年の単位でキャッシュを保持する期間を設定します。

あまりに短いとpagespeedで警告が出ますので、少し長めにします。

長すぎても新しいデータがキャッシュされなくなってしまうので、大体1週間くらいが良いかと思います。

 

ちなみに text/javascript の一文は昔のブラウザにも対応するために記述しています。

コードを書き込んだら保存して、.htaccessをサーバにアップロードしましょう!

 

サイト表示速度のスコアを確認

ここでサイト表示速度のスコアを確認できます。

 

ぐにらぼはキャッシュをしたことによって……

3点アップ!

キャッシュをして3点アップ!

※サイトによって効果は違います

 

学校でのテストは80点でダメダメでしたが、Google PageSpeedスコアでは85点を目標にしてみましょう!

まとめ

こういう設定はコピペで簡単に設定できる上に効果が高いので、ぜひ取り組んでみてください。

生成動作が抑制されることでサーバの負荷も軽減でき、優しいサイト作りができます。

 

ちなみにこういう高速化設定は一気に取り組むよりも、一つずつ確実に改善を図っていきましょう。

なぜかというと、ミスをした時にどこが間違っていたのか分かりにくくなってしまうからです。

ではでは!

この記事はぐにらぼで掲載していた記事を移転し、Pasolack用に加筆・修正したものです







ブラウザキャッシュを設定してWordPressを高速化!

\ ワークシート 無料配布中 /

ネットマーケティングを加速する!
やりたいことを実現する超実践的ワークシート

私のノウハウを目一杯つぎ込んだ、ネットマーケティングを加速する!やりたいことを実現する超実践的ワークシートを無料でなんと3冊配布することにしました。

①ブログの目的と内容を明確化する!ワークシート

②誰に向けて事業をするのか?ペルソナ設定ワークシート

③狙えニッチなキーワード!キーワード設定ワークシート

これは実際に事業で使っている実例のあるワークシートです。

あなたの事業に役立てられるよう今のうちにゲットしてください。

ABOUTこの記事をかいた人

塩畑 貴志

フリーランスパソコンファシリテーターの塩畑 貴志(ソルティー)ともうします。フリーランスの起業に必要な知識、パソコンの使い方、ブログ・SNSを活用したアクセスアップ方法を教えています。ネットだけでなく、アナログまで幅広く考え、一番効果的な方法を一緒に見つけます。「とりあえずやってみる」がモットー。困っている人は放っておけないタイプ。カラオケ好きのネコ派です。