FİREBUG browserde gerçek zamanlı kod görüntüleme-düzeltme

firefox'luyum dedirtecek eklentilerden :

web tasarımında tecrübeli yada yeni başlayan ol. html,css,javascript,ajax kodladıktan sonra F12'ye basıp siteyi kontrol etmek artık web tasarımcının bir nevi "tik"'i olmuştur. sitede yaptığın en ufak noktanın acaba ne gibi etkisi oldu. meraklar,hata korkuları.

pek çok kod yazarının vazgeçemediği program. işte sana firebug.
browserinin penceresinin içerisindeyken,ister sadece o kodu kapat,ister değiştir öyle kontrol et (dosyaya kaydetmeden). hasılı kelam işte başlıyorum.

firebug'u yüklemek :

tıkla ve indir. firefox yükleyip,kendini tekrar açtığında browserin sağ alt köşesinde "gri renkli bir böcük" göreceksin. tıkla üstüne.



ana ekran gelecektir.

özellikler :

en çok sevdiğim özelliği tek tuşa basarak (teftiş düğmesi) o an ekranındaki sitenin herhangi bir noktasına fare ile gittiğinde.

eğer seçtiğin nesneye tıklarsan



yukarıdaki resimde fare ile kodların üzerinde dolaşınca şunu farkedersin. imleç nereye gitmişse orası mavileşir ve sana ben buradayım der.
menüde soldakiler html kodlarını sağdakiler ise css kodlarını gösterir ( bu css kodları ister sayfanın içine gömülü isterse ayrı css dosyası olsun).

şimdi gelelim css kısmına,



burda istediğini yap. mesela,



şu koskoca yahoo'ya bak elimde şarlaana döndü ;)



html,css,javascript hepsinden tad. bir dreamwevera bir browsera ne gerek. bir firefox,birde firebug yeter sana...
siten yüklenirken acaba hangi resim,yazı,flash objen ne kadar sürede yükleniyor. acaba resim çokmu büyük yada video dosyan. bir bak bakalım yüklenme sürelerine falan.

tekrar ana menüyü aç,menülerden
'yi tıkla etkini seç,F5 yap ve sayfa yenilensin.



bunlardan istediğini kontrol et. ve göstergeli çubuklara. yüklenme hızlarına.

benim şimdi kullandığım ve şu an anlattığım firebug'un 1.4.5 sürümüdür.

Volkan Görgülü firebug hakkında çok güzel bir yazı yazmıştı ve ilk defa onun sayesinde eklentiyi tanıdım. o sayfa için. teşekkürler Volkan.

başka kaynaklarda bildirgeç,eklenti üreticisinin kendi sitesinde javascript,dom konularınada değinmiş. tıkla