Google『PageSpeed Insights』でスマートフォンサイトの読み込み速度を測定;FC2ブログ・プチカスタマイズ   

Google『PageSpeed Insights』でスマートフォンサイトの読み込み速度を測定|FC2ブログ・プチカスタマイズ

  このページはFC2ブログ・プチカスタマイズの Google『PageSpeed Insights』でスマートフォンサイトの読み込み速度を測定 に関する情報を紹介しています。
  FC2ブログ・プチカスタマイズは、FC2ブログをちょっとだけ改造して、使い易くします。  FC2ブログの魅力は、初心者は初心者なりに、上級者は上級者なりにテンプレートやスタイルシートを改造して色々と変えることができるところ。 このブログでは、初心者から中級者向けのFC2ブログカスタマイズ法をあれこれご紹介。  FC2ブログを楽しみましょう。

 


 
 
Top Page > スポンサー広告 > Google『PageSpeed Insights』でスマートフォンサイトの読み込み速度を測定・FC2ブログでスマートフォン用サイトを作ろう > Google『PageSpeed Insights』でスマートフォンサイトの読み込み速度を測定


上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。




web拍手 by FC2←これはFC2拍手。お礼のコメントがあるよ。拍手してみて。 FC2 Blog Ranking

このエントリーをはてなブックマークに追加

 ブログの読み込み速度を測定してみよう。

 ブログやサイトの読み込み時間は、訪問者数に影響するそうだ。

 読み込み速度が遅いと、サイトの訪問者がサイトを見ずにほかのサイトへ写ってしまうことがある。

 特にスマートフォン用のサイトの場合、パソコンよりスペックが劣るため、読み込み速度の速さが大きく影響を受けるとか。

 気になるサイト・ブログの読み込み速度、簡単に測定する方法がある。

 それが、Google『PageSpeed Insights』。

 Google『PageSpeed Insights』では読み込み速度の測定とともに改善点も提示してくれる。

 

Google『PageSpeed Insights』でブログ・サイトの読み込み時間を測定してみよう

1、『PageSpeed Insights』をクリック。

2、検索ボックスに対象サイトのURLを入力。

3、『分析』ボタンを押す。

 

 スマートフォンサイトとPCサイトの表示速度の分析結果が出て来る。

 Google『PageSpeed Insights』のスコアは100点が満点。

 点数が低いほど、サイトやブログの読み込み時間が遅く、改善が必要となる。

 ただし、その時々にちょっとスコアが変わることはある。

 

タブの色とスコアによって、表示速度に問題があるかどうかがわかる

・タブの色が赤の場合

⇒サイト・ブログの読み込み時間の改善が早急に必要。
⇒スコアは70未満。

 

・タブの色が黄色の場合

⇒サイトブログの改善をしたほうが良いレベル。
⇒スコアは70以上80未満。

 

・タブの色が緑

⇒スコア80以上。
⇒サイト・ブログの表示速度はそれほど問題の無いレベル。

 

Google『PageSpeed Insights』でブログ・サイトの読み込み時間を遅くしている問題を分析しよう

 Google『PageSpeed Insights』でブログサイトの分析をすると、ブログ・サイトの読み込み時間を遅くしている原因を分析できる。

 

!マークが赤の場合

 すぐにでも改善したほうがいい部分が赤い!マークの下に表示される。

 大抵は、『スクロールせずに見えるコンテンツのレンダリングブロック JavaScript/CSS を排除する』という項目になる場合が多い。

 詳細を表示をクリックすると『このページには、ブロッキング リソースが○個 あります。これが原因で、ページのレンダリングに遅延が発生しています。 このページでスクロールせずに見えるコンテンツを、以下のリソースによる読み込みを待たずにレンダリングできませんでした。ブロッキング リソースを遅延させるか、非同期に読み込むか、これらのリソースの重要部分を HTML 内に直接インライン化してください。』というメッセージとともに、問題があるJavaScript/CSS が表示される。

 

!マークが黄色の場合

 修正すると、ブログ・サイトの読み込み時間が早くなる部分が表示される。

 出て来る項目は、

・ブラウザのキャッシュを活用する
・圧縮を有効にする
・HTML を縮小する
・サーバーの応答時間を短縮する
・CSS を縮小する
・JavaScript を縮小する
・画像を最適化する

 などの項目。

 

緑色のチェックマーク

 サイト・ブログの表示速度を早くする基準に合格している部分。

 

 黄色や赤の!が表示された部分を改善するとサイトの読み込み時間が早くなる。

 手をつけやすい、CSSの縮小・HTML の縮小・JavaScriptのインライン化・JavaScript の縮小から手をつけていくと良いと思う

 

 このブログの場合、JavaScriptのインライン化・CSSの縮小・HTML の縮小でスマートフォンサイトの表示速度スコアが64から74へ改善した。



サイト内の同タグへのリンク: スマートフォン  テンプレート  スタイルシート  表示速度 
他のサイトへのタグリンク : スマートフォン テンプレート スタイルシート 表示速度

web拍手 by FC2←これはFC2拍手。お礼のコメントがあるよ。拍手してみて。 FC2 Blog Ranking
このエントリーをはてなブックマークに追加
関連記事リスト
  カテゴリ名:[・FC2ブログでスマートフォン用サイトを作ろう]
コメント
この記事へのコメント
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
トラックバック
この記事のトラックバックURL
http://tadameru2.blog91.fc2.com/tb.php/162-76a91100
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。