こんにちは、さいそん(@saison_program)です。
この記事では、当ブログで使用しているWordPressテーマ「SWELL」の表示速度を上げる設定方法について解説をしています。
・SWELLって本当に表示スピードが速いの？
・実際に使ってみてるけどあんまり変わらない気がします…
このような疑問を解消できるよう答えていきます。
- SWELL設定で表示スピードを高速化する設定
- SWELLの表示スピードをさらに高速化する方法
執筆者情報
WordPressテーマの「SWELL」は、プラグインを使用せずともサイトの表示スピードを高速にすることができる設定方法があります。
他のWordPressテーマ(AFFINGERを使っていました。)を使用している時には表示スピードを上げるためにプラグインをインストールしていました。
しかし、SWELLではプラグイン不要ですので大きなメリットとなります。
プラグインのインストール数を増やしてしまうとサイトの表示スピードの低下や、プラグイン同士の干渉による不具合発生の原因となりやすいデメリットがあります。
SWELLを使用している当ブログの表示スピードは以下のようになっています↓
SWELLでは簡単に設定ができるようになっていますので本記事を参考に設定を完了させていきましょう！
ではさっそく内容に入っていきます。
＼ 当ブログのWordPressテーマ ／
SWELL設定で表示を高速化する設定方法5つ
SWELL内の設定で表示を高速化させる方法は以下の5つです↓
- キャッシュ機能の設定
- 遅延読み込みの設定
- ファイル読み込みの設定
- ページ遷移高速化の設定
- フォントの設定
それぞれの具体的な設定方法を画像付きで解説をしていきますね。
【SWELL高速化1】キャッシュ機能の設定
SWELL設定にはキャッシュ機能を設定することで表示スピードの高速化をすることができます。
キャッシュとは、表示したサイトの情報を一時的に保存する仕組みのことです。
1.「SWELL設定」→「高速化」をクリック
2.「高速化」の欄にある8つの項目全てにチェック
最後の「ブログカードのキャッシュ期間」は30日のままでOKです！
※設定変更を即座に反映させる場合には手動でキャッシュをクリアする必要があります。こちらの手順で簡単にクリアすることができます↓
1.「SWELL設定」→「リセット」をクリック
2,上図の赤枠で囲んだ2つの「キャッシュを削除」ボタンをクリック
これだけですぐに設定を反映させることができます！
【SWELL高速化2】遅延読み込みの設定
遅延読み込みの設定をすることで、ページを開いた時に見えない下部の読み込みを遅らせて結果的に表示スピードの高速化に繋げることができます。
ページにアクセスした際に一気に全ての情報を読み込むと表示スピードが遅くなります！
ページ上部に表示されるものを優先的に表示させることでユーザーの離脱率を低下させることができるので設定しておきましょう。
1.「高速化」の欄を下にスクロールして3つの項目にチェック
- 記事下コンテンツを遅延読み込みすさせる
- フッターを遅延読み込みさせる
- スクリプト(lazysize.js)を使って遅延読み込みさせる
【SWELL高速化3】ファイル読み込みの設定
1.「高速化」の欄を下にスクロールして「SWELLのCSSをインラインで読み込む」にチェック
【SWELL高速化4】ページ遷移高速化の設定
1.「高速化」の欄を下にスクロールして「Prefetch」にチェック
この設定は、ブログ内のページ遷移速度を改善する設定です！
2.下の「設定を保存」をクリックして設定完了
【SWELL高速化5】フォントの設定
SWELLで使用しているフォントが表示スピードの遅延を引き起こす可能性があるのでフォントを変更しておきましょう。
「Noto sans JP」というフォントが遅延の原因となっています。こちらを違うフォントに変更することで表示スピードが改善されます。
フォントの変更の仕方はこちらです↓
1.「外観」→「カスタマイズ」→「サイト全体設定」→「基本デザイン」をクリック
このような画面が現れます。
2.「Noto sans JP」からお好みのフォントに変更
※当ブログでは游ゴシックを使用しています。
以上で表示スピードを高速化するSWELL内での設定は終了です！
次に、SWELL設定意外でさらに表示スピードを高速化する方法を紹介します。
＼ 当ブログのWordPressテーマ ／
SWELLの設定以外で高速化させる施策4つ
SWELL設定以外で表示スピードを高速させる施策は以下の3つです↓
- 画像ファイルを圧縮する
- 不要なプラグインの削除
- 下書きを削除する
- レンタルサーバーを変更する
それぞれ解説をしていきます。
【SWELL高速化6】画像ファイルを圧縮する
ブログ内で画像を使用する場合は必ず圧縮してから使用するようにしましょう。
表示スピードの遅延の大きな原因が画像ファイルのサイズです…！
画像を圧縮するプラグインも存在するのですが、プラグインの数を極力減らすことが大切ですので画像圧縮サイトで圧縮することをおすすめします。
どちらのサイトも画像をアップロードするだけでファイルサイズを圧縮することができます！
【SWELL高速化7】不要なプラグインの削除
先ほども説明した通り、プラグインの数は極力少ない方がサイトの表示スピードはアップします。
こまめに不要なプラグインの整理を行いましょう！
特にSWELLの場合は基本的な機能はほとんど備わっているのであまりプラグインを入れる必要がないのが強みです。
プラグインの削除は、「プラグイン」→「インストール済みプラグイン」の画面で行えます↓
ちなみに、初心者が「最低限」インストールしたおきたいおすすめのプラグインはこちらで解説をしています。
【SWELL高速化8】下書きを削除する
ブログを運営しているうちに記事の下書きがどんどん増えていきます。
クオリティが低い記事などは非公開にしたりしますよね。
実は下書きの状態になっている記事がたくさんあるとブログの表示スピードの遅延の原因となってしまいます。
極力不要な記事の下書きは削除するようにしましょう！
【SWELL高速化9】レンタルサーバーを変更する
あらゆる対策をしてもブログの表示速度が改善されない場合は、レンタルサーバーを変更することで改善できます。
表示スピードはSEOにも関わる重要な項目です。
SEO対策をしっかりしていても表示速度が遅いブログだと検索上位表示されにくいのでかなり致命的です。
おすすめは当ブログでも利用している「エックスサーバー」です。お得なキャンペーンを随時開催しているのでぜひ検討してみてくださいね。
以上がSWELLの設定以外で表示スピードを高速化させる施策の紹介でした。
ここまで徹底すればあなたのブログの表示スピードが改善されるはずです！
PageSpeed Insightsで表示スピードをチェック
これまでに紹介した各設定を改善したら実際に表示スピードを計測しましょう。
上のリンクからジャンプして赤枠に計測したいサイトのURLを入力し、「分析」をクリックするだけでOKです！
表示スピードが改善されているはずです！ここまでの作業、お疲れさまでした！
まとめ：SEOに強いSWELLで表示スピードを上げよう
本記事ではプラグインを使わずにSWELLの表示スピードをアップさせる方法について解説をしました。
- キャッシュ機能の設定
- 遅延読み込みの設定
- ファイル読み込みの設定
- ページ遷移高速化の設定
- フォントの設定
デフォルトではこれらの設定は行われていないので必ず設定をしておきましょう！
簡単な設定で僕の場合は大幅な表示スピード改善を行えました！
こちらの記事で表示スピードの高速化に最適なおすすめのレンタルサーバーについて解説をしています↓
＼ 当ブログのWordPressテーマ ／
