STORK(ストーク)のサイト表示速度を改善した7つの方法【コードはわからなくてOK!】

アイキャッチ
SPONSORED LINK

 

こんにちは。カトヒサ(@hisayosky)です。

 

2年近く運営している当サイトですが、最近

リトルカトー

あれ!? サイトの表示速度がめっちゃ落ちてる。

なんとかしなければ!

という事態に陥りました。

 

PageSpeed Insights で計測したら

表示速度

表示速度
パソコンが64、モバイルが25という目を疑うほどのロースコア。由々しき事態です。

 

最近PVが目に見えて落ちていたのも、サイト表示速度に関係していたかもしれません。

さっそく手を打ちました。そしたら、表示速度

表示速度

パソコンは94に改善しました。

モバイルは逆に21に落ちたのですが、調べたところとりあえずはこのままでも大丈夫らしいことがわかりました。

 

そのあたりの理由も含めて、今回ぼくが当サイトの表示速度改善のためにやったことを紹介します。

コードは一切触らないので「HTMLってなに?」という人でもできるはずです。

コード触るのって怖いですもんね。。。

ではいってみましょう。

 

SPONSORED LINK

スポンサードサーチ

当サイトの概要

まずは当サイトの基本情報です。

  • サーバー:エックスサーバー(X10スタンダードプラン)
  • PHPバージョン:7.1.18
  • ワードプレス テーマ:ストーク

 

という内容です。

一般的にストークは「表示速度が遅い」と言われているようです。

 

サイト表示高速化のためにやったこと

horses

サーバーサイドでやったこと

Xサーバーの管理画面でやったことは

  • PHPのバージョンアップ
  • Xアクセラレータの設定

 

です。

一つずつ説明します。

 

✅ PHPのバージョンアップ

Xサーバー

PHPのバージョンを「7.1.18」から「7.2.6」にしました。

すると、

warning

サイト上部に Warning が出てしまいました。こういうのビビりますね。

 

Warning をよく見ると「Post Views」というプラグインに何か不都合があるらしいとわかりました。

これを「停止」にしたところ Warning は消えました。

 

PHPのバージョンを変えて Warning が出たら「どこに問題がありそうか」落ち着いてよく見てみましょう。

案外簡単に解消できることかもしれません。

 

✅ Xアクセラレータの設定

アクセラレーター

これもサーバーパネルから設定できます。

 

Xアクセラレーターとはなんぞやですが、Xサーバーのサイトによると

「Xアクセラレータ Ver.2」では、すでに提供中の高速化機能「Xアクセラレータ」に、PHPプログラムの処理速度がキャッシュなしで最大20倍(※1)、WordPressでは最大10倍(※2)となる、新たなPHP高速化機能を追加しています。

「Xアクセラレータ Ver.2」のご利用により、運営中のWebサイトがこれまで以上に高速になるとともに、大量アクセスへの耐性がより強化されます。

出典:Xサーバー

処理速度が速くなるのは間違いないようなので、Ver.2に上げておきました。

アクセラレーター

ただ選んで確定するだけなので簡単です。

 

ワードプレス の管理画面でやったこと

管理画面でやったのは以下の5点です。

  • ヘッダー画像の削除
  • 「001 Prime Strategy Translate Accelerator」の導入
  • 「WP Fastest Cache」 の導入
  • 「Speed Up – JavaScript To Footer」の導入
  • 「Akismet Anti-Spam」を削除して「Invisible reCaptcha」を導入

 

順番に見ていきましょう。

 

✅ヘッダー画像の削除

ブログトップ

 

当サイトの場合そんなに影響ないかもしれませんが、読み込む画像は少ないに越したことはありません。

ということで思い切ってヘッダーにあった画像を消しました。

トップページがスッキリしました。

 

✅「001 Prime Strategy Translate Accelerator」の導入

001 Prime Strategy Translate Accelerator

「001 Prime Strategy Translate Accelerator」は平たく言うと

WordPressは英語のソフトだから日本語で表示するには翻訳ファイルを読み込む必要があって遅くなるよ!

だから早く読み込むためにキャッシュ化しておこうよ!

出典:https://affiliate-market.net/001-prime-strategy-translate-accelerator/

というプラグインです。

 

設定は『001 Prime Strategy Translate Accelerator』設定まとめ。高速化プラグインですを参考にしました。

記事のとおりにやっていけばむずかしくないはずです。

 

