今回デザイン変更する際にFirefox のエクステンション Firebug を使用したのだが、これが激しく便利なのでご紹介。
Inspect and edit HTML
HTML タブを選択後、Inspect ボタンを押すとページビュー上でマウスオーバーした位置が、即座に HTML ビューに表示されます。
HTML ビュー内は変更可能で、クラス名など変更すれば即座にページビューに反映されます。
右下の画面を Layout にしておけば、マージン・パディングも自由に変更可能、これも即座にページビューに反映されます。
Tweak CSS to perfection
CSS の内容もページビューを見ながら変更できます。
もちろん、ここで変更した箇所はページビューに即座に反映!
便利すぎます。
Debug and profile JavaScript
JavaScript のデバッグ環境としても激しく便利です。
1行ずつ実行はもとより、変数のモニタリング、ブレークポイントの設定など、必要な機能は一通り揃ってます。
しかも、ブレークポイントは単純に設定できるだけではなく、条件を設定してブレークポイントとして機能させるかまで設定できる!
Monitor network activity
「このページ、表示が遅いんだけど…」そんな悩みも即座に解決!
ネットワークモニタリング機能を使えば、ボトルネックになっている処理の特定が楽々できます。
Javascript のデバッガとしてだけでなく、デザインツールとしても激しく便利です。
ますます Firefox は手放せませんね (^-^)