こんな悩みを解決します。
記事の内容
- サイト表示速度について
- サイト表示速度を測る方法
- AFFINGER6でサイト表示速度を速くする方法５選
プロフィール
よっしー（@yosshiblog）
「AFFINGER６って機能が多くて有名だけど、サイト表示速度は速いの？」
結論、AFFINGER６のサイト表示速度は速いです。
というのも、機能が多い反面サイト表示速度に影響しがちですが、しっかりとSEO内部対策されているからですね。
当サイトのサイト表示速度は、以下の通り。
サイト表示速度チェックツール
- モバイルサイト→６３
- PCサイト→９５
（モバイルサイトは４０点以上、PCサイトは５０点以上が目安）
モバイルサイトが６３点と低く感じますが、サイト表示の対策なしだと２０，３０点台でした。
ちなみに、６０点代でもサイトをっ開くまで１秒もかからないので問題ありません。
AFFINGER6のサイト表示速度は速いと言っても、他の有料テーマと比べると機能が多い分遅くなってしまいます。
なので、今回はAFFINGER6でサイト表示速度が速くなる方法５選と実際に対策したときの数値を紹介していきます。
（AFFINGER６をまだ導入していない方は、こちらの最強テーマAFFINGER6のレビュー【一番おすすめの有料テーマ】で細かく解説をしているのでぜひご覧ください。）
サイト表示速度とは？：Googleの評価に繋がる
サイト表示速度とは、Webページの読み込みや応答にかかる時間のことです。
このサイト表示速度を改善することで、様々な効果が得られます。
- ユーザー離れが無くなる
- SEOに影響する
- クローラーに影響する
特に、サイト表示速度が遅いとユーザーの直帰率に影響します。
直帰率とは、ユーザーがサイトに訪れた時に１サイトしか閲覧しなかったパーセンテージのことです。
直帰率について、このようなデータがあります。
直帰率の推移
出典： Find out how you stack up to new industry benchmarks for mobile page speed
サイト表示速度が３秒だと１秒の３２％増
サイト表示速度が５秒だと１秒の９０％増
サイト表示速度が６秒だと１秒の１０６％増
サイト表示速度が１０秒だと１秒の１２３％増
サイト表示速度が数秒遅いだけで、これだけ直帰率が高くなってしまうことが分かります。
１０秒以上なんて誰も見ないですよね。
サイト表示速度は、一般的に３秒以内がいいとされています。
見たいサイトをクリックして３秒以内なら待ってくれるということです。
逆に、サイト表示速度が３秒以上だと「このサイト表示が遅いな～」とすぐ離脱してしまうのです。
サイト表示速度の測り方
サイト表示速度は、「PageSpeed Insights」というツールで測ることが出来ます。
（ページに飛んだらブックマークをして、いつでも測れるようにしましょう。）
「PageSpeed Insights」
「PageSpeed Insights」に自分のサイトのURLを入れて検索をしたら、PCサイトとモバイルサイトの点数が出ます。
当サイトのモバイルサイトとPCサイトの点数は、以下の通り。
当サイトの表示速度
サイト表示速度の対策をした後の点数になります。
ちなみに、PageSpeed Insightsで計測した点数は以下のように分かれます。
| スコア | 評価 |
| ０～４９ | 改善が必要 |
| ５０～８０ | 若干の改善が必要 |
| ９０～１００ | ほぼ最適化しているので改善の必要なし |
Googleはモバイルサイトのサイト表示速度を重要視しているので、モバイルサイトの点数を上げる努力が必要です。
とは言っても、モバイルサイトの点数は４０点以上あれば十分ですので簡単に達成することが出来ます。
当サイトも最初は４０点台でしたが、今から紹介する対策をしたところ６０点台まで点数が良くなりました。
５回計測した時のデーターが以下の通り。
| 当サイトの計測結果 | １回目 | ２回目 | ３回目 | ４回目 | ５回目 | 平均 |
| モバイルサイト | ５７ | ６１ | ６３ | ６７ | ６８ | ６３．２ |
| PCサイト | ９３ | ９２ | ９３ | ９２ | ９４ | ９２．８ |
（対策前はモバイルサイトで４０点台、PCサイトで８０点台）
理論上対策前の時点で十分な表示速度ですが、画像の読み込み速度やサイトの読み込みに時間がかかる時が多いので対策が必要と判断しました。
AFFINGER6でサイト表示速度を速くする方法５選
AFFINGER6でサイト表示速度を速くする方法は、以下の通りになります。
- 画像を圧縮する
- 圧縮プラグインを使う
- SNSリンクを極力貼らない
- スライドショーを使わない
- プラグインを極力減らす
では、順に解説をします。
方法①：画像を圧縮する
ブログで使用する画像はなるべく圧縮することで、サイト表示速度に繋がります。
プラグインで圧縮したところで元々の容量が大きいと意味がありません。
代表的な画像圧縮ツールは、以下の通り。
圧縮方法はほとんど同じなので今回は、「TinyPNG」で解説をします。
画像圧縮ツール「TinyPNG」
画像圧縮のやり方はとても簡単で、圧縮したい画像を真ん中にドラッグして圧縮されます。
圧縮した画像をドラッグ
圧縮された画像をダウンロードしたら完了です。
ダウンロードを押して完了
容量が少ない画像を使う時は、「TinyPNG」だけで十分ですが、容量が多い時は他の画像圧縮ツール使ったほうが良いでしょう。
容量が多い時は「Bulk Resize Photos」を使っています。
方法②：プラグインを使う
サイト表示速度を速くするプラグインが３つあるので紹介します。
- EWWW Image optimizer・・・画像圧縮
- Autoptimize ・・・HTMLコード、CSSコードなどの最適化
順に解説をします。
EWWW Image optimizer
「EWWW Image optimizer」は、WordPress内にある画像を圧縮してくれるプラグインです。
ブログで画像をたくさん使うことで分かりやすく説明できますが、その反面画像を使いすぎると容量がどんどん多くなっていきサイト表示速度が遅くなってしまいます。
「EWWW Image optimizer」は、画像を劣化することなく画像サイズを縮小してくれるので、必ず入れておくべきプラグインですね。
このプラグインを紹介しているブロガーさんをたくさんいるのでお勧めです。
Autoptimize
「Autoptimize」は、WordPressのソースコードを最適化してくれるプラグインです。
また、画像遅延読み込みもこのプラグインで設定します。
「Autoptimize」で出来る最適化は、以下の通り。
- JavaScriptの最適化
- CSSの最適化
- HTMLの最適化
- 画像の最適化
HTMLコードやCSSコードをよく使う人は入れておくべきプラグインですね。
当サイトのサイト表示速度は、モバイルサイトで平均６０点です。
「Autoptimize」なしだと、サイト表示速度が４０点台までさがってしまいます。
サイト表示速度が速くなるプラグインは他にもありますが、「EWWW Image optimizer」と「Autoptimize」だけで十分でしょう。
プラグインを入れすぎると逆に遅くなったり、機能がダブったりしてSEOに悪影響です。
方法③：SNSリンクを極力貼らない
よく記事にSNSリンクを張っている人がいますが、極力やめておきましょう。
SNSリンクは、サイドバーだけで十分です。
当サイトも「AFFINGERの評判」でツイッターのリンクを張っていますが、そのさいとの表示速度は遅くなってしまいます。
サイト単位でサイト表示速度計測すると良く分かります。
（実際にリンクに飛んでサイト表示速度を確認してみてください。）
このように記事にツイッターのリンクを張っていないだけでこんなにも差が生まれます。
SNSのリンクを入れるとしても、１つか２つまでにしておきましょう。
方法④：スライドショーを使わない
スライドショーの画像です
スライドショーは、サイトのデザインが良くなったり内部リンクの方法の一つとして有効ですが、その反面サイト表示速度が遅くなってしまいます。
AFFINGERのスライドショーはカッコいいデザインなので、使いたくなってしまいますよね。
ですが、サイト表示速度が最優先ですのでスライドショーはあまり使わないようにしましょう。
トップページのサイトデザインを意識するのなら、当サイトのデザインを真似しても良いのでぜひ参考にしてください。
方法⑤：プラグインを極力減らす
プラグインは、ブログ運営をしていくうえで必須です。
ブログを豊かにしてくれるプラグインですが、入れすぎるとサイト表示速度が遅くなってしまいます。
当サイトで使っているプラグインは、以下の通り。
- Advanced Editor Tools (旧名 TinyMCE Advanced)
- Autoptimize
- BackWPup
- Classic Editor
- Contact Form 7
- EWWW Image Optimizer
- Font Awesome
- Invisible reCaptcha
- PS Auto Sitemap
- SiteGuard WP Plugin
- SUGOI MOKUJI（すごいもくじ）LITE
- XML Sitemaps
一見多いようにも見えますが、これでも減らした方です。
サイト表示速度の対策をしていない時は、２０個近くのプラグインがありました。
特に有効化をお勧めしないプラグインは「All in One SEO」です。
SEO対策やSNSの連携など便利なプラグインですが、めちゃくちゃ重たいです。
なにも知らないブログ初心者が「このプラグインを導入するだけで上位表示が可能」という宣伝につられて有効化しがちなんですが、有料のWordpressテーマを選んでおけば「All in One SEO」は必要ないので、サイト表示速度を優先しましょう。
まとめ：シンプルがベスト
今回は、「AFFINGER6でサイト表示速度を速くする方法５選」を紹介しました。
サイト表示速度はあまり気にしていないブロガーが多いですが、SEO的にも意外と優先度が高いです。
まだ対策をしていないのなら「PageSpeed Insights」で計測をしたり、実際に自分のサイトが何秒かかっているのか測ってみたりしてみてください。
AFFINGER6は機能が多くて優秀なテーマですが、表示速度の対策は必要ですので必ず行ってください。
