ガジェットとWebデザインの備忘録

  1. Google

【無料でできる!】ポートフォリオやブログの表示速度を計ってみよう

なかの(@nkn12104)です。

これからポートフォリオを作る方、またWordPressでブログ作成される方、
特にポートフォリオ作成時は色々とCSSやjs入れてサイトをどのように見せるか、
見た目やコンテンツを充実させていこうとしますよね。

もちろんそれもとても大切なことではございますが、
実際に業務で問われる項目の一つとして、担当しているサイトの表示速度があります。
これはサイトの表示が遅いとユーザーの離脱に繋がるからです。

もちろんポートフォリオでそこまで問われるかといえばそこまで問われないかもしれませんが
仮に面接の際にそうした部分を突っ込まれた場合のカードとしてちゃんと計測、
表示を早くするためにこうしました(画像を軽くするなど)と言えた方が良いので
ポートフォリオが一度できた段階でぜひ実施して欲しいです。

今回はそんなwebサイトを表示スピードを測ることができるサイトを紹介します。

Page Speed Insights(Google)

サイトURLを入力してエンター押すと自動的に計測してくれるGoogle謹製ツール
計測して数値を算出してくれるだけでなく、どこを改善すれば早くなるかも教えてくれるので便利
実際にこんな感じで結果が出ます。

スピードテスト結果
画像にも書いた通り、左上のタブでPCとモバイルの結果を切り替えることができます。

スピードテスト結果
これは自分自身のサイトをスピードテスト

また改善点もしっかりと記載しておりますので
どうしたら早くなるかわかりやすいですね。

スポンサード・リンク

モバイルサイトテストツール(Google)

こちらもGoogle謹製ですが、よりモバイルサイトの計測に特化したものとなります。

ここにURLを入力します。
モバイルスピードテスト

そうするとこんな感じなアニメーションが
またこれが動きが可愛らしくていいですね。
モバイルスピードテスト
モバイルスピードテスト

結果がでました。こんな感じになりました。

ちょっと遅いですね・・・・改善せねば・・・・

詳細レポートはメールでもらえるので(希望の場合は)
とても便利です。

実際にサイトを作ってみるとなかなか目が行き届かない部分ではございますが、
どうやったら早く表示されるか、色々と試しながらコーディングすると実戦でもより生きていきます。
また実際にコーダーではなくとも、ここを改善すればもっと速くなるとか、
分かっていれば担当しているサイトの改善提案もできるので積極的にやってみましょう。

いかがでしたでしょうか、いずれも無料で計測できるので
ポートフォリオ提出前、ブログ作成時に活用してみてください。

スポンサード・リンク

Googleの最近記事

  1. iPad Pro 2018にも使える!GoogleのイヤホンPixel USB-C ear…

  2. GRAMAS Pixel3aケースハイブリッドRibのレビューとPixel3aのケースを調…

  3. Huawei端末からPixel3aに機種変更したので簡易レポート

  4. Google謹製のスマホ、Pixel3aを予約した話

  5. 【無料でできる!】ポートフォリオやブログの表示速度を計ってみよう

関連記事