Google Developersに『PageSpeed Insights』という便利なツール（サイト）があります。
https://developers.google.com/speed/pagespeed/insights/
調べたいウェブサイトのURLを入力すると、読み込み時間を短くするための多くの問題点を検証してくれます。
特にモバイルでの閲覧の場合、読み込み時間が長いとサイトを見てくれないということが多くなると言われています。そんなわけで、サイト運営をする場合に、サイトの読み込み時間も重要な要素となります。その対策に便利なツールです。
『PageSpeed Insights』を使うと以下のような結果が表示されます。「修正が必要」な箇所の表示だけでなく、100点満点で評価までしてくれます。
ただ、評価してくれるのは良いのですが、その対処法は素人には少々難しいものが多いので、今回はその中でも簡単な対処法をいくつかご紹介いたします。
【圧縮を有効にする】
圧縮を有効にする gzip や deflate を使用してリソースを圧縮することで、ネットワークで送信されるバイト数を減らすことができます。 次のリソースの圧縮を有効にすると、転送サイズを 217 KB（68%）削減できます。
このようなメッセージが出ている場合は、.htaccessに以下のような書き込みをします。
AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript
これで様々なファイルのdeflateによる「圧縮が有効」になり、転送サイズが減ることによって、サイトの表示が速くなります。
【ブラウザのキャッシュを活用する】
ブラウザのキャッシュを活用する 静的リソースの HTTP ヘッダー内で、有効期日や最大経過時間を設定すると、ブラウザがネットワークからではなくローカル ディスクから以前にダウンロードしたリソースを読み込むようになります。
このようなメッセージが出てる場合の対策はプラグインでするのが一般的だったようなのですが、どうも問題のあるプラグインがあるようですね。（最悪WordPressのファイルを壊してしまうことがあるようです）
ですので、キャッシュ系のプラグインを使う方法はそれぞれのプラグインが何をしているかを細かく検証できる方以外にはあまりお奨めできません（良いプラグインもあるはずなので詳しい方はそちらでも可能なはずです）。
ちなみにGoogleで検索するといろいろなキャッシュ系プラグインをお奨めしてるサイトがかかるのですが、更新日や内容が古いものが多いように思いますのでご注意ください。
また、一言に「キャッシュ系」プラグインと言ってますが、方法は多種多様でなかなかに複雑です。プラグインを導入する場合は内容をよく確認してからの方が良さそうです。
そこで、こちらもプラグインを使わず、.htaccessに自分で何をどの期間キャッシュするかを書き込むことで対処することにします。
ExpiresActive On ExpiresByType image/png "access plus 10 days"
例えばPNGファイルのキャッシュをするだけの場合は以上で十分です。
ExpiresActive On ExpiresByType image/png "access plus 10 days" ExpiresByType image/gif "access plus 10 days" ExpiresByType image/jpg "access plus 10 days" ExpiresByType image/jpeg "access plus 10 days"
さらに他の画像ファイルや
ExpiresByType application/x-javascript "access plus 5 days" ExpiresByType text/css "access plus 1 days"
ついでにCSSなんかもキャッシュしたい場合はこのように追加します。
ただ、例ではCSSファイルのキャッシュ時間を1日に設定していますが、サイト構成を頻繁に変更する場合はこれは入れない方がいいかもしれませんので、このあたりはお好みで。
【スクロールせずに見えるコンテンツのレンダリングブロック JavaScript/CSS を排除する】
スクロールせずに見えるコンテンツのレンダリングブロック JavaScript/CSS を排除する このページには、ブロッキング スクリプト リソース が 4 あり、ブロッキング CSS リソースが 5 あります。これが原因で、ページのレンダリングに遅延が発生しています。 このページでスクロールせずに見えるコンテンツを、以下のリソースによる読み込みを待たずにレンダリングできませんでした。ブロッキング リソースを遅延させるか、非同期に読み込むか、これらのリソースの重要部分を HTML 内に直接インライン化してください。 レンダリングブロック JavaScript を削除してください:
このメッセージに関しては、私もすべてには対策しきれなかったのですが、「Asynchronous Javascript」と「WP Deferred Javascripts」という２つのプラグインでいくらかは減らすことができます。
「Asynchronous Javascript」「WP Deferred Javascripts」ともにデフォルトの設定で問題ないようです。これでJavascriptの問題は多くが解決されるはずです。
追記：「Asynchronous Javascript」を使うとプラグイン「SyntaxHighlighter Evolved」や「Fancybox」の機能が使えなくなると問題が発生しました。これはもうどちらを取るかですね。
以下は検証中注意：
CSSに関しては、「Async JS and CSS」というプラグインがあるのですが、この「Async JS and CSS」はどうも扱いが難しいようで、設定必須のようです。
「Async JS and CSS」については、以下を参照してください（外部リンク）
http://affiliate-dream.net/javascriptcss-%E3%82%92%E6%8E%92%E9%99%A4%E3%81%97%E3%81%A6%E3%81%BF%E3%82%8B/ (レンダリングブロック JavaScript/CSS を排除してみる)
ただ、うちのテーマ「Twentyfourteen」ではダッシュボード系の表示に問題が起こってしまいましたので現在検証中です。テーマや改造具合との相性問題があるようです。
