こんにちは、工藤です。
Webデザインのときに私がよく使うChromeの拡張機能をご紹介したいと思います。
無駄にウィンドウを開いておくことが多いため、ブラウザ上で色々出来るのは本当助かります・・。
Awesome Screenshot
画面スクリーンショットを撮ることができる拡張機能です。
表示している画面や選択した範囲のみのスクリーンショットはもちろんのこと、縦に長いサイトも一気にスクリーンショットしてくれます。
他のWebサイトをなぞって練習させていただくときやこのブログを書くときにも大変重宝しています。
個人的にですが色々スクリーンショット系の機能を使わせていただいてこれが一番使いやすいかなと思います。
Firebug Lite for Google Chrome
例えば「ここのフォントサイズを変えたらどうなるんだろう？」とふと思ったときに、ブラウザ上で試しに編集をして確認をできたりするのが『Firebug』です。もちろん保存はできないです。
firefoxにも『Firebug』はあるのですがこちらはLiteとついているので少し簡易版な印象です。
ちょっとした確認のために本来のCSSやHTMLをいじる必要がないのはとても便利ですね！
MeasureIt
画面のサイズを測ることができる拡張機能です。上のスクリーンショットのように選択したとところpxで表示してくれます。
『Firebug』で確認ができない時などにはこちらを使用させてもらいます。
WhatFont
フォント名やフォントのサイズ・色などをワンクリックで表示してくれる拡張機能です。
他のサイトで使用しているフォントが気になったときの確認にとても便利ですね。
CSSViewer
気になる要素にマウスを持って行くだけで使用しているcssを一覧で表示してくれる拡張機能です。
『Firebug』を使用する程でもない時に便利ですし、何より軽いのがいいです。
ColorZilla
Chrome ウェブストアへ
webサイトを見ていて気になった色をスポイトできたり、表示しているページで使用している色を一覧で出してくれたり…と何かと便利な拡張機能です。スポイトした色を保存してくれているのはとても助かります。
久々に新しい拡張機能を調べたくなってきました・・！
今回はこのあたりで。
