ホーム > Web > Web制作者(マークアップ系)ならこれだけは入れておきたいFirefoxアドオン

Web制作者(マークアップ系)ならこれだけは入れておきたいFirefoxアドオン

たいそうなタイトルですが、単に自分はこれを入れていておススメですよというFirefoxのアドオンです。会社のFirefoxを一旦ユーザープロファイルを含め完全に削除してから再インストールしたらかなりサクサクになって気分がいいのでこんなの書いちゃいます。(家のは最近インストールしたばかりなのに起動がかなり遅い…)
まあ、このようなブログ記事は何度も目にしていますので目新しさはないでしょうが…

おススメアドオン

Firebug

firebug

いわずと知れた有名アドオン。
HTMLの構造が把握しやすく、調査ボタンを押すと知りたい要素のHTMLとCSSがどのように記述されているか一発でわかります。また、ライブでCSSを変更して確認できる点が素晴らしい。Firefoxでチェックしながら作っている場合は絶対に入れておきたいアドオンですし、恐らくほとんどの人が使っているでしょう。ただ、最近Firefoxがよく落ちるのですが、このアドオンが原因という可能性もあるようです。

様々な拡張アドオンがあるのも魅力。

Web Developer

webdeveloper

こちらも必須ツールです。
ワンクリックで全ての画像のalt属性を確認したり、画像を非表示にするなどWeb制作時の確認作業時にかなりの力を発揮してくれます。今まで日本語が使えてましたが、最近英語版をインストールしたようで日本語が使えない…どなたか日本語の仕方をおしえてくださ~~い…

HTML Validator

validator

表示しているページのHTMLの文法チェックをしてくれます。
これを入れておけばいちいちW3Cのサイトなどにアクセスしなくて済むのでかなり作業効率があがりますし、常に結果が見えているのでValidなHTMLを書けるようになります。ただ、Validなら何でもいいという訳ではなく、テキストの要素を適切なタグでマークアップすることが大切なことだというのを忘れてはなりません。

YSlow

yslow

これはFirebugの拡張アドオンです。
このアドオンではそのページの表示速度を計測できます。Yahoo!社でフロントエンドのパフォーマンス改善に尽力した人が作ったアドオンで、ハイパフォーマンスWebサイトという書籍を合わせて読むことをおススメします。
ブログなど何も考えずに作ってたら大概グレードCくらいなのですが(Small Site or Blogのオプションで計測した場合)、本を参考にグレードAまで改善すると表示スピードが0.6秒強から0.4秒弱に改善されました。
ちなみにこのブログはプラグインをいくつか入れているのでグレードがBになっています。

Operator

operator

これはまだあまり知られていないかもしれません。
ページ内のmicroformatsで記述された部分を理解し、表示してくれます。
WordPressはmicroformatsがふんだんに盛り込まれているので興味があるかたはこれを使ってみましょう。
例えばhCalenderというmicroformatsがWebサイトに記述されていればそれを理解し、ワンクリックでGoogle Calenderなど他のアプリケーションに登録してくれる優れもの。日本ではまだ誰もが知ってるというものでもないですが、すでに4年ほど前から使われていて大きなサイトでも積極的に利用されています。microformatsに興味がある開発者の方はさらにmicroformatsに興味を持つアドオンではないかと思います。

同じくmicroformatsアドオンのTails Exportも合わせてどうぞ。

Pearl Crescent Page Saver Basic

pearl

このアドオンはブラウザに表示されているもののキャプチャをとるためのプラグインです。これを知るまではWebページのキャプチャはSleipnirでとっていたので大変ありがたいプラグインです。
画像のキャプチャの仕方(表示されている部分だけかページ全体か)、画像形式(jpegかpng)を選択できます。

Shareaholic

shere

これはソーシャルサービスにワンタッチで登録するためのアドオンです。
サービス数が充実していて使い勝手がいいです。これを使えばいちいち登録したいサービスの管理画面を開いく手間が省けていいです。最もソーシャルブックマークやRSSを多用している人には有用ですが、使っていない人には無用なアドオンではあります。
上記以外にTumblrなども登録できます。

その他

入れておいてもいいんじゃないかナーという感じのアドオンを

SenSEO

これは実験的なアドオンでそれをわかった上でインストールしないといけません。SEOに関するFirebug拡張のようですが、使ったことが無いので詳細は不明です。ちょっと明日にでも会社のFirefoxに入れてみようと思います。

ColorZilla

Webページの色を抽出できるアドオン。デザイナーは重宝するアドオンでしょうか。このアドオンを入れたら、インストールの仕方も悪くて起動する毎に作者ページが開いたのでちょっと嫌いになっちゃいました。

MeasureIt

選択した部分の大きさを測るアドオンです。これも1pxのずれも許せないマークアップエンジニアが好きそうなアドオンですが、今のPCには入れていません。僕は正直精度に疑問を持っていますが、あれば便利なアドオンではあります。

Firefoxはあまりアドオンを入れすぎると重くなってしまいますが、カスタマイズ性に優れた素晴らしいブラウザです。特にWeb開発者にとっては重宝するブラウザだと思います。
もしもブラウザが重くなってきたらユーザープロファイルも含めた完全なアンインストールを実行してから差インストールをしましょう。その際はお気に入りの保存(エクスポート)も忘れずに。見違えるように軽くなります。それでみなさん快適なブラウジングとWeb制作を。

関連する投稿

コメント(閉):2

Sorai 2009 年 5 月 24 日

とても役に立つ記事ありがとうございます。

Firefox のアドオンについてあまり知らない事ばかりだったので、今後参考にさせていただきたいと思います!

londoner25 2009 年 5 月 24 日

FirefoxはWeb制作系のアドオンも豊富でいいですね。
Firebugは色々拡張アドオンがあるのも素晴らしい。
最近Webサイトの高速化やmicroformatsに興味があるので、それを学んだり実践するのに便利なアドオンがあるのもうれしいです。

ホーム > Web > Web制作者(マークアップ系)ならこれだけは入れておきたいFirefoxアドオン

検索
フィード
メタ情報

ページの上部に戻る