Firefox Firebug Webデバッグツール

”豊富なアドオンで機能拡張できるWebブラウザー”ということで、2008年の春ごろにFirefoxをアップデートして今現在バージョンが「 v2.0.0.14 」です。どんどん開発されたFirefoxは便利な機能が追加されて私にはとても使いこなせないほどです。

Firebug :: Firefox Add-ons

機能拡張(アドオン)を入れるとIEのバージョン7のように「タブ切り替え型Webブラウザー」となり、Firefox Add-onsをダウンロードするとナビゲーションツールバーのツールにFirebugという項目があります。その中から「Firebugを開く」を選択すると今現在見ているサイトの下半分にFirebugが表示されます。

ウエブデザインの「デバッグツール」とは不具合の訂正、つまり「バグ」を取る(デバッグ)作業のお助けツールです。
私のブログ「Audio-Visual Trivia」で試してみると ↓
b0002123_21434886.jpg
クリックで拡大
(Firefoxはツール>オプションでこのサイトのポップアップを許可)

※これはFirefoxでページの上で右クリックしてメニューの一番下の「要素を調査」を選択しても表示されます。

バグ(虫の画像)の右にある「調査」を選択して、本サイトのいづれかをマウスでポイントするとその要素が表示される仕組みです。例えば中央のCD画像をポイントするだけでそのタグが分かります。これを別の場所にもっていったらどうなるかと、タグを選択して移動して編集してみることが出来るのです。実際はブログの編集画面で書き換え保存をしないと反映しませんが、目の前で変化を見ることが出来ます。
「編集」を選択するとfontを変えたり色を変えたり、枠の幅を狭めたりと試してみることが出来るのです。ですから出来上がったページが思い通りでない場合は色々とタグを移動させてみることも出来ます。
右の検索窓で任意のキーワードからページ内の目的の箇所にいけます。右端の×でFirebugを終了できます。

私はまだよくは把握できていませんが、色々試して遊んでみて下さい。
ブログの上のバナーとコンテンツの幅は直したのですが、そのうち、IEでは中央に見えるのにFirefoxでは右寄せになっている点と、左右の余白の違いを直したいと思っています。

追記!
2009年1月中旬にこれまでのFirefox2のサポートが終了するとのことでFirefox3にバージョンアップを勧められてインストールしました。
その前に注意事項でも読めば良かったのですが完了後に気が付いたことは日本語に対応していた”Firebug”機能が無くなってしまったことです。

Firefox3をアンインストールすれば戻るかといっってもFirefox2サポート終了ではどうしようもありません。ウイルスの脅威よりは面白機能のFirebugを諦める他はないのです。英語版なら大丈夫なんでしょうかね。
※Firebug Japanese 1.05 を Firebug1.1にするとFirefox3でも使えるという情報をみましたが。もうちょっと調べてみましょう。

追記
その後、2009年8月にはFirefoxはバージョン”3.52になり、”Firebugのバージョン”1.42”が入っています。
[PR]
by koukinobaaba | 2008-05-23 21:05 | 面白記事
<< カマロ K'Maro 悲しき少年兵 Lonely S... >>