Webサイトの読み込みスピードをチェックできるサービスを2つご紹介

Webサイトを作ったときにGoogleでいかに上位に表示されるか、ということが気になる思います。Webページの表示をする際の速度が遅いとその表示順位にも影響があると言われています。
ということで、実際に自分のWebサイトがどのぐらいのスピードなのか、ということを測ってみたいと思いました。今回はWebサイトの表示スピードが測れるサービスを2つご紹介します。

Googleの PageSpeed Insights

Googleにページスピードチェックをするサービス、PageSpeed Insights があります。

PageSpeed Insights

こちらのページです。

ページスピードをチェックしたいサイトのURLを入力して 分析 をクリック

少し待ちます

結果が出て、読み込みが遅いと判断されると赤(>_<)!の表示になります。モバイルが44/100と出ています。

点数を表示するだけでなく、

こんな感じに修正方法も教えてくれるので、これに従って直せばスピードは速くなりそうです。

PC版も

このように赤(>_<)、でした。画像をなんとかすれば速くなりますかねー。

へこむので、じゃぁYahooさんは?と見てみます。

モバイルが赤!PCが黄色でした。まぁ大きな会社でもこうなんだから自分も粛々と頑張ろう…と励みになります。。

文章で遅いのか、速いのかを文章で教えてくれて、どの部分で時間がかかってるかがわかるツール

インターネットで検索をしていてよく参考にさせてもらっている「Web担のなかの人」の記事に、

【これは便利】あなたのWebサイト表示のどこが遅いかを一発で調べるブックマークレット

というものがありました。こちらはブックマークレットを使う方法のものだったので、設定して試しました。

ブックマークレットを設定する

FirefoxとIE11の場合はブックマークレットを右クリックして直接ブックマーク(お気に入り)に保存します。

Firefox

ページ表示のどこに時間がかかったかチェック というリンクを右クリックして、このリンクをブックマーク をクリック

ブックマークレットのブックマークができました。

IE11

ページ表示のどこに時間がかかったかチェック というリンクを右クリックして、お気に入りに追加 をクリック

ブックマークレットのブックマークができました。

Chromeの場合

Chromeの場合は右クリックしてブックマークに追加できないのでURLをコピーしておいて手動でブックマークを追加します。

ページ表示のどこに時間がかかったかチェック というリンクを右クリックして、リンクのアドレスをコピー をクリック

URL欄の右にある、星マークをクリック

ポップアップした画面で、編集 をクリック

このように表示されます。

URL:に、先ほど右クリックしてコピーしたブックマークレットのURLを貼り付けて、保存 をクリック

ブックマークレットのブックマークができました。

Edgeの場合

Edgeでブックマークレットを使うのは一筋縄ではいかないようでした。

[Windows 10]Microsoft Edgeでブックマークレットを使う。

こちらのサイトの方法を使うとできるようです。しかし、面倒くさいですね(^_^;。どうしてもEdgeでなければ!という場合でなければ速度を見るためには別のブラウザを使った方がいいかもしれません。

速度を測ってどこが重いのかを見てみる

速度の測り方はとても簡単です。



速度を測りたいページを表示
させておいて

先ほど作ったブックマークレットをクリック

するとこんな感じで速度に関する情報が表示されます。またしても、遅いですね と言われてしまいました(>_<)。

このブックマークレットの特徴はどこに時間がかかっているのかを教えてくれるところです。

この部分です。黄色いところが遅い、という判定のものです。このサイトの場合はやはり ブラウザの処理(画像読み込みやスクリプト実行込み) に時間がかかっているようですね。トップページにタイル状に画像を並べていますがアイキャッチではなく、読み込むたびに動的に四角にした画像を使ってるのもいけないのかも。。と修正点がすぐわかるようになっています。

[Amazon sponsored link] seo 関連本
兎本美佳
ブログを見た人がそのままできたらいいなと思って、できるだけ丁寧に書いています。blogに書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/ 無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。

シェアする

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

フォローする

スポンサーリンク
スポンサー広告
トップへ戻る