css等も含めてページのサイズや読み込み時間を測定するPingdom Tools


▽今だからこそ、「軽量なウェブサイト」を作ることが重要、というお話。
 (Feel Like A Fallinstar)
 http://www.fallinstar.org/2009/07/post_76.html



本当に「持ち歩きPC」「スマートフォン」が増えた結果かどうかはともかく、このグラフからもアクセス手段に変化・多様化が生じているのは間違いなさそうです。


一方、いつの間にかページサイズの相場が巨大化しきってますよ。
PCの画面サイズが大きくなって光ファイバが普及したことと関係があるのでしょうか。


ここらへんでちょっと足踏みの必要があります(^_^)



今つくってるサイトも、(私自身が^^;)シンプルに情報を閲覧できるページを作ろうというのが動機です。
htmlはでかいわ、あっちこっちでアニメgifが動きまくりだわ(いつの時代よ?)、必要な情報がどこから手に入るかわかりにくい腐ったナビゲーションだわでうんざりしたので……


では、具体的にどうすればいいでしょうか。


まずは現状を把握することが大事でしょう。
そこで便利なのが、Pingdom Tools


▽Pingdom Tools
 http://tools.pingdom.com/


ここのFull page testを用いれば、そのページから読む画像やCSSJavaScriptも含めたページのサイズ・読込時間を測定してくれます。


会員登録などは不要。
URL欄に知りたいページのURLを入力して「Test now」をクリックするだけです。


結果の表示は、冒頭の写真のようにグラフィカルなので、とてもわかりやすい。
全てのファイルがリストアップされて、タイムラインも表示されます。
ですからファイルサイズに見合うパフォーマンスのないファイルを削除しよう、という動機づけになります。
また、そもそも不要なファイルを発見するのにも役立ちますね。


しかしこうみてみると、やっぱりprototype.jsのファイルサイズがでかい……。
読者にとってメリットのある形では使っていないので、せめて圧縮をかける等して負担を減らさなければいけませんね。


こういう気づきのきっかけになります。まずはお試しを。


このサービスは、冒頭の記事を読んでとりあえず現状把握しなければとぐぐってみたところ、以下の記事を読んで知りました。
ありがとうございます


▽サイトのファイル サイズを可視化してくれるウェブマスターツール(WEBマーケティングブログ)
 http://web-marketing.zako.org/web-tools/html-file-size-check-pingdom-tool.html