Googleスピードアップデート?表示速度チェック&改善してみた

Pocket

 

2018 年 7 月より、Webサイトページの読み込み速度をモバイル検索のランキング要素として使用する。

▶︎ページの読み込み速度をモバイル検索のランキング要素に使用します|ウェブマスター向け公式ブログ

というGoogleのお知らせがありましたね。

すでに対策してる方も多いかとも思うし、大きなダメージはなさそうなので放置!って方も多いでしょう。

で、私もとりあえず放置しようと思っていたのですが、スピードチェックしたら結構遅い!?笑ってことになっていて、、、、

改善・対策に時間かける気はないのですが、せめて表示速度は普通くらいにはしといた方がいいかなと思ったというか、確かに結構遅くてイラっとするので笑

ちょっとだけ修正してみまました。

同じような方の参考になればと思いますので一応さらりと備忘録しておきます。

Gスピードアップデート

〜〜項目〜〜〜〜〜〜〜〜〜〜〜〜〜〜

♥1、まずはサイト表示速度チェック

♥2、改善できるポイントをチェック&実行

♥3、 結果

♥4、完全は無理w

〜〜〜〜〜〜〜〜〜

スポンサーリンク

 

♥1、まずはサイト表示速度チェック

サイト表示速度チェックは、developers.google.comでできる

▶︎PageSpeed Insights|developers.google.com

サイトページのURLを入力して分析を押すだけw

うちのサイトはPC表示が赤でモバイルが黄色でした、、、

中には真っ赤っかな手持ちサイトもありました笑

モバイルMedium,パソコン赤

 

スピードチェックLOW

ちょっと残念な結果ですねぃ笑

体感速度としてはわりと遅い?くらいな感じでほんのりイラっとしました笑

 

♥2、改善できるポイントをチェック&実行

どこを改善すればいいかもこの PageSpeed Insights |developers.google.com での分析結果に出ています。

問題が多い順に記載されるそうです。このログサイトでは、

  1. 、画像を最適化する。
  2. サーバーの応答時間を短縮する。
  3. ブラウザのキャッシュを活用する。
  4. スクロールせずに見えるコンテンツのレンダリングをブロックしてるJavaScript/CSSを排除する

などを指摘されました。

他のサイトでは

  1. サーバーの応答時間を短縮する。
  2. スクロールせずに見えるコンテンツのレンダリングをブロックしてるJavaScript/CSSを排除する
  3. 表示可能コンテンツの優先順位を決定する。
  4. ブラウザのキャッシュを活用する。

などなどでした。。。。。。。。。

で、ふと、

  • サーバーの応答時間を短縮する!?ってこれ自分に関係ないのでは?と思ったのですが……..

さらに修正方法を表示してみると。。。


なんだか色々な理由があるっぽい。。。。。。。

ふと調べてみましたら、そういえばPHPバージョンアップできるのにしてなかったかも!?って思い、サーバーをチェックしてみたら、案の定最新にはしてなかった…..

なのでまずはPHPバージョンの変更、アップデートをしてみました。

私はエックスサーバーさくらサーバです。

PHPのバージョンアップは、すぐにできますが、状況によっては不具合が起こる可能性もあるようなので、どうでも良い実験サイトで試しながらビクビクしながらやってもましたが大丈夫でした笑

やる方はバックアップをとり、それぞれのサーバーで推奨されているか自分はその対象になってるかなどしっかり確認してからやった方がいいでしょう。

エックスサーバーは、サーバーパネルで対象ドメインを選択してドメインごとにできます。

 

さくらサーバはサーバパネル>アプリケーション設定>PHPのバージョン選択で一気にします。
さくらサーバも対象になってるか、推奨になってるか、自分はできる環境かなどしっかりチェックしてやった方がいいですね。

で、

とりあえあず私はPHPバージョンが5.6とかだったので 7.1 にしてみました。

 

スポンサーリンク

 

あと、レンダリングをブロックしてるJavaScript/CSSを排除するとか、優先順位を決定するとか、キャッシュ系はとりあえず無視して笑

画像の圧縮をし直してみました。

画像も、重くて改善の余地が大きいものから記載されてるので(developers.google.comで分析した結果の修正方法を開くと画像のURLが表示されてるので、ワードプレスならメディアアップロードページなどに行ってそのURLを検索するとどれかすぐわかります)順に圧縮し直してみました。

ヘッダーロゴや、ヘッダー画像、背景画像、サイドバーのバナー画像、フッターのバナー画像など、毎回表示されるであろう枠組みにある画像が記載されていたので、全部圧縮し直してみました。

できれば100KB以下にしたいところです。

画像の圧縮は、画像のサイズをリサイズするだけではそんなに軽くなりません

なので、文字通り”圧縮”します(COMPかけますW)

 

サイトの表示速度を上げるには?的なことは以前このログサイトでも書いています↓

ブログサイトの表示速度を上げる方法

上記のページに画像の圧縮方法を書いてますので参照ください。

一番圧縮できるのは

▶︎Media4x-CompressJPEG,PNG,PDF,CSS (http://optimizilla.com)

で、しかもそんなに見た目劣化しないで優秀です。

 

♥3、 結果

上記のことを一通りした後、もう一度速度チェックしてみましたら、

エックスサーバーのサイトは改善されました、、、、、↓

before↓モバイルMedium,パソコン赤

 

after↓

この改善されたサイトはPHPバージョンアップと、画像の最適化のみで改善されました。

めでたし めでたし……….

 

んが、さくらサーバの方は。。。。改善されませんでした!笑

これってかなりサーバー側の問題や、サイトとサーバーの相性の問題なんじゃないかな?って感じました。

だってエックスサーバーのサイトは全部それで改善されたけど、さくらサーバのサイトは全サイト改善されなかったんだもん笑

多分

  1. スクロールせずに見えるコンテンツのレンダリングをブロックしてるJavaScript/CSSを排除する
  2. 表示可能コンテンツの優先順位を決定する。
  3. ブラウザのキャッシュを活用する。

などが必要なんだと思う。。。。。。。。。。。。。。。。。。。

 

♥4、完全は無理w

で、今回のGoogleスピードアップデートは上記でも言ったようにちょっと遅いくらいじゃそんなに支障はないのでは?と言われてもいるのでこの改善に時間を使うのは勿体無い気がします、、

つまり、出来うる限りやって少し改善させてみてそれでも超遅い?本気でキレそうなくらい表示されないじゃ無いか!って場合以外は追求しないことにしました笑

どっちみち100%に改善するのは無理でしょうし…..

ただ、画像の最適化(特にヘッダー、背景、サイドバー、フッターなど常に表示する枠組み部分の画像)と、PHPバージョンを推奨のバージョンにアプデするなどはすぐにできることなので、その辺りどうかはチェックしたいところだと思う。

以上現場からお伝えいたしました。。。。。。

 

ってことで楽しいクリエイトをば!

しゃらんるうわあぁああああ♥

『なぜあなたの仕事は終わらないのか』読んだ?

 

\(`^`)b

スポンサーリンク

 

REACH_rh.jam project / Creative Support
REACH_rhがあなたのクリエイトをサポートします
サポート内容をチェックしてみる ↓

rhjampj_v-min

 

❤色々やり散らかしております、宜しくどうぞ御贔屓に<(_ _)><(_ _)><(_ _)>

Twitter-REACH_rh Facebook-REACH_rh G+ -REACH_rh Insta-REACH_rh note-REACH_rh

YouTube-REACH_rh SoundCloud-REACH_rh PIXIV-REACH_rh CREATORS BANK_REACH_rh

 

関連コンテンツ

Pocket

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

2 × four =