15 bästa webbläsarförlängningar för utvecklare (2020)

Den största förändringen för 2018 har varit den stora översynen av FireFox, och med det fungerar tillägg i den webbläsaren. Som ett resultat underhålls många populära tillägg inte längre eller har blivit otillgängliga.

De flesta tillägg för Firefox är också tillgängliga som tillägg för Google Chrome. I den här artikeln försöker vi föredra tillägg / tillägg för andra webbläsare, vilket inom detta sammanhang innebär att de fungerar på Firefox, Chrome och Chromium. Vi föredrar också gratis tillägg som inte är kända för att skicka din information till tredje parter och som inte stöds av annonsintäkter. Vi kommer att fokusera mer på tillägg som inte begränsar dig till en viss utvecklingsteknik.

Få utvecklare skulle se någon fördel med att använda Microsoft Edge som en utvecklingswebbläsare, men det är bra för tester efter utveckling. Endast lite över fyra av 4 besökare kan förvänta sig att använda det, även om antalet kan förväntas öka något när fler användare lämnar Internet Explorer.

Trots att det finns fler Chrome-användare än Firefox-användare, tenderar de i IT-publiken att föredra Firefox, varför det finns fler och bättre tillägg riktade till utvecklare i Firefox.

Låt oss nu titta på de allra bästa webbläsarförlängningarna för utvecklare och varför du kanske vill lägga till dem i din webbläsare.

1. Byggt med

När du befinner dig på en riktigt välgjord webbplats och vill veta hur de har gjort det kommer denna tillägg att spara dig mycket tid och ansträngning att gräva i källkoden. Nedladdningslänkar: Krom / Krom, firefox

2. yxa

Detta är ett verktyg för granskning av tillgänglighet. Det är alltid bäst att försöka göra dina sidor så tillgängliga som möjligt, och yxa hjälper dig att av misstag utesluta ett segment av användare från din webbplats. Nedladdningslänkar: Krom / Krom, firefox

3. ColorZilla

En oldie men fortfarande en goody, det här tillägget låter dig prova färger direkt från en sida, hämta färgkoder, generera lutningar och mer. Nedladdningslänkar: Krom / Krom, firefox

4. WebDeveloper

Lägger till några användbara extra till din webbläsare för kontroll av CSS, formulär, bilder och information. En av de mest populära utvidgningarna någonsin. Nedladdningslänkar: Krom / Krom, firefox

5. Woo Rank

Analysera en webbsida för SEO-data. Ger en kraftfull rapport som visar dig alla interna SEO, inklusive en total SEO-poäng, förslag på förbättring, nyckelordmoln och mycket mer. Nedladdningslänkar: Krom / Krom, firefox

6. Tab2QR

Skapa en QR-kod för sidan du är på och du kan besöka sidan med din telefon bara genom att skanna QR-koden. Bra för att testa känsliga webbplatser, även om du inte skapade dem. Nedladdningslänkar: Krom / Krom, firefox

7. HTTP Request Maker

Detta kan vara mycket användbart för att testa PHP-formulärsvar där du egentligen inte vill skicka in formuläret (vilket kan utlösa ytterligare behandling som du inte behöver testa). Med det här verktyget kan du smidra HTTP-förfrågningar utan problem. Observera att även om Chrome och Firefox-tillägg har samma namn och gör samma saker, är de tillverkade av olika utvecklare och är inte exakt samma. Nedladdningslänkar: Krom / Krom, firefox

8. Test av sidprestanda

Få snabbt en rapport om hur din sida presterar i olika stadier av sin resa till din webbläsare. Det är på samma sätt som en mer avancerad version av tracert. Den här är endast tillgänglig på Firefox för tillfället. Det finns liknande tillägg för Chrome och Chromium men de är inte lika rikt på funktioner som den här. Nedladdningslänkar: firefox

9. Word Count Tool

Den här kan faktiskt göra mer än namnet antyder, eftersom det också kommer att berätta hur många tecken och hur många meningar som finns inom ett valt textblock (eller hela sidan). Nedladdningslänkar: Krom / Krom, firefox

10. Lista över webbutvecklare

Se till att du följer de bästa riktlinjerna för webbutveckling med det här verktyget som visar var dina standarder kan ha glidit. Nedladdningslänkar: Krom / Krom, firefox

11. Bildkartredigerare

En av en trio med utmärkta tillägg från den tyska utvecklaren Heinz-Jürgen Boms, den här gör exakt vad namnet säger att det gör. Du kan generera en bildkarta direkt i webbläsaren bara genom att spåra över områdena i en bild du vill kartlägga. Nedladdningslänkar: firefox

12. Avancerad bildredigerare

Ett annat tillägg från Heinz-Jürgen Boms, detta är verkligen ett CSS-stylingverktyg där du kan bygga en ram direkt i webbläsaren genom att ange dess attribut. Det är värt att kolla in dokumentation innan du börjar använda den. Nedladdningslänkar: firefox

13. Bootstrap Responsive Helper

Detta är en mycket enkel liten förlängning som hjälper dig att snabbt se om dina brytpunkter fungerar korrekt och vilken bootstrap-nivå det aktuella läget är. Naturligtvis behöver du bara den här utvidgningen om du verkligen arbetar i Bootstrap. Chrome-versionen är utvecklad av Jonathan Defraiteur, och Firefox-versionen är utvecklad av Kevin Bon. Nedladdningslänkar: Krom / Krom, firefox

14. Prova själv HTML5 Editor

Om du föredrar att hålla sakerna enkla och bara få allt ditt arbete gjort från ett ställe, är detta tillägg åt dig. Den här kontextmedvetna redigeraren är rik på funktioner och fungerar direkt i webbläsaren och stöder HTML, CSS och JavaScript. Det är långt ifrån perfekt, men för en snabb och smutsig redigering utan att bry sig om att öppna en separat applikation får det jobbet gjort. Nedladdningslänkar: firefox

15. Röntgenglasögon

Tekniskt sett är detta inte ett tillägg, det är faktiskt en bokmärke. Men det fungerar så bra, vi kunde inte lämna det från listan. Trots att den är gjord av Mozilla fungerar den lika bra i Chrome eftersom båda webbläsarna uppfyller standarderna. Om du vill använda det måste du göra dina bokmärkesfält synliga. Besök sedan nedladdningssidan, som du kan nå via länkarna nedan och dra X-Ray Goggles-knappen till bokmärkesfältet. Besök sedan bara valfri webbplats, avfyra ditt röntgenglasögonbokmärke, välj ett element på sidan och du kan redigera koden för det. Nedladdningslänkar: Krom / Krom, firefox

header image med tillstånd av

Bogdan Rancea

Bogdan är en av grundarna i Inspired Mag och har samlat nästan 6 års erfarenhet under denna period. På fritiden gillar han att studera klassisk musik och utforska bildkonst. Han är ganska besatt av fixies också. Han äger redan 5.