【サイトが重い方必見】ブログの表示速度を改善する方法｜AFFINGER6

こういったお悩みを解決します！

当ブログも今回解説することを実践するまで、サイトスピードは20以下と最悪のスコアでした…

これから紹介する「サイトスコアを改善する方法9選」を実践していただければ、サイトの表示速度を改善することができます

この記事の内容は以下の通りです

当ブログはAFFINGER6 × エックスサーバーで運用しています！ぜひ以下からチェックしてみてください！

【WordPress有料テーマ】AFFINGER6の魅力を徹底解説！アフィリエイトをやりたい人必見！

こんなお悩み解決します！ どうもTomoMiniBlog管理人のTomoです（@tomominiblog）！ 今回はWordPressでおすすめのテーマ、AFFINGER6についておすすめの理由やメリ ...

ブログの表示速度はSEOには必須

ブログの表示速度が遅いと、Googleだけでなく、読者もいい評価をしてくれません。

Googleはモバイル検索のランキング要素として、サイトスコアを使用するとしているため、表示速度が遅いサイトはランキング上位に入ることができません

» Google ウェブマスター向け公式ブログ

また、読者もブログサイトが表示される時間が5秒を超えると、直帰率は表示時間1秒に比べて90％も増加するという調査結果も出ています

参考資料：Find out how you stack up to new industry benchmarks for mobile page speed

ブログの表示速度はPageSpeed Insights - Google Developersで確認することができます

このページでは”サイトスコア”として、ブログを評価したものを確認できます

これから紹介することを実践したおかげでモバイルスコアは18から50、PCスコアは40から92まで改善することができました

【AFFINGER6】ブログの表示速度を改善する方法9選

これから紹介する改善方法は以下の９つになります

• 画像を軽量化する
• 次世代フォーマットを使用する
• プラグインを減らす
• サーバーを検討する
• Twitterの埋め込みをなくす
• 遅延読み込みプラグインを使用する
• アドセンス広告の停止
• 不要なCSSを削除
• ブログの構成を考える

手段①：画像を軽量化する

まずは既存の画像を軽量化、これから投稿する画像を軽量化します

画像を200KB以下にしておくと、サイトスコアの向上につながります。画像を軽量化する方法は３つです

• WordPressプラグイン「EWWW Image Optimizer」
• 圧縮してから投稿する
• 画像を次世代フォーマットにする（手段②で解説）

Macをご利用の方は、プリインストールアプリの「Automator」を利用して圧縮する方法を以下の記事で解説しています

【ブログ用画像】MacのAutomatorで画像を簡単に圧縮する方法

軽量化プラグインはさまざまありますが、私は「EWWW Image Optimizer」を使用しています

「EWWW Image Optimizer」は画像を軽量化するだけでなく、自動でこれから投稿する画像も軽量化・リサイズしてくれます

手段②：画像を次世代フォーマット形式にする

Googleが開発した画像フォーマットに、WebPという画像ファイル形式があります

この画像形式にすることで、画像の品質を落とすことなく軽量化することが可能です

次世代フォーマットに変更する際も「EWWW Image Optimizer」を使うことでできます

設定から「EWWW Image Optimizer」の設定画面へ進み、WebP変換の「一括最適化」を行います

ブラウザ（ChromeやSafariなど）によってはWebPに対応していないブラウザもあります

しかし、その場合でも「EWWW Image Optimizer」は自動的に切り替えて表示してくれるのでとても便利です

手段③：プラグインを減らす

実はブログを表示するときにプラグインも読み込んでいます

そのため、プラグインが多いとサイトの表示速度にも影響が出てきます

プラグインの数はできるだけ少なく抑えましょう

私が導入しているプラグインは以下の通りになります

よく必須系のプラグインとしてJet Packが紹介されますが、私は導入していません

JetPackはセキュリティやアクセス管理に役立つと言っていますが、動きが重く、サイトスコアに影響するとも言われています

手段④：サーバーを検討する

いくら画像を軽量化したり、プラグインを減らしたところで、サーバーの速度が遅ければ意味がありません

PageSpeed Insights - Google Developersでは、サイトの速度だけでなく、サーバーの速度も計測することができます

そこでのサーバーの速度が遅い場合は乗り換えを検討してみてください

おすすめのサーバー３選

私が使用している「エックスサーバー」はサーバー速度No.1かつ国内シェアNo.1のレンタルサーバーです

手段⑤：Twitterの埋め込みを消す

Twitterのタイムラインを埋め込むのはサイトスコアの低下を引き起こす可能性が高いです

Twitterのタイムラインはどんな投稿をしているのかを見せることができるので、便利な反面

表示させるまでには時間がかかってしまいます

Twitterに誘導したい場合は、以下のようなボタンを作成してみると良いかもしれないですね

Twitterで見てみる

手段⑥：遅延読み込みプラグインを導入する

遅延読み込みプラグインとは、表示されていない部分の画像は読み込まないというプラグインです

これを使うことにより、最初に表示される部分だけが優先して読み込まれるので、表示速度が向上します

最も有名な遅延読み込みプラグインは「Lazy Load」です

ワードプレスのプラグイン新規追加から追加できます

Lazy Loadには種類がたくさんありますが、私が導入しているのはGoogleが作成している「Native Lazyload」です

これはインストールするだけでいいので、細かな設定が要らずとても楽チンです

手段⑦：アドセンス広告の停止

Googleアドセンスは、広告を表示させるためにヘッダーのコードを読み取りに時間がかかります

Googleアドセンスは収益のために大きく貢献をしてくれますが、サイトスコアを向上させて検索ランキングをあげる方を優先させた方がいいです

検索ランキングが向上することで、PV数が上がり、結果的に収益増加に繋がります

SNSからの集客をメインにしている方はアドセンス広告を停止しなくても検索ランキングに関係しないので表示してもいいと思います

収益はアフィリエイト広告の方が圧倒的に高いので、いずれはアフィリエイトをメインにできるといいです

手段⑧：不要なCSSを消去する

AFFINGERでは独自のCSSを追加して、ブログの見た目を変更することが可能です

独自のCSSが入っているかは、「外観」→「カスタマイズ」→「追加CSS」から確認することができます

しかしこのCSSは別ファイルとして読み込まれるので、表示速度低下に繋がってしまいます

プラグインを使用することで、改善することもできますが、私はそれを実践してもあまり効果がありませんでした

「これは絶対に必要なCSSだ！」というもの以外は削除してしまいましょう

手段⑨：ブログの構成を考える

私はブログのトップページだけで、４０個以上の画像を表示していたため読み込みにかなり時間がかかってしまっていました

トップページで自分のブログのいいところや、記事を全部伝えたいですが、詰め込みすぎてしまうとサイトスコアの低下を招きます

画像だけで伝えるのではなく、なるべくテキストなどを入れてブログの構成を考えることをおすすめします

まとめ：AFFINGER6 × エックスサーバーで快適ブログへ！

今回は「ブログの表示速度を改善する方法９選」という内容で、解説をしました

この９つを実践して、ぜひあなたのブログのサイトスコアを高めて、高ランクの検索結果を獲得できるようにしましょう！

このブログでは他にもブログに関する記事や、WordPressテーマに関する記事があるのでそちらもチェックしてみてください

今回紹介したエックスサーバーのお申し込みは以下からどうぞ。では。