お寿司か焼き肉食べたい

まじめな事からしょーもない事まで
めにゅーを開く(投げやり)

デバッグツール?

コーディングを行うにあたって凄く便利でなくてはならないツールです。
Firefox Chromeのデバッグツールが優秀です。IEにもありますよ。比較的新しいバージョンからね!

FireFoxのFireBug

FireFoxのFireBugです。これはアドオンですのでインストールが必要です。
デフォルトでもあるんですが、個人的にはFireBugのほうがスキです。

Chromeのデバッグツール

Chromeではデフォルトのデバッグツールを使用しています。
F12か右上のメニューから、【ツール】→【デベロッパーツール】で出てくるはずです。

デバッグツールで何ができるのか?

簡単に言うと、どんなHTMLが記述されていて、どんなCSSがそこに適用されているのかが見れます。
また、HTMLやCSSを直接書き換える事で、いわゆるデバッグができますので、細かい調整を行う場合は
ファイル修正→保存→確認の手間が省けるので、時間短縮にもなります。
画面上で調整してコピペして終わりです。
その他の使い方としては
1:どんな画像が読み込まれているか(404になってる画像ファイルも分かります。)
2:JSエラーが発生していれば詳細の内容(IEみたいに不親切じゃない!(重要))
3:通信状況が見れる
  →例えば、アクセス解析とかきちんとパラメータが送られていて、正常に送られているかも確認する事ができます。
他にも色々ありますが、網羅するのは大変ですので、今回はデバッグとかエラー確認ができるツール、と覚えておけばOKです。