ゆめぴょんの知恵ゆめぴょんの知恵
サイト制作、WordPressカスタマイズ、無料アプリ紹介など。海外旅行135ヶ国。知識を知恵にするブログ!

WordPressサイト高速化でSEO対策!17の表示速度アップ術

ブログ表示速度の高速化についてはいろいろ書いてきました。今後は表示速度が遅いとGoogleにも評価されなくなるので実質SEO対策にもなります。今回はWordPressに特化した高速化についてまとめてみました。

ひとことで表示の高速化と言っても、キャッシュ系プラグインを利用する方法から、使用する画像を圧縮したり、スタイルシートやJavaScriptの効率的な書き方など手法は様々です。

ゆめぴょん(@yume_pyon)です。こんちはっ!

このブログも表示速度の高速化をいろいろ試みて1秒台とGTmetrixのAA判定を達成しました。しかしその後のテーマ編集や新たなプラグイン導入により今はBBまで低下しています。特にツイート数表示が低速化の原因です。さらなる改善中です。

無料CDNサービスCloudFlareの導入による高速化

CDNサービスを利用した表示速度の高速化はWordPress限定ではなく、Webサービスや全てのサイトに適用できる方法です。

中でも無料のCloudFlareを用いた高速化は比較的リスクも少なく手順も簡単なのでおすすめです。しかし切替時にはアクセスが不安定になることもあるため導入は早い時期が良いです。

【Webサイト高速化】無料CDNのCloudFlare設定方法と登録結果を共有【Webサイト高速化】無料CDNのCloudFlare設定方法と登録結果を共有

CDNサーバーCloudFlareを用いた高速化は無料で比較的リスクも少なく手順…

キャッシュ系プラグインを使って表示を高速化

WordPressには簡単に表示を高速化できるキャッシュ系プラグインがたくさんあります。ありすぎて選ぶのが大変です。よく調べないと機能が重複したり相性が悪くて逆に低速化してしまうこともありそうです。

DB Cache Reloaded Fix – データベースのクエリキャッシュ

「DB Cache Reloaded Fix」はデータベースへのアクセス(クエリ)をキャッシュ(データを記録して使いまわすこと)することにより、パフォーマンスの低下を抑えて高速化させるプラグインです。管理画面も高速化します。簡単に導入できます。

DB Cache ReloadedとHyper ResponseプラグインでWordPressブログ高速化DB Cache ReloadedとHyper ResponseプラグインでWordPressブログ高速化13 shares

WordPressで作成しているブログの高速化は、キャッシュ系プラグインなどの導…

WP Hyper Response – PHPの表示を高速化

「WP Hyper Response」は、PHPのバッファ(表示するもの)を先出しして体感速度だけでなく実速度も上げてくれます。管理画面も高速化します。

DB Cache ReloadedとHyper ResponseプラグインでWordPressブログ高速化DB Cache ReloadedとHyper ResponseプラグインでWordPressブログ高速化13 shares

WordPressで作成しているブログの高速化は、キャッシュ系プラグインなどの導…

001 Prime Strategy Translate Accelerator – 翻訳キャッシュ

「001 Prime Strategy Translate Accelerator」は翻訳用の「MOファイル」をキャッシュします。翻訳機能を使わない場合も日本語化したWordPressなら効果あります。翻訳ファイルは7割も読み込みのリソースを奪うと言われています。

翻訳キャッシュ系プラグイン比較!WordPress日本語版を高速化翻訳キャッシュ系プラグイン比較!WordPress日本語版を高速化

CDNサーバーの導入から始まったWordPressブログの高速化も第5弾となりま…

記事でも触れていますが、翻訳キャッシュのプラグインには「MO Cache」というのもあります。しかしこれは単独では効果を出せず、オブジェクトキャッシュ系プラグインが必要になります。各自でどちらか選択してください。

W3 Total Cache – 最も高機能でClourFlareの機能アップ

「W3 Total Cache」は様々なキャッシュ機能を実現してくれます。私が利用しているのは、ページキャッシュ、ブラウザキャッシュ、CDN(CloudFlare)共存機能です。

