IT関連

PageSpeed Insights

投稿日:2020年1月7日 更新日:

Googleが提供するホームページの読み込み速度をスコアで表示するサイト、「PageSpeed Insights」というのがあります。

※詳細は、「PageSpeed Insights」こちらをお読み下さい。

昔とは違い、最近のGoogleの検索順位を決めるのは、ホームページを読み込むスピードも重視されています。

そのため、「PageSpeed Insights」でのスコアはかなり重要になります。

前回、SEO対策というブログを投稿しましたが、この時にはこの「PageSpeed Insights」については触れていませんでした。

前回のランキングでは、「ドライアイス洗浄機」のキーワードでは5~7位におり、その後はだいたい7~8位辺りにいましたが、最近は18~20位辺りと低迷しています。

その時の「PageSpeed Insights」のスコアは、パソコンで70台後半くらいでしたが、最近は、50台中~後半まで落ちていました。

モバイルでのスコアは最初から悪く、20台前後でした。

そこで、今回はホームページをいろいろといじくり回し、修正を加え、パソコンでは、ほぼ満点に近い、99点となりました。

PageSpeed Insightsスコア

PageSpeed Insightsスコア

モバイルでのスコアは68点でした。

PageSpeed Insightsモバイルスコア

PageSpeed Insightsモバイルスコア

モバイルの方が低いですが、もともと20台前後でしたので、かなりの飛躍です。スコアが低い理由は分かっているのですが、今の知識ではそれを改善するのは困難なため、今回はこれで諦めました。

合格した検査と言う項目があるのですが、パソコン版では、13個から19個、モバイルでは、最初がいくつか忘れましたが、16個になりました。

自分の記録のために方法を残しておこうと思います。もし、まねする方は自己責任でお願い致します。また、どのサイトからなのかが分からなくなってしまったので、やった方法だけ記載しておきます。

特に効果が高かったのが、「第三者コードの利用 」の修正でした。

これには、「Google/Doubleclick Ads」と表記があり、これは、Googleが提供しているホームページでよくみる広告のことです。弊社でも、これを使用していますが、これがページを読み込む際、かなり邪魔をしています。正直、広告収入などほとんど無いので要らないのですが・・・

まず、ホームページに埋め込んだアドセンス広告のコードの

<script async=”” src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>

部分を削除します。埋め込んだ広告の全て削除します。

次に、WordPressのテーマフッター (footer.php)の最後の行にある</body>のすぐ上に下記コードをコピペします。

<script>
//<![CDATA[
//lazy load ads
var lazyloadads = false;
window.addEventListener(“scroll”, function() {
if ((document.documentElement.scrollTop != 0 && lazyloadads === false) || (document.body.scrollTop != 0 && lazyloadads === false)) {

(function() {
var ad = document.createElement(‘script’);
ad.type = ‘text/javascript’;
ad.async = true;
ad.src = ‘https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js’;
var sc = document.getElementsByTagName(‘script’)[0];
sc.parentNode.insertBefore(ad, sc);
})();

lazyloadads = true;
}
}, true)
//]]>
</script>

これで、かなりスコアが伸びました。

上記とは、別のコマンドがあるのですが、それをすると、弊社のホームページでは、不具合が発生し、ホームページ上で、コマンドが表示されたり、広告が表示されなかったりしたので、かなり苦労しました。いろいろ試しましたが、上記のコマンドが一番良かったです。

その他には、何の項目か分からないのですが、遅延設定も入れています。

テーマのための関数 (functions.php)に、下記コマンドをコピペします。

if ( !(is_admin() ) ) {
function replace_scripttag ( $tag ) {
if ( !preg_match( ‘/defer/’, $tag ) ) {
return str_replace( “type=’text/javascript'”, ‘async’, $tag );
}
return $tag;
}
add_filter( ‘script_loader_tag’, ‘replace_scripttag’ );
}

これでなにかの項目若干改善されました。何かです(笑)

※ブログを書いている途中に発見しましたが、上記は、下記の「レンダリングを妨げるリソースの除外 」の項目を改善するために行ったものでした。必要ないかもしれません。

もともと入れていましたが、「Autoptimize」の設定を再度見直しました。

ネットでは、「Autoptimize」の設定だけでもスコアが上昇するとありますが、設定を変えても、もともと入れてあるのであまり変化は見られませんでした。

すると、「Async JavaScript」というプラグインがあり、これを入れました。この「Async JavaScript」というのは、「Autoptimize」と互換性があるので、一緒にいれても問題がありません。

これを入れた事により、「レンダリングを妨げるリソースの除外 」が改善されました。

書くと、これだけの事ですが、調べるのが大変で、かなり時間は掛かっています(^^;)

あとは、動画の表示を止めて、画像にしました。

動画の埋め込みはよくないのは分かっていたので、これをするだけでもスコアは改善されていましたが、上記の方法で99点になったのはよかったです。

また、海外サイトですが、「GTmetrix 」と言うサイトがあります。こちらのサイトも、表示速度や、改善点を教えてくれるサイトです。

こちらでの成績は、

GTmetrix

GTmetrix

「A」と「C」になりました。前回は、左が「C」右が「E」と酷いものでしたが、まずまずのスコアです。

まだ、ロボットが巡回に来ておらず、ページの検索順位が出ていませんが、これで順位が上がることと思います・・・多分。

-IT関連

     

関連記事

謎のエラー

ブログの投稿ページで、3つのページにエラーが出ます。 価格とエアーコンプレッサーについて 高圧洗浄機 VS ドライアイス洗浄機(WW-100) WW-200製品仕様 この3つのブログにAMPエラーが発 …

SEO対策

ホームページを作るだけの事は最近では簡単になりました。特にWordPressが出来てからは更に簡単にホームページを作れるようになりました。 ホームページを作るのは簡単ですが、作ったホームページを多くの …

Top