WordPress

Autoptimize(WordPressプラグイン)使い方と設定方法まとめ!キャッシュ削除はすべき?

WordPressでサイトを運営していて中々検索結果の順位が上がらないな・・・と思っている方もいると思います。しっかりSEO対策を学ぶというのも一つの手ではありますが、WordPressの高速化をすると検索順位が上がることもあるのです。

サイト高速化はプラグインのautoptimizeを導入することでできます。

autoptimizeをWordPressに導入することで必ずしも検索順位が上がるわけではありませんが、少なからずサイト高速化をすることで、ブログやサイトに訪問してきた方が快適に閲覧してくれる可能性が高まります。

離脱率を下げる意味でもWordPressにautoptimizeを導入しましょう。

では、WordPressのプラグインautoptimizeの使い方と設定方法を紹介していきます。

スポンサーリンク

Autoptimizeとは?効果は期待できる?

Autoptimizeとは簡単に言うと、サイトを軽くして高速化させるWordPressのプラグインです。導入し設定をするとCSSやHTML、JavaScriptのリソースを軽量して最適化してくれるので、検索順位が上がったり離脱率を下げてくれる効果が期待できます。

調べたいキーワードで検索をして見つけたページが中々開かなかったらイライラして、別のサイトのページを移ると思います。

それを解決する一つの手としてAutoptimizeを導入する方が多いのです。

佐備洲仕羽
佐備洲仕羽
最後まで読んでから導入することをお勧めするよ。

スポンサーリンク

WordPressにプラグイン(Autoptimize)を導入しよう!

まずは運営しているWordPressにプラグインAutoptimizeを導入しましょう。

WordPressにプラグイン(Autoptimize)を導入2

プラグインの検索窓に「Autoptimize」と入れると画像のようなプラグインが出てくるのでインストールして有効化させましょう。

WordPressにプラグイン(Autoptimize)を導入

プラグインを有効化させたら「設定」→「Autoptimize」でAutoptimizeの設定画面に移ります。

スポンサーリンク

【JS,CSS &HTML】Autoptimizeの使い方は?設定方法まとめ

「設定」→「Autoptimize」とクリックしていくと画像のような画面に移ります。

こちらの画面でAutoptimizeの使い方と設定を紹介していくのですが、使い方は簡単で「JS,CSS &HTML」「images」の2つだけの設定を行なっていきます。

まずは「JS,CSS &HTML」の設定方法なのですが、「JS,CSS &HTML」の中に

  1. JavaScript オプション
  2. CSS オプション
  3. HTML オプション

こちらの3つの項目を設定をしていきます。

Autoptimizeの使い方は?設定方法

「JavaScript コードの最適化」にチェックマークを入れると細かな設定をすることができるようになるのでチェックマークを入れてください。

「JavaScript コードの最適化」にチェックマークを入れたら「Aggregate JS-files?」「インラインの JS を連結」にもチェックマークを入れてください。

これでJavaScriptを圧縮してくれるのでファイルサイズを最適化してくれます。

他にも「<head> 内へ JavaScript を強制」という項目が有りますが、この項目にチェックマークを入れるとサイトの表示速度が遅くなる可能性があるので、先ほど紹介した項目だけにチェックマークを入れると良いでしょう。

画像の通りにチェックマークを入れてみてください。

JavaScript コードの最適化

JavaScriptのファイル内の改行などをなくすことでファイルサイズを圧縮してくれます。

Aggregate JS-files?

レンダリングブロックを回避させることができます。回避しないとサイトの読み込み速度が遅くなります。

インラインの JS を連結

HTMLに入力されているJavaScriptコードを抽出してJavaScriptファイルと連結させることができます。

Autoptimizeの使い方は?設定方法2

続いて、「CSS コードを最適化」にチェックマークを入れて細かな設定を行います。

「CSS コードを最適化」も「JavaScript コードの最適化」同様に「Aggregate JS-files?」と「インラインの JS を連結」にチェックマークを入れてください。

画像のようにチェックマークを入れてください。

CSSコードを最適化

CSSコードを圧縮し最適化させることができます。

Aggregate JS-files?

CSSファイルを一つに圧縮することができます。

インラインの JS を連結

HTMLとCSSを連結させることができます。

すべてのCSSをインライン化

こちらにチェックマークを入れないとサイトのデザインが壊れる危険性があります。

Autoptimizeの使い方は?設定方法3

続いて、「HTML オプション」に関してはチェックマークは入れなくても良いでしょう。

そこまでサイトの高速化されないのと、改行をなくしHTMLファイルを圧縮してくれますが、サイトのデザインが変わってしまう可能性があるのでチェックマークは入れなくても良いでしょう。

他の「CDN オプション」や「その他オプション」は初期設定のままで十分です。

【images】Autoptimizeの使い方は?設定方法まとめ

最後にAutoptimizeの「images」を設定していきます。設定と言っても画像の通り、一箇所にチェックマークを入れるだけです。

Autoptimizeの使い方は?設定方法 images

「Lazy-load images?」にチェックマークを入れることでパソコンやスマホで見えていない画像の読み込みを遅らせることができるので、サイトの表示速度が上がるようになります。

Autoptimizeでキャッシュ削除すべき?

Autoptimizeでキャッシュ削除すべき

最後にAutoptimizeの設定を保存する際に「変更を保存」と「変更を保存してキャッシュを削除」の2つが有りますが、そもそもキャッシュは削除した方がいいのでしょうか?

サイトのキャッシュというのは一度訪問したページのデータを保存して次に訪問したときにう早く表示させるものです。

サイトの訪問者側からすると便利なものなのですが、サイト運営者からするとキャッシュが溜まっていくと動作が遅くなることがあるので、キャッシュは定期的に削除していった方が良いでしょう。

なので、Autoptimizeの変更を保存する際には「変更を保存してキャッシュを削除」で変更を保存しましょう。

さらにキャッシュが溜まりすぎると以下のようなメッセージが表示されます。

Autoptimizeのキャッシュサイズが肥大化してきたので、キャッシュの削除を検討してください。キャッシュサイズの制御方法については、https:/ja./wordpress.org/plugins/autoptimize/faq/ をご覧ください。 (site: https://www.na-tan.com/wp)

このような表示出てくるということはキャッシュが溜まりまくっている状態なので、一刻も早くキャッシュの削除を行いましょう。

Autoptimizeでキャッシュ削除すべき2

Autoptimizeを導入することで簡単にキャッシュの削除が行えるので便利です。

Autoptimizeの使い方まとめ

WordPressのサイト高速化プラグインで有名なAutoptimizeの使い方と設定方法を紹介しました。

個人的に複数のサイトを運営していますが、全てのサイトにAutoptimizeを導入しています。Autoptimizeを導入してから何か変わったか?というと、難しいところがありますが、無いよりはあった方がいいプラグインだと思うので導入してみると良いかもしれません。

しかしAutoptimizeを導入してサイトのデザインが崩れてしまう可能性もあるので、もしサイトのデザインが崩れたらAutoptimizeをアンインストールするといいでしょう。