Google PageSpeed Insights を試す

Google Analytics を設定すると、Google Search Consoleというものがあることを知りました。

ブログのはじめて、いろいろなサイトをみると、

・SEO対策しないといけない。

・Google Search Console で自分のサイトがどう評価されているか分析しないといけない

など、記事をみるようになりました。

どんどん、ブログの内容が、ブログのためになにをするべきかという方向に、沼にはまりつつあるような気がしてきている今日この頃、まぁ、もう少しは深堀してみようかと、知らない世界なので、踏み込んでみます。

まだ、書き始めたばかりなので、自分のアクセスがグラフの数字になっているだけで、ほとんど誰にも見られてない状態なんだろうなぁ。と思い

Analyticsの情報をみると、なぜだかわからないのですが、意外にも日本以外からも見られていることを知りました。

で、色々な国からアクセスされていることは分かったのですが、まぁ、日本語なんで理解はされていないんだろうなぁ。

その次、一度見に来てくれたとしても、ページの描画の時間が長いとすぐに離脱してしまいます。ということです。表示に3秒かかると記事を見ないで抜けてしまうらしいです。

Google SearchConsole は、そんな自分のブログの表示速度を検査することもできます。

モバイル版のページの評価が↓です。

PC版のページの評価が↓です。

テーマをZEROにしてから比較的高い数字がでています。

一応、改善策みたいなのに少し対応したもの結果に出ている気がします。

1. 複数のページリダイレクトの回避
2. レンダリングを妨げるリソースの除外
3. サーバー応答時間の短縮
4. オフスクリーン画像の遅延読み込み
5. 次世代フォーマット画像の

対応した内容

１．ですが、モバイル用に/?m=1  に用意されてるものが複数ページにカウントされているようですが、これは、Bloggerの仕様と思われるので、対応策が無いようです。モバイルにPCの記事を読ませるということもできなくはないと思いますが、見づらくなると思います。

２．これは、*.css というもので、レンダリング処理を邪魔しているものを少なくしましょうというものらしいです。とりあえず、私は、引っかかっていた以下の2つをコメントアウトしました。特にこれがなくても見栄えに変化がなかったからです。

<!--<link href='https://cdnjs.cloudflare.com/ajax/libs/normalize/6.0.0/normalize.min.css' rel='stylesheet'/>-->


 <!--<link href='https://use.fontawesome.com/releases/v5.0.11/css/all.css' rel='stylesheet'/>-->


ただ、Bloggerで呼ばれる以下のものだけは、裏技でコメントアウトできるのですが、これをやると、レイアウトがくずれてしまうので、そのままにしています。

https://www.blogger.com/static/v1/widgets/1171200566-widget_css_mobile_2_bundle.css

３．は自分でサーバーを借りてるわけではないので、カスタマイズはできないと思われます。Bloggerにお任せ。

４．これは、画像を貼りつけた後にHTMLモードで <img の後に alt="" loading="lazy" というオプションを入れるだけで対応できました。すべての画像にやったわけではありませんが、引っかかっていた画像にやっただけでもスコアは改善しました。

５．この次世代フォーマット画像というのが悩ましい。Webp（ウェッピー）いう画像形式にするのが一番よさそうですが、現時点(2020/04/28)でiPhoneやMacのSafariだけが未対応になっていますが、試してところ、普通に見れます。

Chrome,Edgeが対応済みとなっていますが、私の環境では、MacでもiPhoneでもSafariで見れました。もちろん、Chrome、Edgeも問題なく見れます。

ということで、記事に貼る画像は、全Webpに切り替えるということを実験的にやってみたいと思います。どうせ、私の記事を見てくれる人はまだまだ、ほとんどいない状態なので、試しにやってみます。

このブログから全Webp対応します。

参考情報

Google公式ーPageSpeed Insights
https://developers.google.com/speed/pagespeed/insights/