När den är korrekt konfigurerad kan Firefox bli det ultimata webbutvecklingsverktyget, vilket ger dig direkt åtkomst till sidan du arbetar på så att du kan utforma din sida i realtid, felsöka javascript eller till och med redigera html.
Skapa separat profil för webbutveckling
Att installera alla dessa utvecklingsverktyg gör Firefox till en mycket tung webbläsare, så vi bör först skapa en ny profil för Firefox.
Du kan starta en separat profil samtidigt som din vanliga profil genom att skapa en ny genväg med dessa argument och ersätta WebDev med namnet på din profil. Det finns också en mer detaljerad förklaring hur man gör detta.
firefox.exe -P WebDev -no-fjärrkontroll
Nu när du har konfigurerat Firefox med en separat profil bara för webbutveckling, låt oss titta på tilläggen vi kan använda för att göra Firefox till det ultimata webbutvecklingsverktyget.
Must-Have Web Dev-tillägg
Dessa är alla tillägg som jag använder regelbundet för webbutveckling.
Firebug är det mest kraftfulla tillägget för felsökning av javascript, visning av CSS och html. Du kan göra dynamiska ändringar av koden och CSS och använda den för att felsöka din Ajax-kod. Det är verkligen det bästa tillägget där ute.
En av de bästa tilläggen för x år i rad. Detta är ett måste för alla utvecklare, men du har redan hört talas om det.
Denna förlängning är en mycket lätt förlängning som enkelt visar elementen på sidan och deras tilldelade klass / id. Det är enklare att använda än tillägget för webbutvecklare för de tider då du bara behöver snabb information för ett element. Du kan också använda den för att ta bort element från sidan.
Välj enkelt färger. Inget mer ont om att hitta färger inbäddade någonstans i ett formatmall.
Du kan ställa in flera källprofiler för att visa källan i olika applikationer.
Med det här tillägget kan du enkelt validera din HTML-sida och installera i panelen Visa källa.
Det är inte precis ett webbutvecklarförlängning, men Greasemonkey är fantastiskt, inte minst för möjligheten att automatisera vanligt utförda åtgärder, vilket är en bra tidsbesparing för webbutvecklare.
Mät enkelt ett avstånd på skärmen med detta tillägg. När du har mätt ett område kan du dra rektangeln runt skärmen för att använda som en jämförelse.
IE View / IE-flik / OperaView / FirefoxView / Safari View / IE View Lite
Dessa tillägg (välj ditt val) gör att du enkelt kan visa den aktuella sidan i olika webbläsare. IE-fliken låter dig till och med köra IE inuti en flik, om du var så benägen.
Rensar cachen. Särskilt användbart för att kontrollera nya CSS-ändringar.
Restart Firefox-tillägget är mycket användbart för att stänga och starta om Firefox med alla flikar och sessioner intakta.
Tab Mix Plus-tillägget är ett bra tillägg i allmänhet, men har några väldigt användbara funktioner för webbutvecklare: Duplicera fliken och URL till fliken Kopiera.
YSlow-tillägget är ett nytt tillägg från Yahoo som kommer att analysera din sida och berätta var du gör misstag. Det ger dig även betyg på din webbplatsprestanda. Du kommer att märka den lilla mätaren i det nedre högra hörnet ... den visar den totala storleken på din sida och laddningstiden. Mycket användbart tillägg, men det kräver Firebug-tillägget.
Dummy Lipsum-generatorförlängningen genererar dummyinnehåll åt dig baserat på den berömda Lorem Ipsum-texten som är mycket användbar för att lägga ut falskt innehåll på din webbplats.
Screengrab-tillägget låter dig ta skärmdumpar av sidor, men kan göra något som ett vanligt skärmdumpverktyg inte kan - det kan ta en bild av hela sidan, inte bara den synliga delen.
Det finns massor av andra tillägg som du kan använda, men det här är det bästa av det bästa från allt jag har sett. Om du har ett annat tillägg som du använder regelbundet, lämna ett omnämnande i kommentarerna.
Nu har du nu förvandlat Firefox till det ultimata webbutvecklingsverktyget. Ta dig tid att lära dig att använda Firebug speciellt.