W3 Total Cacheで1秒台達成!WordPress高速化の設定方法を詳しく解説W3 Total Cacheで1秒台達成!WordPress高速化の設定方法を詳しく解説45 shares

「W3 Total Cache」はブログの表示速度を高速化するキャッシュ系のプラ…

「W3 Total Cache」は他のキャッシュ系プラグインや、スピードアップ対策との併用に少し知識が必要です。またスマホ対応などの設定方法についても知っておいた方がいいと思います。

【WordPress】ブログ高速化AA達成!6つのW3TotalとCloudFlare併用設定【WordPress】ブログ高速化AA達成!6つのW3TotalとCloudFlare併用設定

「W3 Total Cache」はWordPressで作成されたブログの表示速度…

その他の高速化プラグイン

まだ導入していませんが気になっているのが「Head Cleaner」と「WP Widget Cache」です。「Head Cleaner」は複数のCSSとJavaScriptを整理したり最適化します。「WP Widget Cache」はウィジェットをキャッシュします。

どちらも「W3 Total Cache」のページキャッシュ、ブラウザキャッシュでカバーできている気もしますが、いつか効果を試したいとも思っています。「Head Cleaner」はテーマの作り方により不要にもできそうです。

プラグインを減らすことも高速化

上のように導入が容易で効果もすぐでて便利なWordPressプラグインですが、使い過ぎると逆に表示速度も低速化してしまいます。キャッシュ系プラグインは必要ですが、他のプラグインはなるべく減らす努力もしましょう。

アイキャッチ画像・写真やサムネイル最適化による高速化

ブログでは文章だけでなく、アイキャッチ画像・写真や、それを縮小したサムネイルなどで見栄えをよくした方が読みやすくなります。しかし多用は低速化をまねくので、圧縮や最適化が重要になります。

Auto Post Thumbnail – 過去記事にもアイキャッチ

高速化の前に各記事にアイキャッチを設定するには、プラグイン「Auto Post Thumbnail」が便利で楽です。記事の一番最初の画像を自動で登録します。新規投稿だけでなく過去記事のFlickrやPicasaの画像さえアイキャッチにしてくれます。

【WordPress】Auto Post Thumbnailでアイキャッチやサムネイル画像を自動設定!過去記事も【WordPress】Auto Post Thumbnailでアイキャッチやサムネイル画像を自動設定!過去記事も

「Auto Post Thumbnail」は新規投稿だけでなく過去記事のFlic…

アイキャッチやサムネイルの重複をなくし高速化

ブログに利用するアイキャッチ画像をFlickrやPicasaなどの外部サービスから貼り付けている場合、サムネイルやアイキャッチを重複生成する可能性があります。気づいていない重複画像を1本化して高速化できます。

【WordPress】Flickr/Picasa利用者へ!サムネイルやアイキャッチ重複回避方法【WordPress】Flickr/Picasa利用者へ!サムネイルやアイキャッチ重複回避方法

ブログに利用するアイキャッチ画像をFlickrやPicasaなどの外部サービスか…

Regenerate Thumbnails – サムネイルのリサイズで高速化

「Regenerate Thumbnails」はアイキャッチ画像のサムネイルのリサイズを簡単に実現できます。ブログの見栄えやテーマを変えたり、関連記事にサムネイルを設定した場合に便利です。

【WordPress】Regenerate Thumbnailsでアイキャッチのサムネイル再生成!高速化にも貢献【WordPress】Regenerate Thumbnailsでアイキャッチのサムネイル再生成!高速化にも貢献

WordPressプラグイン「Regenerate Thumbnails」はアイ…

アイキャッチや掲載写真の加工・圧縮方法

ブログは内容が一番大切ですが、文章を説明するためやイメージしやすいようにアイキャッチ画像や写真などを掲載した方が読者に優しいです。画像(JPG)の簡単な編集・加工・圧縮方法の記事です。

【Web制作】5分で作成!読者をひきつけるアイキャッチやスクショ編集方法【Web制作】5分で作成!読者をひきつけるアイキャッチやスクショ編集方法

ブログは内容が一番大切ですが、文章を説明するためやイメージしやすいようにアイキャ…

