Own products

  • 新規事業のアイディア創造機

Introduce

2010
04/21

Firefoxを最強のwebサイト統合開発ツールにするアドオンまとめ。

この記事の読了時間:約419

  • このエントリーをはてなブックマークに追加

現在Internet Explorerの強大なシェアに最も肉薄しているブラウザであるFirefoxですが、ご存知の通り様々なジャンルのアドオンが那由他に存在しています。

特にWeb制作者にとっては便利すぎて手放せないようなモノも数多く、その有用性はAdobe製品群とも並ぶほど。

そんなワケで今回のエントリーでは、素晴らしいアドオンの中でも、特にWeb制作に効果的なモノを選りすぐりしちゃってみました!

今回ご紹介するアドオンをフル装備すれば、恐らくそんじょそこらの有料開発ツールと同等以上のポテンシャルを秘めたWeb開発統合ツールが完成するんじゃなかろーかと。

ブラウザを思いのまま颯爽と操る後ろ姿、プライスレス☆

html/cssコーディング

Codetch

DreamWeaver風のWYSIWYGなHTMLエディタ機能を追加するアドオンです。

作成したHTMLをバリデートチェックする機能も搭載されている、なかなかお利口なアドオンになっています。

EditCSS

ページのCSSをリアルタイムで編集できるアドオンです。

作りこみ作業はもとより、リアルタイムでデバッグしながら作れるってのはホント便利です。

画像作成

Pixlr Grabber

無料オンライン画像編集サービス「Pixlr」にページの画像キャプチャーを送りし、それをそのまま編集できるというアドオンです。

Pixlr自体がかなり高機能なウェブサービスで、操作性もPhotoshopが分かる方なら悠々と使えると思います。

ローカルの画像を上げて編集ってのもウェブ上で出来るので、かなり深いトコまで作り込めますよー。

Pencil

Firefox上でラフデザイン・モックアップを作成できるようになるアドオンです。

別ウインドウに表示される画像パーツをドラッグ&ドロップしていって、さらに注釈なんかも記述できます。

作成した画像はもちろん保存できるので、プロジェクトメンバーとの共有やクライアントとの意見交換にもバッチリ使えますね。

デバッグ

Html Validator

ページのソース(Ctrl + U)を表示した際、そこにHTMLのバリデートチェック結果を同時表示してくれるアドオンです。

閉じタグ忘れや構文ミスなどが一目瞭然で分かるので、しょーもない凡ミスも防げます。

これはホント便利ですよー!

CSS validator

インストールすると右クリックのメニューに「Validate CSS」という項目が加わり、クリックすると現在のページのCSSをW3CのCSS検証サービスに送ってくれます。

かなりガッチリに診断されるので、企業用とかシビアな条件の時に最適かと。

Browser View Plus

Firefox上からIEやOperaなどのブラウザを呼び出せるアドオンです。

いちいちデスクトップに戻ったりしなくてもいいので、小さなトコですが効率は確実に上がるんじゃないでしょーか。

User Agent Switcher

ユーザーエージェントをIEや携帯キャリアに偽装するアドオンです。

サーバ側でユーザーエージェントによる切り分け処理してる場合なんかのデバッグには必須のアドオンですよ。

FireMobileSimulator

これは携帯キャリアの端末ブラウザをシミュレートした、偽装系アドオンです。

携帯端末のHTTPリクエスト、絵文字表示、位置情報送信機能などといった携帯特有の動作がシミュレート出来る、モバイオルサイト開発者には感涙のアドオンです。

ユーティリティー

ColorZilla

こちらはページ上のあらゆる色を取得できるアドオンです。

「Web DOM Color Analyzer」という、表示されているページ内にある全ての色をリスト表示してくれる機能が素敵過ぎます。

FireFTP

Firefox上で動くFTPを導入するアドオンです。

アドオンとはいえ機能はかなり本格的なもので、FFFTPなんかとほぼ同等の機能を持っています。

Window Resizer

ブラウザのサイズを、800*600や1024*768などといった主要な解像度のサイズにワンクリックでリサイズできるアドオンです。

忘れがちな解像度ですが、様々なユーザーの環境を考慮するためにも、ぜひこのアドオンは導入しておきたいですね。

CodeBurner

これはFirebugに依存したアドオンで、導入するとFirebugの中でhtmlやcssのリファレンスを閲覧できるようになります。

リファレンスの解説が英語なのでちょっと分かり難い面もありますが、ちょっとした確認の際なんかには結構便利ですよ。

毎日エントリー3日目にして、もう書き溜めネタが無くなりましたw

ここを乗り越えた先にはッ!輝かしい未来ッ!まばゆい明日がッ!待っているんだァァッ!!!

っちゅーコトで、明日はデスクトップアプリのウィンドウを省エネする便利ツールをご紹介する予定でござるよ♪

  • このエントリーをはてなブックマークに追加

コメント一覧

1 Response to [Firefoxを最強のwebサイト統合開発ツールにするアドオンまとめ。]

webd より:

2010/06/07 2:08 PM

IEのシェアに比べたらまだまだ少ないfirefoxですが、最近完全にfirefoxに乗り換えて、ブラウザヘッダーのカスタマイズやブラウザを閉じるたびにサイトを保存するなどいろいろ便利な機能が多いです。

ここでご紹介くださったアドオンなど知らなかったものばかりなので、とても勉強になりました。

便利なfirefoxのシェアが伸びてくることを祈っています。

コメントを投稿する

お名前

ご連絡先メールアドレス※非公開

コメント

  • このブログのRSSを購読する
  • このブログをtwitterでつぶやく
  • このブログをFacebookで共有する
  • このブログをはてなブックマークで共有する

Contact

お名前※必須

ご連絡先メールアドレス

お問い合わせ内容※必須

CAPTCHA

captcha

Blog parts

Affiliate