Inhoud
- 01. Vereenvoudig Gmail
- 02. Spectrum
- 03. CSS Scan 2.0
- 04. Amino
- 05. Sizzy
- 06. Site-palet
- 07. Checkbot
- 08. Toby
- 09. DomFlags
- 10. Sterk markeerstift
De Dev Tools van Chrome zijn geweldig, maar het is mogelijk om nog meer opwindende functies aan uw internetbrowser toe te voegen om webontwerp en -ontwikkeling gemakkelijker te maken.
Er zijn natuurlijk een heleboel andere tools om dingen te versnellen, zie onze favoriete post over webontwerptools. Voorlopig zijn hier echter 30 van onze favoriete Chrome-extensies voor webontwerpers en ontwikkelaars.
01. Vereenvoudig Gmail
Als je vindt dat Gmail een beetje te rommelig wordt voor zijn eigen bestwil, zeg dan hallo tegen Simplify Gmail, dat al het puin en slechte UI-beslissingen wegvaagt die er de afgelopen jaren in zijn geslopen. Gemaakt door de voormalige hoofdontwerper van Gmail, Michael Leggett, wordt alle afleidende rommel verwijderd en krijgt u een meer gestripte en functionele versie.
02. Spectrum
Een of andere vorm van kleurenblindheid treft wereldwijd ongeveer 200 miljoen mensen, maar de catering voor hen staat vaak laag op de toegankelijkheidschecklist van ontwerpers. Met Spectrum kunt u uw site echter snel testen op verschillende soorten kleurwaarnemingstekorten en ervoor zorgen dat alles duidelijk is.
03. CSS Scan 2.0
De Dev Tools van Chrome zijn een handige manier om onder de motorkap te kijken hoe een site werkt, maar CSS Scan 2.0 is nog eenvoudiger als u naar CSS wilt kijken. Beweeg over een element en de CSS ervan verschijnt in een pop-upweergave, zodat u de regels met een enkele klik kunt kopiëren. U kunt het gebruiken om bepaalde elementen uit thema's of sjablonen te kopiëren en aan te passen voor uw eigen gebruik, en het is geweldig voor het opsporen van fouten in uw eigen code.
04. Amino
Hier is nog een geweldige CSS-tool. Amino is een live CSS-editor waarmee u style sheets in de browser kunt genereren en deze in realtime op websites kunt toepassen. Hiermee kunt u in feite permanente ontwerpwijzigingen aanbrengen op elke site die u bezoekt, en als u bij Chrome bent aangemeld met uw Google-account, worden de stijlpagina's gesynchroniseerd zodat ze toegankelijk zijn vanuit Chrome op al uw desktopapparaten.
05. Sizzy
Responsive webdesign is tegenwoordig een gegeven, en als je een eenvoudige manier wilt om je ontwerpen in meerdere viewports te controleren, is Sizzy het bekijken waard. Het toont u een interactieve weergave van uw pagina die wordt weergegeven op een aantal verschillende schermformaten van apparaten, en u kunt ook een gesimuleerd apparaattoetsenbord weergeven en verbergen en schakelen tussen staande en liggende modi.
06. Site-palet
De volgende keer dat u een site ziet die veel gebruik maakt van kleur, is hier een eenvoudige manier om hiervan te profiteren. Site Palette extraheert de hoofdkleuren van een website en genereert een deelbaar palet dat je gemakkelijk aan bijdragers kunt laten zien. U kunt ook een Sketch-sjabloon downloaden en er is ook ondersteuning voor Adobe Swatch.
07. Checkbot
Door ervoor te zorgen dat alle links op uw site echt werken, wint u direct aan bruikbaarheid en het is ook een goede manier om uw SEO te verbeteren. Checkbot is een Chrome-extensie die controleert op verbroken links, dubbele titels, omleidingsketens, ongeldige HTML / JS / CSS en meer, zodat u uw site snel kunt controleren op slechte links en deze kunt herstellen.
08. Toby
Het is een algemeen erkende waarheid dat tegen de tijd dat u Chrome een paar uur open heeft gehad, het een verwarrend nest van tabbladen ter grootte van uw pink zal zijn. Toby is een geweldige manier om ze te temmen; Hiermee kun je al die tabbladen ordenen in verzamelingen links als alternatief voor heel veel individuele bladwijzers, waardoor ze veel gemakkelijker te beheren zijn.
09. DomFlags
Versnel de processen van stylingelementen radicaal met DomFlags, een werkelijk geweldige extensie waarmee je sneltoetsen voor DOM-elementen kunt maken. Het is alsof je bladwijzers hebt om door de DOM te navigeren; dit zal de manier waarop u met DevTools werkt, veranderen.
10. Sterk markeerstift
Hier is een interessante manier om mensen bij een discussie te betrekken: hiermee kunt u Highly hoogtepunten uit artikelen op internet delen, zodat u de aandacht kunt vestigen op de belangrijkste stukjes schrijven.
Volgende: 10 extra Chrome-extensies
