ウェブサイトや記事(コンテンツ)の表示速度が遅いのは致命的な問題です。
そこで今回はコードを圧縮して表示速度改善に期待できるプラグイン「Autoptimize」をご紹介していきます。
こんにちは。WordPressテーマ研究家SHINです。
表示速度が遅くなると、基本的に以下3つのデメリットが生じる恐れがあります。
表示速度低下によるデメリット
訪問ユーザーの回遊率低下・滞在時間低下・離脱率上昇
ユーザビリティ低下によるSEO評価低下
検索結果順位の下降(ウェブサイト・コンテンツ)
そこで表示速度が遅くなる主な要因は以下4つ。
表示速度が遅い原因
記事(コンテンツ)で画像・GIF・アニメーション・スライドショーが多い。
インストールしているプラグイン数が多い。
ウェブサイトに対してサーバパフォーマンスが衰えている。
コード(HTML・CSS・Javascript)の量が多い。
今回ご紹介する「Autoptimize」は、コード(HTML・CSS・Javascript)を圧縮して最適化してくれるWordPressプラグイン。表示速度が遅くなる原因の一つを改善してくれる非常に頼りになるツールです。
ただコード圧縮するだけではなく、他にも表示速度を最適化する機能があります。
ウェブサイトや記事(コンテンツ)の状態によって劇的に改善する期待があるので、ぜひ使っていきましょう。
では詳しく使い方と設定方法を解説していきます。
Autoptimize表示速度改善機能
WordPressプラグイン「Autoptimize」では、ザックリ以下4つの最適化機能があります。
Autoptimize最適化機能
HTMLコードを圧縮最適化
CSSコードを圧縮最適化
Javascriptを圧縮最適化
画像を「遅延読み込み」する
各機能全てチェックを入れるだけの設定で稼働するので、非常に簡単で効率的に表示速度を改善できます。
Autoptimizeインストール方法
step
1WordPressダッシュボードから「プラグイン」>「新規追加」で『Autoptimize』と検索してインストール~有効化しましょう。

Autoptimize使用上の注意点
Autoptimizeをインストールして設定に入る前に、以下2点は注意しておきましょう。
まずはバックアップ!
Autoptimizeは、コード(JavaScript・CSS・HTML)を圧縮最適化するプラグインですので、画像・レイアウト・デザイン・ショートコードタグなど型崩れやエラーを生じる可能性がゼロではないということです。
ですので、まずは「バックアップを取る」ことをおすすめします。
参考記事WordPressでバックアップを取る4つの方法(初心者向け)
一部プルダウンリンクが開かなくなる?
ヘッダー周辺に「グローバルメニュー」という下層ページを表示するプルダウン式メニューを設置している場合、またはサイドバーにもカテゴリ一覧を表示して、その下層ページを表示しているケースもあります。
その「下層ページが開かない!」場合があるというトラブル・・・。
もし発生した場合の解決策は、「JavaScript設定」にあります。

JavaScriptオプションの<head> 内へ JavaScript を強制という項目のチェックを外す。
デフォルトでは外れているので、チェックを入れていなければ問題ありません。
Autoptimize設定方法
ではさっそくAutoptimizeの設定画面を開きましょう。
JavaScriptオプション


二つ目のチェックは、リンクされたすべてのJSファイルを集約して圧縮最適化するので、チェックを入れておきます。
残りのチェックはデフォルトのままで大丈夫です。
CSSオプション


二つ目のチェックは、リンクされたすべてのCSSファイルを集約して圧縮最適化。
三つ目のチェックは、HTMLコード内にあるCSSコードを連結させる機能。これら全てチェックしておき、以外の設定はデフォルトの通りで大丈夫です。
HTMLオプション


Images


追加


また絵文字を削除もチェックを入れます。絵文字は使いません・・よね?
以上でAutoptimizeの機能設定は完了です。
「さらに最適化」「critical css」は、プラグインAutoptimizeをパワーアップさせる有料オプションを紹介されていますが、僕は正直そこまで費用対効果は見込めないと判断しているので、全てスルーしています。
まとめ
今回はコード圧縮による最適化で表示速度を改善するプラグイン「Autoptimize」をご紹介しました。
ps
プラグインに頼る前に、記事(コンテンツ)は必要最低限のコード記述に心がけたり、「カスタムCSS」への追加記述を注意することも必要です。
特にカスタマイズ系のコードは、大量のコード記述になることが多いので要注意ですね。
最後に。WordPressで作業が終了したら「キャッシュ削除」をしておくのを忘れずに行っておきましょう。