WordPressプラグインであるAutoptimizeの設定方法や使い方について詳しく知りたい。
本記事は、上記の方を想定しています。
執筆者:WordPress歴5年以上の私が詳しく画像つきで「Autoptimizeの設定方法や使い方」について解説しています。
Autoptimizeはコード圧縮系のプラグインなので、不具合が生じやすいです。
そのため、本記事を参考にコードを圧縮する際は、事前にバックアップを取ってから行ってください。
当サイトの情報:特に有料WordPressテーマを活用している方は注意してください。不具合が生じやすいので。
Autoptimizeとはどんなプラグインなのか
Autoptimizeとは、肥大化したソースコード(HTML、CSS、JavaScriptなど)を圧縮してくれるWordPressプラグインです。
イメージしやすいように、圧縮前と圧縮後の画像を用意しました。
このように、ソースコードを圧縮することで、無駄なスペース部分を削り、結果的に表示速度を早くすることができるのです。
本来は、ソースコード圧縮系のツールを活用するのですが、WordPressにはプラグインという素晴らしい物があるので、そちらを使うのが当たり前とされています。
- ソースコードを圧縮するためのプラグイン
- Autoptimizeを使うことで表示速度が上がる
プラグインAutoptimizeのデメリット
良い事だらけのように見えますが、Autoptimizeにはマイナスの部分もあります。
Autoptimizeのデメリット
- 圧縮によるWordPressサイトの不具合
- プラグインの中では難易度が高いため、初心者には難しい
圧縮系のプラグインは基本的にはプロに任せるのが一番良いです。
というのも、不具合が生じた時に、プロであれば対応できますが初心者だと何をすればよいかわからなくなるはずです。
そのため、当サイトでは「WordPressをある程度知っている方に圧縮系のプラグイン」をおすすめしております。
ここまでを読み、Autoptimizeに挑戦したいと思った方は設定方法→使い方について学んでみてください。
Autoptimizeの初期設定|3分インストール
Autoptimizeの初期設定は3分で完了します。
画像を参考にインストールしてみてください。
まずは、プラグイン画面へと行き、キーワード部分に【Autoptimize】と入力してみてください。
Autoptimizeと表示されるはずですので、そのままインストール<有効化の順にボタンをクリックしましょう。
この画面がプラグイン一覧ページに表示された方は、Autoptimizeのインストールは完了です。
Autoptimizeの使い方
Autoptimizeの使い方は大きく分けると4つほどあります。
Autoptimizeの使い方
- 使い方1:HTMLを圧縮する
- 使い方2:CSSを圧縮する
- 使い方3:JavaScriptを圧縮する
- 使い方4:画像を圧縮する
使い方1:HTMLを圧縮する
Autoptimizeの使い方1つ目は『HTMLを圧縮する』ことです。
HTMLコメントを維持する必要はないので、その部分のチェックマークは外していても大丈夫です。
使い方2:CSSを圧縮する
Autoptimizeの使い方2つ目は『CSSを圧縮する』ことです。
この点は不具合が生じやすいポイントなので、注意しましょう。
- CSSコードを最適化:必須
- CSSファイルを連結する:必須
→複数ファイルに記述されているCSSを一つにまとめることで、読み込み時間を遅らせる効果がある - インラインのCSSも連結:必須
→HTMLファイルに直接記述されたCSSも圧縮の対象にしましょう。 - データ生成画像をURL化:微妙な部分(私は不要派です)
→画像をURL化にすることで、サーバーへのリクエストが減り理論上は早くなるのですが、実際問題、遅くなったという報告が多いので、あまりおすすめしません。 - CSSのインライン化と遅延:不要
→有料プランとの併用になるので必要なし - すべてのCSSをインライン化:推奨しません
→この設定によるエラーが多すぎる。 - AutoptimizeからCSSを除外:触る必要なし
ぜひ、参考にしてみてください。
使い方3:JavaScriptを圧縮する
Autoptimizeの使い方3つ目は『JavaScriptを圧縮する』ことです。
ここも不具合が生じやすいので注意しましょう
- JavaScriptコードの最適化:必須
- JSファイルを連結する:必須
→JavaScript複数ファイルをひとまとめにしてくれる - インラインのJSも連結:不要
→かなり不具合が生じやすい項目なので、不推奨 - <Head>内へのJavaScriptを強制:不要
→JSを最初に読み込むメリットがないから - try-catch:不要
JavaScriptは最も不具合が生じるので、あまり触らないことをおすすめしています。
使い方4:画像を圧縮する
Autoptimizeの使い方4つ目は『画像を圧縮する』ことです。
正直、ここの項目は不要な気がします。
理由:画像圧縮するツールとしては、微妙。加えて、画像圧縮であれば、もっと良いツールが世の中にはたくさんある。
下記の記事で紹介している内容を行えば、わりと、画像圧縮は問題なしです。
Autoptimizeで不具合が発生した場合
ここでは、Autoptimizeで不具合が生じるケースを紹介しておきます。
- 表示ができない場合
- 画像が表示されない場合
- 変更した点が更新されない場合
表示ができない場合
WordPressサイトの表示がおかしい場合は、AutoptimizeによるJavaScript、もしくはCSSが悪さをしている可能性が高いです。
まずは、JavaScriptのチェック欄をすべて外してみてください。
そのご、WordPressが正常に動けば、問題はJavaScriptにあります。
JavaScriptで解決できない場合は、CSSのチェックボックスをすべて外してみてください。
結果的に、すべてのチェックを外すことになるブロガーが多いはずです。
理由:Autoptimizeは他のプラグインとの相性が悪い、優秀なWordPressテーマとの相性が悪いので、多くのブロガーが使用しにくいプラグインなのです。
画像が表示されない場合
画像が表示されない場合は、AutoptimizeのJavaScriptが悪さをしているので、JavaScriptの項目をすべて外しましょう。
これで、画像問題は解決できるはずです。
変更した点が更新されない場合
Autoptimizeの設定が更新されない場合は、キャッシュクリアを行いましょう。
管理画面の上部分に表示されるAutoptimize→キャッシュを削除をクリックすると、キャッシュがクリアされます。
キャッシュクリア後に、不具合が生じたページは修正されているはずです。
Autoptimizeで不具合が発生→何をしても解決できない場合はプラグインから削除しましょう。
結論を言いますと、Autoptimizeは表示速度を改善するプラグインとして優秀ですが、不具合がかなり生じやすいです。
有料のWordPressテーマは非推奨として毎度取り上げられるプラグインです。
そのため、高い確率で不具合が生じてしまいます。
どんな方法を使っても、不具合が解決できない場合は、そっとAutoptimizeのプラグインを削除しましょう。
表示速度を改善できるプラグインは他にもたくさんあるので、あまり固執しすぎないようにしましょう。
まとめ:プラグインAutoptimizeを実装するとは表示速度アップするかもです。
ここまでで『【最新版】Autoptimizeの設定方法と使い方【圧縮系プラグイン】』の解説は以上です。
Autoptimizeは更新頻度が高めのプラグインなので、使用する場合は情報をおうようにしましょう。
当サイトがどんなWordPressプラグインをしようしているのか興味がある方は下記の記事を参考にしてみてください。
- 【最新版】Google XML Sitemapsの設定方法と使い方
- 【2022年最新版】EWWW Image Optimizerの使い方と設定方法
- WordPressブログの画像を圧縮する方法|プラグインやツール紹介
- WordPressサイトの画像をWebPに変換できるプラグインを紹介
- WP-Optimizeの使い方|データベース自動クリーンアップ
- 「使用していない JavaScriptの削除」プラグインで改善する方法
- Table of Contents Plus(TOC+)の使い方|目次プラグインを設置する方法
- 【最新版】Autoptimizeの設定方法と使い方【圧縮系プラグイン】
- 【最新版】PS Auto Sitemapの使い方・スタイル設定を解説
- 【復元方法】BackWPupの設定方法・使い方を紹介【エラーの対処法】
- WordPressでお問い合わせフォームを設置する方法【自作とプラグイン紹介】
- WordPress掲示板の作り方|bbPressの使い方とカスタマイズ
- 【必要ない】SWELLでおすすめのプラグイン6個を紹介
私の調査では自作サイトにAutoptimizeが効果的でした
あくまで、私の調査なのですが、自分で制作したWordPressサイトにはAutoptimizeがかなり効果的であることが分かりました。
最近の有料WordPressテーマは、最初から圧縮されていることもあり、Autoptimizeによる表示速度の改善はあまり得られないことがわかっています。
Autoptimizeよりも効果的な施策をご紹介
データ的に分かっていることなのですが、ソースコードの圧縮よりも『画像の圧縮&次世代フォーマットの変換』のほうが重要です。
上記の施策はEWWW Image Optimizerを活用することで、簡単に導入できるので、この機会にぜひ導入してみてください。
私は上記のプラグインを活用したことで、スコアが10ほど改善されました。
Autoptimizeに加えて、WordPress高速化を本格的に始めたい方はこちらをどうぞ
Autoptimizeに加えて、本格的にWordPress高速化に取り組みたい方は下記の記事を参考にしてみてください。