✅ 「WP Fastest Cache」 の導入

wp fast cache

「キャッシュ系のプラグインを入れると不具合が出やすい」という記事が散見される中、いくつかの記事で「ストークでも大丈夫!」と言われていたのが「WP Fastest Cache」でした。

実際入れてみても不具合はありませんでした。

 

詳しい設定の仕方はWP Fastest Cache・WordPress高速化のキャッシュプラグインの設定まとめの通りにやればOKです。

これもむずかしくありません。

 

✅ Speed Up – JavaScript To Footerの導入

speed up

読み込みに時間のかかるJavascriptをフッターに移動してくれるプラグインです。

こちらはインストールして有効化するだけです。設定は不要。

 

✅ 「Akismet Anti-Spam」を削除して「Invisible reCaptcha」を導入

プラグイン

ちょっとめんどくさいんですがやってみました。

参考にしたのはWordPressを高速化!サイトの表示速度をアップさせる5つの方法!です。

こちらの記事によると、

  • 「Akismet Anti-Spam」は重い
  • しかもスパム投稿自体は防止できない(別のフォルダに隠しているだけ)

 

とのことでしたので、思い切って「Akismet Anti-Spam」は切ってInvisible reCaptcha」を導入してみました。

「Invisible reCaptcha」はよく「私はロボットではありません」にチェックしたり、「お店の画像をすべてタップしてください」と言われたりする認証方法ですね。

 

設定は「Google  reCAPTCHA」のサイトで行うものと、ワードプレスの管理画面で行うものがあります。

やり方はWordPressのスパム対策に最適なInvisible reCAPTCHAの導入方法!のとおりです。

これだけ気長にがんばりましょう。

 

変更してみていまのところスパムの動向に変化はありません。

もしおかしなことがあればこちらに追記します。

 

スポンサードサーチ

入れてみてダメだったプラグイン

「これはいい!」と言われながら、自分のサイトではいまひとつなプラグインは存在します。

今回もありましたので報告します。

 

✅ Autoptimize

プラグイン

「HTML、CSS、Javascript を最適化するプラグイン」だそうですが、導入したらカクカクした動きになりました

設定次第では大丈夫という記事もありましたが、当サイトはダメでしたね。

 

✅ Lazy Load

プラグイン

その名の通り画像が遅れて読み込まれるプラグインですが、ちょっと遅れすぎでした。

いちいち画像がロードされてくるのは見辛かったので削除。

 

✅ Speed Up – Optimize CSS Delivery

プラグイン

スタイルシートを非同期で読み込むことで表示時間を早くするプラグインです。

が、あきらかに「タイミング外して読み込んでるなあ」というのがわかる

ユラっとサイトが動く感じはユーザーにやさしくなかったので却下。

 

モバイルの表示速度は遅いままでいい?

カタツムリ

世はモバイルファーストなので、モバイルの表示速度こそ遅くていいわけはありません。

 

スコアはものすごく低いですが、使ってみた感じはスコアほど遅くはありません。

これはなんだ? と検索したところ Pagespeed Insightsがモバイルだけ遅い! 対策は不要です という記事に辿り着きました。

こちらの記事によるとモバイルのスコアの低下は「Pagespeed Insights の設定が変わったことによるもので本当にサイトが遅くなったわけではない」とのこと。

なのでまあよしとしました。

 

スポンサードサーチ

サイトの高速化にはいろんな方法がある

マーケット

調べてみるとサイトの高速化にはいろんなやり方があります。

おかげで、むずかしそうなのを避けたとしてもできることが見つかります。

 

今回ぼくは「ストーク 高速化」で検索し、表示された記事の上位からできそうなことを手当たり次第やっていきました

「うちのサイトはストークじゃないんだよね」という方も「お使いのテーマ + 高速化」で検索してみると、いい方法が見つけられるかもしれません。

 

まとめ:ストークのサイト表示速度はサーバーとプラグインをいじるだけでも改善しました

  • 表示速度は「サーバーサイド」と「プラグイン」で改善できる
  • プラグインはとりあえず試して、ダメだったら削除
  • 「テーマ名 + 高速化」で検索するといろんな方法が見つかる

 

▼最後まで読んでくれたあなたにおすすめの記事
【朗報】音声入力をブログで活用したら記事作成時間が半分になったので紹介します

 




当サイトは「STORK」を使用しています

関連記事