読者です 読者をやめる 読者になる 読者になる

Netablog

デザインしたりとWebマーケティングしたりするときにネタになることまとめているネタブログです。

【Google Chrome プラグイン】サイズ計測プラグイン《PageRuler》

f:id:nekonkeo:20150411232117j:plain

 

WEB制作には欠かせない、ホームページに使われている画像のサイズやコンテンツのサイズを計測するプラグイン。
そりゃぁ、正確にサイズを測りたいときは、Firebug等でCSS要素を取り調べしますが、「このサイトのコンテンツ幅、どれくらいかなぁ〜」って、だいたいのサイズ知りたいときは、ちゃちゃっと測りたいですね。

そんなとき、わたくしは、「PageRuler」というGoogleChromeプラグインをつかっております。



PageRulerでサイズを測る

GoogleChromeのプラグインバーのPageRulerボタンをクリックしてアクティブにします。

f:id:nekonkeo:20150411232235j:plain


するとマウスカーソルが十字に変化して、ヘッダーに情報欄が出現します。

f:id:nekonkeo:20150411232329j:plain




サイズを測りたい範囲に、十字カーソルをドラッグします。左上からだろうと右上からだろうと測れます。

f:id:nekonkeo:20150411232247j:plain

 

Yahooトップページの広告枠は、横幅350px、縦幅240pxとわかります!



ガイドの色はデフォルトでは青ですが、ピンクが好きな人はピンクにも変更できます。

f:id:nekonkeo:20150411232412j:plain


情報表示のデザインも控えめだし、計測する箇所をオーバーレイで色表示してくれるから、計測してる箇所がわかりやすいのがいい感じです。