MENU

最大52点も改善した『SWELL』の表示速度をさらに爆速にする5つの設定方法

悩める人

サイトの表示速度は早い方がいいと聞いたけど、早くする方法はあるの?

ブログ初心者

『SWELL』にテーマを変更したけど、もっともっと表示速度を早くしたい!

そんな方の疑問・要望に答えましょう。

私も実際にこの設定方法を試してPageSpeed Insightsでこのブログの結果が改善されたので、再現性はかなりあるかと思います。

スマホの表示速度はGoogleでの検索順位を決定づける重要な指標となっているので、優先して対応した方が良い設定項目です。

むしろ、設定次第ではとんでもなく最悪な設定をしてしまっている可能性もあります…

ちなみに、ほぼすべての項目は簡単に対応可能なので、もし未対応の場合はサクッと再設定しちゃいましょう!

記事を書いてる人

目次

表示速度の測定方法をおさらい

表示速度の計測方法をおさらいしましょう。すでにご存知の方は飛ばしてください。

表示速度の計測にはGoogleから提供されている測定ツールPageSpeed Insightsを利用します。

計測したいURL(ページ単位でもOK)をコピペして「分析」をクリックするだけで誰でも簡単かつ無料で対象URLの表示速度を計測することができますよ。

サイト自体の速度を計測したい場合はトップドメイン(〜.jp、〜.com、〜.netなど)まで入れればOKです。

計測時間はサイトの大きさによって遅くなりますが、10〜20秒くらいで計測結果が表示されます。

『SWELL』の表示速度をさらに爆速にする5つの設定方法

1つ目:フォントの設定を変更する

これが最も簡単かつ表示速度を改善する上で効果的だったので、『SWELL』を導入している方は絶対に全員確認したほうが良い設定方法です。

その方法とは…「フォントの設定を変更する」だけです。

え?それだけ?と思われた方もいると思いますが、本当にそれだけなんです。

『SWELL』をテーマに適用すると【Noto sant JP】というフォントがデフォルトで設定されています。

まず試しに【Noto sant JP】での表示速度は下記の通りです。

これを【Noto santo JP】➡【游ゴシック】に変更してみると…

パソコン版のみですが12も表示速度が改善されました。

計測時に多少の誤差はありますが、デフォルトのフォント設定から変更した方がメリットがあることがわかりました。

ただ恐ろしいのはこれからで、他のフォントでも試してみた結果はこのようになっています。

フォント種類スマホパソコン
游ゴシック99点99点
ヒラギノ>メイリオ99点99点
Noto Sans JP91点87点
明朝体47点88点

誰でも簡単に設定できる方法なので、【Noto sant JP】にこだわっていないなら他の3種類のいずれかのフォントに変更しましょう。

なんと【明朝体】に設定しただけで最大52点もスコアがだだ下がりしてしまったんです。

フォントだけでこれほどスコアが変わるとは驚きですね…

『SWELL』のフォント変更はカスタマイズから一瞬でできるので、游ゴシックヒラギノ>メイリオのどちらかを利用することをおすすめします。

2つ目:キャッシュ項目の変更

キャッシュについての詳しい説明は省きますが、キャッシュを有効にすると表示速度は上がります。

通常であればプラグインなどを使ってキャッシュを有効化しますが、『SWELL』にはテーマ自体にキャッシュの有効化項目が細かく設定できる仕様になっているので、とても便利なんです。

キャッシュ項目の変更は【SWELL設定】➡【高速化】と移動します。

デフォルトではキャッシュ機能内の「動的なCSSをキャッシュする」と「外部リンクのブログカードをキャッシュする」の2つにしかチェックが入っていないと思うので、全てにチェックを入れてしまいましょう。

ブログカードのキャッシュ期間は特にいじらず「30日間」のままでOKです。

これでキャッシュの対象範囲が広がって、サイトの表示速度は上がります。

3つ目:遅延読み込み機能

この機能は「ページを表示した際に画面には見えない要素の読み込みを遅らせる機能」です。

WEBサイトは通常、画面に見えていない要素まで全て読み込んだ後に画面が表示されるため、記事下の関連記事やフッター部分の読み込みに手間取ると、画面が表示されるまで時間がかかってしまうんです。

この機能を有効にすることでメインコンテンツを先に読み込み、見えない部分はユーザーが記事を読んでいる間に読み込みをするようになるので、メインコンテンツ部分の表示速度は上がるということになります。

この設定画面は【SWELL設定】➡【高速化】の中にある遅延読み込み機能の「記事下コンテンツを遅延読み込みさせる」と「フッターを遅延読み込みさせる」の2つにチェックを入れましょう。

4つ目:無駄なプラグインの無効化/削除

新規にワードプレスでブログを立ち上げたばかりの方にはあまり関係ありませんが、他のテーマを利用していて途中で『SWELL』にテーマを変更した方にはガッツリ関係ある内容です。

『SWELL』では公式サイトで「非推奨・不必要なプラグイン」が紹介されています。

>> SWELLで非推奨・不必要なプラグインと、推奨プラグインについて

ここで紹介されているプラグインは開発者が『SWELL』を利用する上で「機能が重複している」・「不具合を起こす」とするプラグインです。

プラグインというのは便利な機能を簡単に実装できるWordPressを利用する上で必須のオプションですが、例えば人に防御力が上がるからといって鎧を着せまくると防御力は上がりますが、逆に重くなって動きづらくなります。

これと同じくWordPressにプラグインを追加しすぎるとサイトが重くなってしまうんです。

よって、開発者が不要としているプラグインがインストールされている場合は全て無効化するか削除してしまいましょう。

不要なものを削除することで軽くなるだけでなく、不具合も解消されるというメリットもあるんです。

実際、私もブロックエディターのメニューに「インラインの文字色変更項目が出ない」という不具合がありました。調べても全く解決しなくてこまっていました。

それが、開発者がここで紹介している不要プラグインの「Advanced Editor Tools(旧TinyMCE Advanced)」というプラグインが入れっぱなしになっていたので、これを無効化したところ問題が解消されました。

このように、サイト速度が遅くなるだけでなくブログ運営に支障きたす不具合もあるため、「非推奨・不必要なプラグイン」を一度チェックしてみましょう。

5つ目:画像の圧縮

ブログを運営する上で、アイキャッチ画像・記事内に差し込む画像など、大量の画像を使いますよね。

画像はテキストに比べると圧倒的に容量が大きいので、ブログを長く運営しているとWordPressにアップした画像が負担となりサイト表示を遅らせます。

よって、画像は圧縮するのがWordPressを利用する上でマストなんですが、アップした画像を自動で圧縮してくれる便利もプラグインもあったりするわけです。

ただ、この「EWWW Image Optimizer」を代表とする画像圧縮系プラグインは開発者から非推奨とされているんです。

ちょっと面倒ですが、開発者が推奨しているTinyPNGといった画像圧縮サービスでWordPressで利用する予定の画像を圧縮した後、アップロードするという方法で対応しましょう。

まとめ

『SWELL』の表示速度をさらに爆速にする5つの設定方法をご紹介しました。

サイトの表示速度については、Googleがウェブマスター向け公式ブログやウェブページUXの指標「コアウェブバイタル」で導入しているように、検索順位を決定づける重要なランキング要因となっています。

今後もその重要性は確実に上がっていくはずなので、『SWELL』を利用している方は当記事でご紹介したことをマストにして、自分のブログの表示速度を爆速にしてくださいね!

よかったらフォローしてね!
シンプル美と機能性を両立させた、国内最高峰のWordPressテーマ『SWELL』
目次
閉じる