JavaScriptとCSSを縮小してサイトの表示速度をあげる!プラグイン「Autoptimize」設定方法

こんにちは!!

サイトの表示速度を上げるため、いろいろ実践中のアラサー女子です(*^^*)

前回までに実践したのはこちらの2つ。

Simplicityとロリポップ!ど素人でも出来たコピペでカンタンにサイト表示を高速化する方法が神
前回、ページの読み込みが遅くなったという記事を書きました。 最適化案の中に、「ブラウザのキャッシュを活用する」という項目があり、方...
ロリポップのPHPを最新にしてサーバーの応答時間を短縮する方法
以前、こちらの記事を書きました。 今回は、「サーバーの応答時間を短縮する」ために、使用中のサーバーロリポップのPHPを最新バージョ...

今回は、PageSpeed Insightsで指摘のあったこの項目を改善するため、

JavaScriptとCSSを縮小してくれるプラグイン「Autoptimize」を入れてみました。



プラグイン「Autoptimize」設定方法

インストールして有効化したら、「設定」をクリック。

「高度な設定を表示」をクリックし、設定していきましょう。

設定にあたり、参考にさせていただいたサイトさんはこちら。

どうも!イクミヤです! Autoptimize(オートオプティマイズ)はHTML,CSS,JavaScriptを最適化してウェブサイトの高速化の手助けをしてくれるプラグインです。 サイトスピードは1秒遅くなるだけで、ページビューが11%下がる、カスタマー満足度が16%下がる、コンバージョン率が7%下がるという結果が出て...
『Autoptimize』は、HTML CSS JavaScriptを縮小して高速化できるプラグインです。 診断ツールで、HTMLやCSSを縮小した方が良いと判定されたら、導入を検討しましょう。 今回は、『Autoptimize』の設定方法と使い方をまとめました。
WordPressでページの表示速度を早くしたいなら、Autoptimizeというプラグインを使ってみましょう。HTML、CSS、JavaScriptの圧縮が簡単にできます。今回はその使い方をどこよりも詳しく解説しました。

丁寧に解説されていて、わかりやすかったです(*^^*)

どうもありがとうございました。

HTMLオプション

ここにチェックを入れると、余分な空白や改行を削除してくれます。

二段目の「コメントを残す」は特に要望がなければチェック不要です。

JavaScriptオプション

ここは、チェックを入れたことによりサイト表示が崩れる可能性がある箇所なので、慎重に。

崩れたらチェックを外せば良いだけなので、試してみるのは良いでしょう。

わたしはビビりな性格なので、ひとまず一番上にだけチェックし、あとはいじってません(^^;

CSSオプション

こちらも、上記同様サイト表示が崩れる可能性がある箇所です。

わたしは、2項目だけチェックし、あとはいじってません。

CDNオプション

何もいじってません。

キャッシュ情報

チェック箇所はないのでそのまま。

その他オプション

こちらは、デフォルトのままチェックをしたままに設定。

不具合が出たら、外します。

「変更を保存してキャッシュを削除」をクリックして、設定は完了です。

効果のほどは?

実践後、PageSpeed Insightsで調べてみたところ、「適用済みの最適化」にCSSの項目が増えていました。

JavaScriptの項目は残ったままでしたが、「修正方法を表示」したところ、指摘されていたのは張っている広告のリソース2件のみに減っていました。

なので、効果があったと言えるでしょう(*^^*)

また、モバイル表示でのページ表示速度を調べてみたところ、実践前は5秒だったのに対し、

4秒に。

たった1秒と思われるかもしれませんが、1秒上がっただけでサイト閲覧者の離脱率はグッと下がると言われているので、良かったです(*^^*)

今後も、いろいろ実践して、サイトのページ表示速度向上に向けて頑張りたいと思います!!!

JavaScriptとCSSを縮小してサイトの表示速度をあげる!プラグイン「Autoptimize」設定方法
この記事をお届けした
ポントピの最新ニュース情報を、
いいねしてチェックしよう!
スポンサーリンク







役に立ったらからシェア♪

気になるからフォロー♪

関連記事



トップへ戻る