モバイル対策・Pagespeed Insightsでスコア85点を出すために
グーグルはスコアラインは85点だよ!というの知って、今日やっと改善点が理解できたました、嬉しい。
そして忘備録とWebサイト運営の初心者さんにむけてPagespeed Insightsのことについてを書きます。
表示スピードの改善、スコアアップできなくて悩んでいました。
Webサイト運営日記(サイトの改善)其の二でモバイル対策「読者や訪問者に見易さを十分に考慮するためにしたこと」素人なりに改善した内容は以下の通りです。
- Webサイトのページ速度を改善、画像圧縮と最適化
- ページ速度改善のためのプラウザキャッシュする.htaccess作成
- CSSの縮小
そして本日スコア85点だしたのは、indexページのhtml内で「jQuery.min.js (JavaScript用ライブラリ)の位置を変えた」ことです。
jQuery.min.js を head 内に書くとレンダリングブロックを起こす(読み込みの順序があって)からjQuery.min.js を読むことのを後にしてという警告でスコアアップができなかったんです。
そこで、ググって色々と調べてみたら、こういう記事を発見しました。
- たった1つの手続きでPagespeed Insights 18ポイントアップ(2017年10月現在リンク切れ)
この記事の内容をみて、半信半疑でしたが、やってみたら85点となりました。記事は去年のもだったし、jQuery.min.js の位置を変えることで何かおおごとになったら?とも思いましたが
色々確認したところ、表示は崩れてない、体感的にも0.23秒ほどモバイルの表示が早くなったような気がします。
スコアアップ・90点だすには・・・
頑張れば、90点だせます・・・が、各SNSボタンやサイト内の検索窓、アナリティクスコードを削除したら90点なりました。
そう、みなさん、無理ですよね。Pagespeed Insightsで高得点だすのって~(泣)でもPCよりもモバイルで見ている人がだんとつに多いから、悩ましいモバイル対策め!
こんなに一生懸命やってもGoogleでのモバイルスピード改善なので、よその検索サイトのbingはどうかわかりませんよね~。結局、読む込みが遅くなる原因ってWebサイト運営上必要なコードばかりなんです。
本日は85点スコアでホッとしたのでWebサイト改善は少し休憩します。「jQuery.min.js (JavaScript用ライブラリ)の位置を変えた」この方法で本当に良かったかどうか、またこれから様子をていきます。
モバイルご使用のかたでwebサイトの表示がおかしいよ~と気づいたかたは、ぜひお知らせください。