PNGについてはまだ記事にしていませんが、加工には無料アプリ「Fotor」、圧縮には無料Webサービス「TinyPNG」や無料アプリ「ImageAlpha(Mac)」。「ImageOptim(Mac)」「PNGGauntlet(Windows)」も併用すると更に圧縮可能です。

過去アイキャッチもまとめて圧縮化

「EWWW Image Optimizer」は過去記事の画像をまとめて圧縮・最適化するWordPressプラグインです。ブログの画像ファイル容量を最適化できれば、それだけでブログ表示を高速化できます。簡単です。

EWWW Image OptimizerプラグインでWordPress画像圧縮!表示も高速化EWWW Image OptimizerプラグインでWordPress画像圧縮!表示も高速化20 shares

WordPressプラグイン「EWWW Image Optimizer」はブログ…

その他 – lazyload、CSSスプライト

「lazy load」とは記事の画像を表示部分のみ読み込むことにより待ち時間を短縮する技術です。WordPressでもずばり「lazy load」というプラグインがあります。

私も「lazy load」プラグインを利用していました。しかし「W3 Total Cache」を導入後は少し表示が乱れたりしたので利用を停止しました。「W3 Total Cache」で画像もキャッシュされるので問題ありません。

「CSSスプライト」とは複数のアイコン画像などを1つにまとめることにより、HTTPリクエスト回数を減らせる技術です。導入は少し難しいですけど、Webサービスの出現により簡単に作成できるようになりました。(記事を追記:2013.9.18)

CSSスプライト(Spirte)でWebサイトの画像表示を高速化!HTTPリクエストを減らすCSSスプライト(Spirte)でWebサイトの画像表示を高速化!HTTPリクエストを減らす

CSSスプライトを利用すると表示速度を高速化できます。しかし複数画像を1つにまと…

高速の飛行機

ソーシャルボタンを工夫して表示を高速化

今や必須になりつつあるソーシャルボタンの設置。しかし表示速度の点においてはマイナスです。そのソーシャルボタンをいかに効率よく設置するかによって高速化をはかることができます。高速化の前に導入から。

WP Social Bookmarking Light – プラグインで簡単設置

WordPressなら数分で複数のソーシャルボタンを同時に設置できます。ボタンのタイプは横型のみです。高速化には対応していません。

WP Social Bookmarking Lightは複数ソーシャルボタン設置のWordPressプラグインWP Social Bookmarking Lightは複数ソーシャルボタン設置のWordPressプラグイン

あなたは新しいブログ記事の更新をどうやって知らせますか。今回は「WP Socia…

プラグインなしで横型・縦型ソーシャルボタンを設置

WordPressプラグインを使わずにソーシャルボタンを設置したい場合は下の記事を参考にしてください。ツイッター/Twitter、Facebook、Google+、はてブ(はてなブックマーク)、Pocketに対応しています。

保存版!SNSソーシャルボタン設置コード一覧まとめ!コピペでOK保存版!SNSソーシャルボタン設置コード一覧まとめ!コピペでOK68 shares

記事にソーシャルボタンを設置することは、もはや必須になりつつあります。良い記事は…

FacebookのOGP設定をプラグインなしで設置

ソーシャルボタンを設置したらシェアした場合のタイトル、説明文、画像について最適化する必要があります。WordPressプラグインを使わないOGP設定を解説しています。WordPress以外のサイトでも応用できます。

【Web制作】FacebookのOGP設定をプラグインなしで設置する方法【Web制作】FacebookのOGP設定をプラグインなしで設置する方法27 shares

ブログをFacebookでいいね!してもらうとシェアされるタイトル、説明文、写真…

ツイッターのTwitter Cards設定をプラグインなしで

Facebookだけでなく、ツイッターのOGP設定(Twitter Cards)も欠かせません。ブログ記事をシェア・リツイートされた時にサムネイル画像や説明文が表示されるのでクリック率も上がるかもしれません。

ツイッターカード/TwitterCards設定方法!ブログ記事をサムネイル付で共有できるよツイッターカード/TwitterCards設定方法!ブログ記事をサムネイル付で共有できるよ28 shares

