手軽に使える便利な firefox のアドオン！

はじめまして。こんにちは、藤江です。
4月末にフロンティアビジョンへ入社して、3ヵ月と1週間程になるマークアップエンジニアです。
熊本電子ビジネス専門学校を卒業して佐賀のWeb制作会社で3年3ヶ月従事しておりましたが、
ご縁があって熊本に戻ってきました！
これからよろしくお願い致します。

さて今日はブログ更新担当日ということで、
ご存じ、モダンなブラウザ『Firefox』のマークアップ実務で使えるオススメアドオンのご紹介を致します。

目次

多機能で軽量なカラー情報を取得出来る『ColorZilla』
スタイルシートだけ更新出来る『CSS Reloader』
モバイルシミュレーター『FireMobileSimulator』
サーバーの場所が一目でわかる『Flagfox』
HTML構文が正しいか逐一わかる『Html Validator』
スクリーンショットとものさし代わりにも？『Lightshot』
リンクチェックを可視化『LinkChecker』
今開いているページを他のブラウザで開く『Open With』
ページのソースを比較する『PageDiff』
CSSやJavaScript等をお気軽ON・OFF『QuickJava』
ユーザー独自のスタイルシート『Stylish』
最後に

多機能で軽量なカラー情報を取得出来る『ColorZilla』

ColorZilla :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/colorzilla/
サイト上の色をワンクリックで調べてくれたり、その際にカラーコードをコピーしてくれたり、ブラウザ上でカラーピッカーを表示して色を変更したりなど、とっても便利なアドオンです。
動作も軽量で、画像編集ソフトなど起動しなくてもカラーピッカーを使うことが出来て捗りますよ！

スタイルシートだけ更新出来る『CSS Reloader』

CSS Reloader :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/css-reloader/
ページは更新したくないが、CSSだけ反映させたい場合などに有効なアドオンです。
お問い合わせフォームなどを構築する際に活用します！

モバイルシミュレーター『FireMobileSimulator』

FireMobileSimulator :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/firemobilesimulator/
最近はあまり出番がありませんが、モバイルサイトを気軽に閲覧することが出来るアドオンです。
大まかな制作・確認はシミュレーターで、最終確認は実機で、の様なときには重宝しますね！

サーバーの場所が一目でわかる『Flagfox』

Flagfox :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/flagfox/
ロケーションバーに国旗が追加されます。
そこから右クリックのメニューからwhois情報やIPアドレスのコピーなどが簡単に出来るようになります。

HTML構文が正しいか逐一わかる『Html Validator』

Html Validator :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/html-validator/
ページを表示するたびにチェックしてくれます。
正しければ緑マークにチェックが、
エラーがあれば赤マークに×が、
警告があれば三角アイコンにびっくりマークが表示されます。
また、ページのソースを表示すると、エラーの内容や問題がある場所を示してくれます。

スクリーンショットとものさし代わりにも？『Lightshot』

Lightshot (screenshot tool) :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/lightshot/
該当箇所のスクリーンショットだけ撮って文字などを入れたり出来るアドオンですが、
ピクセル数も表示出来るので、サイト上ものさし代わりとしても利用可能！

リンクチェックを可視化『LinkChecker』

LinkChecker :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/linkchecker/
リンクを一つひとつ調べるのが大変なときはこのアドオン。
リンクが正しい場合は場合は緑色に、
リンク切れの場合はピンク色に、
アクセスに制限がある場合（Basic認証等）などは黄色になります。

今開いているページを他のブラウザで開く『Open With』

Open With :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/open-with/
Firefoxで現在開いているページを、ワンクリックで他のブラウザで開くことが出来ます。
URLをコピーペーストする作業からおさらばです！

ページのソースを比較する『PageDiff』

PageDiff :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/pagediff/
Web上で見ることが出来るページのソースコードを比較することが出来ます。
本番環境と開発環境の差異をさくっと知りたい場合によく使います。

CSSやJavaScript等をお気軽ON・OFF『QuickJava』

QuickJava :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/quickjava/
CSSやJavaScript等をワンクリックでお気軽にON・OFF出来ます。
最近ではトップページにjQueryを使った画像のスライダーが良くありますが、
JavaScriptがOFFの場合は当然動作しません。
そんな時の代替えコンテンツの設置もこのアドオンのおかげで、楽に確認出来ます。

ユーザー独自のスタイルシート『Stylish』

Stylish :: Add-ons for Firefox
https://addons.mozilla.org/ja/firefox/addon/stylish/
サイト上にユーザー独自のスタイルシートを反映することが出来ます。
私は、画像が無い場合良く目立つように、赤背景を出すような使い方をしています。