Firebug

Recenze vynikajícího rozšíření pro prohlížeč Firefox, které si ihned zamiluje každý webdeveloper.

Firebug je rozšíření (extension) pro vynikající webový prohlížeč Firefox. Firebug, přestože je velmi malý (300 kb), je neocenitelnou pomůckou webdevelopera. Po jeho instalaci se vám ve Firefoxu vpravo dole objeví malá kruhová zelená ikonka s bílou fajfkou. Pokud na ni kliknete, rozbalí se z dolní lišty Firefoxu okno Firebugu, ve kterém najdete vše potřebné. V případě potřeby můžete Firebug spustit také v samostatném okně, což je milá funkce nové verze.

Záložka HTML pod sebou ukrývá zdrojový kód právě načtené stránky. Ten je přehledně "sbalený", a vy si můžete rozkliknout pouze ty části, které vás zajímají a zbytek vás nebude rušit. Při označení určité části zdrojového kódu uvidíte napravo v okně Firebugu CSS vlastnosti, které se zvýrazněné části kódu přímo týkají. Tyto vlastnosti můžete dokonce měnit, ale o tom až za chvíli.

Vynikající věcí je tlačítko Inspect. Kliknete na něj, poté najedete na libovolnou komponentu na webu, například obrázek a ve Firebugu hned vidíte její místo ve zdrojovém kódu a CSS styly, které tuto komponentu ovlivňují. Všechny CSS vlastnosti webu můžete měnit přímo "za běhu". Nevyhovuje vám padding 5 pixelů? Změňte ho na 10. Nelíbí se vám background-color:white? Změňte ji na gray. Každá z těchto změn se ihned projeví v prohlížeči. Atributy se ve zdrojovém kódě stránky samozřejmě nemění, vše probíhá pouze v okně prohlížeče. Je to mnohem pohodlnější než pokažné změněný css soubor uploadovat na server. Jednoduše neocenitelná pomůcka webdesignéra.

Pod záložkou Net se skrývá další užitečná utilitka. Když kliknete v prohlížeči na tlačítko refresh, Firebug vám spočítá, jak dlouho trvalo nahrátí webu a jak dlouho se nahrávaly jednotlivé komponenty. Pro představu se mi Stoyan's Page nahrávala 621 ms, z toho nejdéle trvalo natažení statistiky toplist (330 ms), poté počítadlo od BlueBordu (158 ms) a třetí nejpomalejší bylo natažení google-analytics (98 ms). Zato takové soubor s css styly se nahrál za 16 ms. Pomocí Firebugu můžete své stránky optimalizovat a porovnávat, jak se různé změny na webu projeví na čase nahrátí stránky.

Dále je ve Firebugu implementovaná konzole JavaScriptu a DOM Inspector, skvělé funkce pro vývoj kaskádových stylů, jako např. zvýrazňování box elementů, pravítko, pomocné lišty... je toho opravdu hodně. Více funkcí se dočtete na oficiální stránkách.

Předcházející článek: PageRank

Následující článek: IT Crowd

Přidej svůj komentář

P-Jay	peter.janda(zavinac)seznam.cz
Hele lidi. mám firebug, ale mám s tim velkej problém. Nenačte se mi HTML. Načte se mi pouze Script. Nevi někdo v čem je chyba?????? Pls odpovezte mi na mail
8.6.2008 14:18:07		80.188.163.*

Jaa	kolodejk2(zavinac)centrum.cz
Ahoj lidicky no je ten prograM UPE super ale kdys si navolim na kmenach vojaky tak mi zmizi ? co mam s tim udelat pls odpovezte mi nekdo na email fnx moc
31.3.2009 17:04:13		89.31.11.*

typek4ever	slepotice(zavinac)seznam.cz
upe supr programek ale jak ho potvrdim aby tam zustal ?kdyz to dam a aktualizuju tak mi zmizi pls odpovezte mi na e-mail
28.4.2009 15:50:15		93.181.105.*

Walker187	ano.kris19(zavinac)atlas.sk
Hosi mam firebug ale niejde mi to ulozic co som heknu poradite pls napiste mi dakto na e-mail dik
4.5.2009 14:04:57		213.81.222.*

monty	motejzik1(zavinac)seznam.cz
Vyděl sem vydeo kd eto týpek v jedný hře udělal tak sem to taky zkušel a nic poradíte??je to toto video http://www.youtube.com/watch?v=ytpTqaDVZt4 napište dištak pls i na mej a na grepolis sem to taky zkoušel a nic
4.7.2011 23:53:18		212.27.218.*

Nový komentář

Nick:	109" />	Smajlíci:
Web:
Email:
Komentář:
Opište prosím číslo 109 (ochrana proti SPAMu)
	* Pole Komentář podporuje BBCode tagy

© Stoyan, 2006 - 2012