【SEO対策】WordPress人気テーマ『STORK(ストーク)』の高速化にチャレンジ♪
(2019年2月25日 追記あり)
(2019年11月30日 追記あり)
こんにちは。
kumatamです♪
私のブログ『未来への投資日記』は、WordPressの人気テーマ『STORK(ストーク)※』をベースに作られています。
(2019年11月30日 追記)
※2019年11月に『STORK(ストーク)』から『STORK19(ストーク19)』へバージョンアップしました。
『STORK19(ストーク19)』は、ぱっと見『STORK(ストーク)』と変わらないように見えますが、利便性や高速化など大きな進化をしていますので、今ダウンロード購入するのであれば、こちらです。↓
有料テーマですが、とても使いやすく、使ってすぐに見違えるようなレイアウトになりますので、初心者の方にも自信を持っておすすめできるものです。
そのような人気のWordPressテーマ『STORK(ストーク)』を使用してブログを書き続けているのですが、あまり『SEO』なるものを気にしたことがありません。
σ(^_^;
検索エンジン最適化(Search Engine Optimization)とは、検索エンジンのオーガニックな検索結果において特定のウェブサイトが上位に表示されるようウェブサイトの構成などを調整すること。また、その手法の総称。ウィキペディアより
あらためて言葉を確認しましても、「具体的に何もしていないなぁ」というのが正直なところでした。
初期設定のときくらいに、この「プラグインは必要」というのを入れたくらいです。
私はブログを始めてから、すべてをスマホのみで作っています。
PCからの入力の方が圧倒的に早くできるのでしょうが、ブログを仕事からの帰りに打つことが多いというのも理由かもしれません。
ちなみにPCでWordPress管理画面を確認したことも、やり方もわからないくらいスマホオンリーです。
【SEO対策】WordPress人気テーマ『STORK(ストーク)』の高速化
それくらい『SEO』を意識していなかったのですが、Google先生が検索上位に持ってくるものは読みたい方が多い価値あるブログということですので、今回具体的に動いてみることにしました。
まずは、ブログの表示スピード高速化です。
表示スピードが遅いとブログを開くこともされないですので、第一にここをチェックすることにしました。
ブログの表示スピードは、ここで確認できます。↓
PageSpeed Insights
ホームページアドレスを入力して、「分析」をタップするだけで、そのページのスピード表示がされるのです。
私のブログも何もしていないと言いましても有料テーマですし、平均の『50』以上はいくものと思っていました。
それでは、モバイル表示の分析結果です。↓
間違いかと思い、何度実施しても『8』か『9』。
ちなみにパソコンの結果です。↓
『46』
速くはないですが、モバイル結果を考えますとマシな数値です。
モバイル、こんなに遅かったのですね。
自身で開いてもそのような印象がなかったのですが・・・。
こんなに開きづらかったのですね。
プラグイン『EWWW Image Optimizer』で、画像の圧縮(最適化)をしてみる
いろいろ調べてみますと、画像がそのサイトを重くしている大きな要因のようですので、プラグインを追加してみます。
追加プラグインは、こちらです。↓
EWWW Image Optimizer
サイトでこのプラグインの説明を確認をします。↓
EWWW Image Optimizer は画像を最適化することでページのロード速度を向上させます。ロード速度を向上させることで検索結果のランキングで上位に表示されたり、売上が向上したりします。またサーバーのストレージと転送量を下げることも出来ます。
なるほど。
実際に、画像を最適化してみます。
アップした画像を自動で最適化してくれるだけでなく、過去画像も圧縮してくれるとのことですので試してみます。
プラグイン導入後、WordPress管理画面で、『メディア→一括最適化』を選びます。
↑一時停止する時間は、長い方がよいかもしれませんが、私は5秒設定にしました。
フリーズするような場合は、一時停止し、その後再開させます。
『一括最適化』を選択して、過去のファイルも一度に最適化したのですが、なんと9,000以上の対象ファイルがあるではありませんか!
過去のリロード(リビジョン)用のファイルが含まれているのかと思いますが・・・、疲れました。
圧縮(最適化)後の結果です。
まずは、モバイル分析↓
『8』→『15』
微妙・・・。
こんなに時間かけたのに・・・。
パソコン分析です。↓
『46』→『55』
少しの改善ですね。
WordPressテーマ『ストーク』で、キャッシュ管理プラグインの『WP Fastest Cache』を導入
次のステップです。
サイトの高速化には、キャッシュの管理が大切です。
キャッシュの説明はここでは省略しますが、今回、プラグイン『WP Fastest Cache』を導入します。
モバイルの分析結果です。↓
『15』→『26』
効果あり!
パソコン分析は↓
『55』→『76』
こちらも大きく改善しました。
キャッシュ管理は、私のブログには効果大のようです。
使用サーバー『XSEVER』のバージョンを確認してみる
WordPressを使用するには、自身で契約した有料レンタルサーバーが必要になります。
私は、口コミなどから判断して『XSEVER』を使用しています。
そのレンタルサーバーのバージョンが高速化に効果がありますので、確認します。
『XSEVER』でログインし、『PHP Ver.切替』項目をチェックします。
ブログ開始から今まで一度もチェックすらしたことはありませんでした。
案の定、最新はVer.7ですが、私は『PHP5.6.36』のままでした。
早速、最新(推奨)の『PHP7.2.6』に変更し、サイト画面を確認します。
ここで問題発生!
エラーメッセージが・・・。↓
表示画面の不具合は、XSEVERのPHPバージョンとあるプラグインの関係で発生しています。
解消策として、一つ前の『PHP7.1.18』Ver.への変更をします。
これでも大きなバージョンアップです♪
こちらは問題ありませんでした♪
(2019年2月23日 追記)
エラーメッセージの解消方法です♪↓
では、モバイルの表示スピード分析です。↓
『26』→『28』
ほとんど変化なしです。
パソコン表示分析は・・・。↓
『76』→『80』
誤差の範囲くらいの上昇です。
サーバーのバージョンアップは、高速化しているはずですが、分析での評価にほとんど変化はありませんでした。
プラグイン『Optimize Database after Deleting Revisions』を導入して、リビジョン削除管理をしてみる
データベースの最適化とリビジョンの削除管理をするWordPressプラグイン
『Optimize Database after Deleting Revisions』
を導入してみます。
リビジョン機能はタイムマシンのようなロード機能ですが、一つのブログで10以上になることも普通です。
これをそのままにしていたわけですから、効果に期待できます。
画像最適化で9,000以上のファイルとなったのも恐らくこれが要因でしょう。
では、モバイル表示分析です。↓
『28』→『38』
大きく改善!
パソコン表示分析です。↓
『80』→『84』
こちらも改善!
ただ、少し時間をあけて分析計測しますと・・・。
- モバイル~『30』
- パソコン~『80』
この数字に落ち着いてしまいました。
別のGoogle分析ツール『testmysite』でサイトスピードを計測してみる
では、更に別のサイト表示スピード分析ツールで計測してみます♪
こちらもGoogle先生です。
モバイルサイトの読み込みと速度とパフォーマンスを分析してくれます。
では、確認してみましょう!
3Gでの読み込み時間は、『4秒』
『良好』!!!
同じようなサイトと比較しましても、悪くない評価です。
よかった♪
今回、『SEO』対策の一つとして、WordPressの高速化を実施してみました。
自身のスマホではあまり実感はないのですが、数値上は大きく改善しています。
※プラグイン導入は、WordPressテーマとの相性もありますので、不具合がないか一つずつ確認しながら進めてみてください。
私も少しずつですが、勉強して少しでも皆様が読みやすいブログにしていきます。
また、改善の都度、備忘録の意味も含めて掲載していきます。
プラグイン『Autoptimize』導入!
(2019年2月21日追記)
今回、『Autoptimize』というプラグインを追加しました。
私の設定です。↓
WordPressの『設定』から変更します。
↓
『Autoptimize』を選択
↓
『JavaScript』と『CSS』の最適化にチェックを入れます。
このチェックは、それぞれ皆さんの状況で異なります。
表示が崩れていないことと、スピード計測をしながら選択してください。
速度計測結果です。
まずはモバイルから↓
【プラグイン導入前】
↓
【プラグイン導入後】
『25』→『36』にアップ♪
パソコンは?↓
【プラグイン導入前】
↓
【プラグイン導入後】
『77』→『76』
遅くなりました。
速度計測は、その時によりまして多少上下がありますので、様子見です。
ただ、『testmysite』で計測してみますと数値が大きく改善しています♪↓
以前の『4秒』→『3秒』へ。
そして『良好』→『特に良好』へ。
効果大ですね!
XSEVER『エックスアクセラレータ』設定
私は、レンタルサーバー『XSEVER』
エックスサーバー
を利用していますが、導入初期から全くバージョンアップせずにいました。
先日、『PHP』のバージョンアップを図ったばかりですが、今回は『エックスアクセラレータ』設定をします。
こちらも『XSEVER』内サーバーパネルにログインし、自身で設定する必要があります。↓
『高速化』項目で、『Xアクセラレータ』を選択します。↓
あとは、『ON』設定にするだけです。
とっても簡単♪↓
『testmysite』で、スピード計測してみます。↓
変わらず、『特に良好』です!
XSEVERは更に次の段階に! 『エックスアクセラレータ』の『Ver.2』!!
『XSEVER』
エックスサーバー
の進化が止まりません!
※2019年2月21日現在、私のバージョンではまだ利用できませんが、順次対応中のようです。
期待して待ちます♪
月額900円(税抜)から、高速・多機能・高安定レンタルサーバー『エックスサーバー』
XSEVER(エックスサーバー)のキャッシュ設定で高速化
(2019年2月25日 追記)
私は、ワードプレスを使用するにあたりレンタルサーバー『XSEVER(エックスサーバー)』を使用しています。
適切な設定をすることで、満足のいくスピード感を得ることができます。
そもそも、不具合が皆無ですので、レンタルサーバーが『XSEVER』だったということの意識さえも途中で無くなります。
今、サイトのスピード感や不具合でお悩みの方に、『XSEVER』は自信を持っておすすめできます。
その『XSEVER』のキャッシュ設定をまだ実施していませんでしたので今回設定します♪
簡単な設定ですので、さらりといきましょう!
まずはサーバーキャッシュ設定です。↓
サーバーパネルから、『高速化』の『サーバーキャッシュ設定』を選択します。↓
『ON』を選択します。↓
この設定で、高速化と同時アクセス数の拡張がされます♪
続いて、ブラウザキャッシュ設定です。↓
『XSEVER』サーバーパネルの『高速化』で『ブラウザキャッシュ設定』を選択します。
続いて、設定対象ドメインを選択し、『ON(推奨設定)』にします。↓
↓
『反映待ち』が表示されます。
長い時は15分くらいかかります。↓
『反映待ち』表示が無くなれば、設定完了です。↓
設定は以上です。簡単♪
『XSEVER』の『ブラウザキャッシュ設定』は、2018年9月に提供開始されました。
その際のエックスサーバー社長ブログコメントです。↓
Expiresヘッダを追加する「ブラウザキャッシュ設定」機能をエックスサーバーに追加しました。
ざっくり言うと、Webサイトにおける Google が推奨する高速化手法の一つで、それを簡単クリックで有効にできる機能です。
本機能を有効にすることで Google PageSpeed Insights などのスコア上昇も見込むことができます。ぜひご利用ください~。
頼もしいコメントですね!
では、ここまでの設定でのスピード計測です。
モバイルは『32』
なかなか伸びませんね・・・。
パソコンは↓
『86』!
いい感じに見えますが、計測のタイミングで上下しますので、とりあえずと考えます。
Google testmysiteのサイトスピード計測結果です。↓
こちらは『3秒』の『特に良好』を継続です。
いいですね♪
今後もブログ『未来への投資日記』を宜しくお願い致します。
勉強になるブログはこちらを↓