The following two tabs change content below.
粕尾 英行 (かすお ひでゆき)
1986年7月生まれ長野育ち。 よく飲みよく食べ、サッカー、麻雀、ゴルフが好きな30歳。 東京で10年働いて地元長野に帰ってきたら、長野がすごく良いところだ!となって長野紹介ブログ「ILove長野」を始めました。 長野の方のためのブログを活用した集客コンサル・イベント主催もやってます。

こんにちわ!

ひでゆきです^^(dehichan0728)

 

今日はブログやウェブサイトを運営している誰もが気になるサイトの高速化に役立つプラグインを紹介します!!

 

 

その前にPageSpeed Insightsを紹介しよう

私が、サイトの高速化を気にしたきっかけを話してみます。

 

短くいくから読んでなー!笑

 

先日ネットサーフィンしているときに、サイトの表示速度を計測するサイトを見つけたのでやってみました!

PageSpeed Insights

Googleさんが提供しているサイトのダメ出しをしてくれるサイトです。笑

  • PageSpeed Insights について

    PageSpeed Insights は、ウェブページのコンテンツを解析し、ページの読み込み時間を短くするための方法を提案します。詳細

 

スクリーンショット (405)

 

 

ん、なんか真っ赤で60点…

合格点じゃなさそうなので、調べてHead Cleanerなどの高速化プラグインを導入することにしたんです。

スクリーンショット (366)

 

さて、どうなることでしょう!

 

 

WordPressプラグイン「Head Cleaner」とは

Head Cleaner とは、WordPressのソース(サイトを表示させる為のファイル)を最適化し、サイトの表示速度を高速化してくれるプラグインです。

 

特にCSSとJavaScriptをいう容量の大きいソースを整理してくれます!

 

CSS:ブログやウェブサイトのデザインやレイアウトについて

JavaScript:ブログやウェブサイトに動きをつけたりとかについて

 

自分でCSSやJavaScriptをいじって高速化するのは難しいことです、少なくとも私には…

WordPressプラグインのHead Cleanerがやってくれるので使わない手はないです!

 

では、サイトを高速化することでどんな良いことがあるのでしょうか。

 

 

Head Cleanerで得られる効果

サイト高速化プラグイン「EWWW Image Optimizer」

この記事でも紹介していますが、ブログやウェブサイトの表示速度を上げることで、読者の方とGoogleさんに対しての評価アップを見込めます。

 

読者の方はサイトの表示が早いことで、直帰率を下げることができますし、Googleさんはサイトの表示速度を検索順位に反映しているといっています。

 

このHead Cleanerも同じようにサイトの高速化に協力してくれるWordPressのプラグインなので、併せて使っていきたいですね。

 

Head CleanerをWordPressへインストール

スクリーンショット (314)

 

プラグイン名「Head Cleaner」と入力

スクリーンショット (391)

 

検索するとHead Cleanerが出現しますので、今すぐインストール

plugin-new2

 

有効化しましょう!!

plugin-yuukou

 

Head Cleanerの設定方法

WordPressダッシュボードの設定のHead Cleanerをクリック!

setting-head

 

「CSS と JavaScript を、サーバ上にキャッシュする」をクリック

check

 

項目が追加されます!

スクリーンショット (396)

 

以下の項目にチェックをいれましょう!!

  • 複数の CSS を結合する
  • CSS を最適化する
  • 複数の JavaScript を結合する
  • JavaScript を小さくする
  • フッタ領域の JavaScript も対象にする
  • <head> 内の JavaScript を、フッタ領域に移動
  • Google Ajax Libraries を利用する
  • メタタグ “generator” を削除
  • リンクタグ “RSD” を削除
  • リンクタグ “wlwmanifest” を削除
スクリーンショット (401)

 

以下のフィルタに関しては、不具合等がないのであればチェックは不要です。

他の項目で不具合の時の対処を紹介しています!

nocheck

 

こちらも無視してOK

スクリーンショット (403)

 

すべてチェックできたら更新!!!

head-last

 

キャッシュファイル削除

プラグインやテーマが最新バージョンに更新された場合、Head Cleaner のキャッシュを削除しましょう!!

その場合は、Head Cleaner 設定ページの下部に「削除」ボタンがあるのでクリック。

head-last - コピー

 

他のキャッシュプラグインを使っているのならそちらのキャッシュ削除もやってください。

 

Head Cleanerでの不具合例と対処方法

私がHead Cleanerを使い始めたらいくつかの不具合が発生しました。

その紹介と対処法を書きます!

 

SNSボタンが表示されない

本来はTwitter・Facebook・はてぶ・Google+なんですが、Head Cleanerを使い始めたらFacebookとGoogle+が表示されなくなりました。

スクリーンショット (397)

 

そこで、Head Cleanerの設定の中の「wp_print_head_scripts」というフィルタを設定しました。

スクリーンショット (399)

 

「wp_print_head_scripts」にチェックを入れて更新したことでSNSボタンがすべて表示されました!!

plugin-after

 

ページ上部まで移動するボタンが表示されなくなった

スマホでウェブページを見ているときに、下の方にスクロールしていくと、トップページまで戻るボタンが出現するのだが、それも表示されなくなった。

 

スクリーンショット (400)

 

その問題も「wp_print_head_scripts」にチェックを入れることで解消されました!

 

有効なフィルタのどれをチェックしたらいいかは一概に言えません。

不具合があった時は1つ1つチェックしていってください…

 

 

WordPressプラグイン「Head Cleaner」まとめ

63点になりました。笑

パソコンが79点なんですが詳しいこと調べて対策したら記事にしますね!!

スクリーンショット (407)

 

サイトの内部を最適化することで、読者の方の滞在時間に繋がったり、Googleに評価されたりといいことあり。

 

やらないといけないこと多いなー。

 

では!

5

長野情報をみんなでシェアしよう!泣いて喜びます!!

1 個のコメント

  • WordPress Popular Postsで人気記事を設置しよう。WordPressプラグインで1分で設置できちゃうぞ! | ブログプランナーひでゆき より:

    […] このブログでも紹介しているHead Cleanerというプラグインとぶつかってうまく動かないことがありますが、記事内で紹介している方法で設定してもらえれば動作します。Head Cleanerを使うのであれば、この記事を読んで設定してみてください「Head Cleaner」でページの表示速度を向上させる! […]

  • コメントを残す

    メールアドレスが公開されることはありません。

    ABOUTこの記事をかいた人

    粕尾 英行 (かすお ひでゆき)

    1986年7月生まれ長野育ち。 よく飲みよく食べ、サッカー、麻雀、ゴルフが好きな30歳。 東京で10年働いて地元長野に帰ってきたら、長野がすごく良いところだ!となって長野紹介ブログ「ILove長野」を始めました。 長野の方のためのブログを活用した集客コンサル・イベント主催もやってます。