11 bästa webbutvecklingstillägg för Chrome

När du utvecklar en webbplats måste du göra en checklista med många komplexa krav. Oavsett om det handlar om färg- eller teckensnittsscheman, CSS-layoutproblem eller webbläsbarhet på olika enheter är det viktigt att hålla koll på eventuella problem som uppstår. Följande är några av de bästa webbutvecklingstilläggen för Google Chrome (och andra Chromium-baserade webbläsare).

1. Färgvalspipett

Tycker du om färgschemat på en slumpmässig webbsida och vill använda det i ditt eget projekt? Ett Chrome-tillägg som heter Färgval ”pipett” låter dig extrahera färgerna med exakt noggrannhet och en justerbar zoomfunktion.

Tillägg som dessa kräver tillstånd på alla webbplatser för att utföra färgextraktionen. Vill du ha lite mer avancerade funktioner finns en liknande verktyg som heter ColorZilla som kommer med en gradientgenerator, palettvisare och färghistorik.

2. Skärmdump på helsida med ett klick

Att ta en helsidesbild på webben är en nödvändighet i det dagliga arbetet. Ibland är det bästa sättet att kommunicera dina designförändringar att fånga hela webbplatsen som den är. Med en anknytning som heter ”Skärmdump på helsida med ett klick”, du kan uppnå det exakt.

Medan skärmdumpen pågår öppnas din färdiga rullande bild i ett nytt fönster när den är klar.

Hela webbsidans skärm är nu tillgänglig för nedladdning i PNG-format. Du kan också använda ett antal effekter på bildskärmen, inklusive filter, rita över webbsidan, lägga till text och mer.

3. Redigera denna kaka

Webbutvecklare behöver tillgång till cookiehanterare för att lägga till, ta bort, redigera, skydda och blockera cookies. EditThisCookie är ett användbart tillägg som låter dig arbeta med cookies som du vill och exportera eller importera dem i JSON-format. Detta hjälper dig att hålla webbplatsen frisk genom att ta bort gamla cookies och begränsa det maximala utvinningsdatumet för alla kakor.

4. ModHeader

ModHeader är en av de mest populära Chrome-tilläggen för att ändra webbsidors HTTP-rubriker. Med bara ett eller två klick kan du aktivera rubrikändring baserat på URL eller resurstyp. Det bästa är att du kan skapa flera profiler och lägga till olika värden till de modifierade rubrikerna. Alla ändringar kan begränsas till bara en flik eller en hel webbplats.

5. UX-kontroll

Vi behöver alla en heuristisk utvärdering av den löpande webbplatsen då och då. Detta görs enkelt med UX-kontroll, ett tillägg som visar all UX-relaterad feedback i ett sidofönster. När du har klickat på ett element som inte matchar en heuristik som utvärderats av dig kan du lägga till anteckningar och ta skärmdumpar. Slutligen kan alla ändringar exporteras i .docx-format.

6. Window Resizer

Webbutvecklare måste emulera sina webbsidor för olika skärmdimensioner. Med Fönster Resizer, kan du enkelt göra dessa utvärderingar för bärbara datorer, surfplattor, smartphones och alla skärmdimensioner du väljer.

Verktyget har några coola funktioner som ”Rotera” och ”Live Measurement”, tillsammans med en massa visuella anpassningsfunktioner. Om du vill bygga en riktigt responsiv webbplats, se till att du har krysskollat ​​dess utseende för alla skärmdimensioner.

7. Lorem Ipsum Generator

För att snabbt slutföra jobbet på en webbsida behöver du standardtext. En anknytning som kallas Lorem Ipsum Generator erbjuder flera standardtextalternativ med olika stycken och meningar per stycke. Du kan välja fragment av text eller hel text med alternativet ”Automatiskt val”. Den slutliga mallen ger ett elegant utseende på grund av variationsmöjligheter i text.

8. BuiltWith Technology Profiler

BuiltWith är en klassisk förlängning för att lära dig om alla underliggande tekniker som stöder en webbplats. Med bara ett klick skapar den en profil som hjälper dig att lära dig om de senaste tilläggen och instrumenten som gör att webbplatsen sticker ut bättre. Detta hjälper dig att replikera dess funktioner för eget bruk.

9. WhatFont

WhatFont är ett av de snabbaste och enklaste sätten att identifiera olika teckensnittstyper på en webbsida. Du behöver bara hålla muspekaren nära texten för att få fullständiga detaljer. Den stöder avancerade mallar som TypeKit och Google FontAPI.

10. CheckMyLinks

Ibland behöver vi en objektiv sammanfattning av alla länkar till en webbplats. CheckMyLinks är ett populärt tillägg för att sammanfatta giltiga, ogiltiga och trasiga länkar. Länkresultaten för alla pågående webbplatser visas omedelbart på en sidoruta. Det här verktyget är extremt praktiskt för stickprovskontroller i sista minuten innan din webbplats eller publicerade ändringar går live.

11. Bekämpningsmedel

Förutser du CSS-layoutproblem på din webbplats? Pesticid låter dig felsöka dessa problem genom att tillhandahålla en disposition till varje sidelement. Genom att hålla i Ctrl nyckel kan du se elementinformationen och analysera elementets placering på sidan.

Det finns många andra populära webbtillägg som hanterar viktiga detaljer i webbapplikationer. Till exempel, JSON Viewer hjälper de som arbetar med JSON-filer. Där är en HTML-trädgenerator som ger ett träd av alla element i en webbplats.

Förutom ovanstående finns det också gott om Chrome-tillägg för att förbättra din surfhastighet. Kolla på dem!