Twitter Cards(ツイッターカード)を設定すれば、ツイッターでシェアさ…

ソーシャルボタンのあと読み設定

ソーシャルボタンの読込みには負荷がかかるため、表示をあと読みすると体感速度がアップします。しかし「W3 Total Cache」と「CloudFlare」を導入すると「Rocket Loader」により不要になるので注意してください。

【Webサイト高速化】SNSソーシャルボタンをあと読み設定する方法とコードを紹介【Webサイト高速化】SNSソーシャルボタンをあと読み設定する方法とコードを紹介

ソーシャルボタンの読込みには時間も負荷もかかるため表示を後読みにしました。すると…

【WordPress】ブログ高速化AA達成!6つのW3TotalとCloudFlare併用設定【WordPress】ブログ高速化AA達成!6つのW3TotalとCloudFlare併用設定

「W3 Total Cache」はWordPressで作成されたブログの表示速度…

ソーシャルボタンを1つにまとめて高速化

記事の中に複数の同じソーシャルボタンを設置している場合、スクリプトを1つにまとめることができます。さらに各ソーシャルボタンを1つのコードに集約するとリクエスト回数も減ってブログ表示を高速化できます。

【Webサイト高速化】ソーシャルボタンを1つにまとめるコードを共有するよ【Webサイト高速化】ソーシャルボタンを1つにまとめるコードを共有するよ

記事の中に複数の同じソーシャルボタンを設置している場合、スクリプトをまとめること…

データベースの最適化、リビジョン停止で高速化

WordPressは使い続けていると、パソコンと同じように速度が遅くなったり処理が重くなったりします。これはデータベースに大量のゴミがたまってきているからです。たまに掃除・最適化する必要があります。

WordPressの自動保存やリビジョンを削除するプラグイン

WordPressのリビジョン機能は記事を保存するたびに履歴を残します。公開時だけでなく下書きや自動保存によりどんどんデータベースに蓄積されます。やがてはブログ表示速度を遅くする要因にもなりかねません。

【WordPress】自動保存回数の変更やリビジョンの停止方法とプラグイン紹介【WordPress】自動保存回数の変更やリビジョンの停止方法とプラグイン紹介

WordPressのリビジョン機能は記事を保存するたびに履歴を残します。公開時だ…

【WordPress】WP Total Hacksはセルフピンバック,リビジョン停止など多機能プラグイン【WordPress】WP Total Hacksはセルフピンバック,リビジョン停止など多機能プラグイン

WordPressプラグイン「WP Total Hacks」は細かい機能を1つに…

記事でも紹介していますが、たまにプラグイン「Delete-Revision」も有効化して実行すると蓄積されたリビジョンを削除できて高速化につながります。

データベースの最適化により表示速度アップ

上のリビジョン削除以外にもデータベース全体の最適化を定期的に行うことにより表示速度の高速化をはかれます。データベースに精通している人は直接実施してもいいと思いますがプラグインも多数あります。

最適化だけなら「WP-Optimize(プラグイン新規追加から)」。データベースのバックアップもするなら「WP-DBManager」。データベースだけでなく全ファイルをバックアップするなら「BackWPup」が便利です。

参考:BackWPup – Webサイトを丸ごとバックアップできるWordPressプラグイン | ネタワン

まとめ:今日のゆめぴょんの知恵

このように一言で高速化といっても様々な方法の組み合わせになります。

上で挙げた以外にも、HTML、CSS、JavaScript、PHPなどの効率的な書き方など考慮するべき要素はまだまだあります。少しづつ記事にしていこうと考えていますので、今後もよろしくお願いします。

WordPressの高速化については次の記事もかなり役立ちます。興味のある方は参考にしてみてください。

WordPressを高速化する使い方!CDNサービスやプラグインまとめ | コムテブログ

ゆめぴょん(@yume_pyon)でした。 では、ばいちゃお! こてっZzz

«前記事:【Webサイト高速化】ソーシャルボタンを1つにまとめるコードを共有するよ【WordPress】RSSフィードにサムネイル画像や続きを読むリンクの設置方法:次記事»
ページ
↑先頭
ホーム