Esistono centinaia di estensioni di Google Chrome disponibili per web designer, tutte offrono soluzioni per risparmiare tempo e per risolvere molte delle problematiche di progettazione e sviluppo che si presentano durante la realizzazione di un sito.

Quindi, con tutte queste estensioni disponibili, come si fa a scegliere quella che vi aiuterà di più?

Questo articolo è la parziale traduzione dell’originale pubblicato dal blog di Envato.
1. DomFlags

DomFlags è un’estensione DevTools che permette di creare scorciatoie da tastiera/segnalibri per elementi DOM.

2. Dimensions

Dimensions è un’estensione open source per misurare le dimensioni dello schermo. È uno strumento utile per quando lavori con nuovo mockup; basta aprirlo in Chrome, attivare Dimensions e procedere con la misurazione.

3. 45to75

45to75 è un semplice contatore di caratteri per ottimizzare la linea di lunghezza compresa tra 45 e 75 caratteri, garantendo in tal modo che la lunghezza della riga di testo soddisfi gli standard.

4. Minimalist Markdown Editor

Minimalist Markdown Editor è forse l’editor Markdown più semplice attualmente disponibile per Chrome; consente di visualizzare il markup durante la digitazione e dispone anche di uno strumento di conversione HTML con un solo clic.

5. Corporate Ipsum

Corporate Ipsum è un generatore di “lorem ipsum” diverso: genera un testo casuale in gergo aziendale.

6. Window Resizer

Window Resizer fa esattaemnte quello che ci si aspetta, ridimensiona la finestra del browser al fine di emulare le varie risoluzioni.

7. Octotree

Octotree è un’estensione che permette di visualizzare il codice GitHub in formato albero “facile da navigare”.

8. Sourcegraph

Sourcegraph consente di sfogliare il codice Github.

9. jQuery Audit

jQuery Audit è un’estensione di sviluppo per la verifica delle jQuery.

10. Chrome Logger

Chrome Logger è un’estensione per il debug di applicazioni lato server in Chrome (precedentemente noto come ChromePHP).

11. PHP Console

PHP Console è un’estensione che consente di gestire gli errori e le eccezioni PHP, le variabili di dump ed eseguire da remoto codice PHP.

12. PageEdit

PageEdit permette di modificare rapidamente il markup di qualsiasi pagina trasformando Chrome in un editor HTML ricco di funzioni.

13. LivePage

LivePage ricarica le risorse della tua pagina così come modificati sul server, in modo da visualizzare sempre la versione più recente della pagina.

14. ModHeader

ModHeader è un’estensione che può aggiungere e modificare le richieste HTTP dell’header inviate al server web.

15. fb-flo

Creato dagli sviluppatori di Facebook fb-flo permette di modificare o di provare l’esecuzione di applicazioni web senza dover ricaricare la pagina.

16. EnjoyCSS

EnjoyCSS estensione che permette di accedere a tutti gli strumenti CSS3 a portata di mano.

17. CSS Shapes Editor

CSS Shapes Editor offre controlli per la creazione e l’editing dei CSS Shape values tramite un editor interattivo che si sovrappone l’elemento selezionato.

18. Live CSS Editor

Live CSS Editor è un’estensione che consente di scrivere liberamente le regole CSS in qualsiasi sito e vederne immediatamente i risultati. Ci sono molte estensioni che offrono questo tipo di funzionalità, ma ciò che rende davvero Editor CSS diverso è che si ricorda le tue modifiche CSS ogni volta che si ricarica la pagina.

19. SnappySnippet

SnappySnippet è un’estensione DevTools fantastica che catturerà il CSS e l’HTML da qualsiasi elemento selezionato e con un solo click invierà il codice a uno CodePen, jsFiddle o JS Bin per ulteriori modifiche o prove.

20. Gradient Inspector

Gradient Inspector è una nuova estensione di Rafael Carício che aggiunge una barra laterale agli strumenti di sviluppo di Chrome in grado di mostrare le informazioni sulle sfumature che vengono applicate all’elemento ispezionato.

21. Fontface Ninja

Fontface Ninja è un’estensione interessante che permette non solo di scoprire quali font vengono effettivamente utilizzati su un sito web, ma consente anche di scaricarli. Gli sviluppatori di questa estensione implorano di non abusare delle funzionalità.

22. Type Sample

Type Sample è uno strumento per individuare e testare i webfonts da qualsiasi pagina. È possibile modificare la dimensione, creare il proprio testo e anche salvare il lavoro.

23. WhatFont

Ci sono molti modi per scoprire quale particolare tipo di carattere viene utilizzato in un sito web, ma questa estensione è forse il metodo più semplice. Con WhatFont tutto quello che dovete fare è passare con il mouse sopra il testo e l’estensione ti consente di sapere il nome del font.

24. Google Font Previewer

Google Font Previewer è una comoda estensione che permette di accedere alla directory API di Google Font e scegliete un font, e poi o applicarlo a tutta pagina o un selettore CSS specificato.

25. PageSpeed Insights

PageSpeed Insights è l’estensione ufficiale per Google PageSpeed ​​Insights app. Permette di valutare le prestazioni delle tue pagine web e offre suggerimenti su come migliorarli.

26. Strumenti degni di menzione

Validity – Per validare rapidamente i vostri documenti HTML.
Flat Colors Guide – Un’estensione per l’accesso rapido alle combinazioni di colori piatti.
Web Developer Checklist – Una lista di controllo essenziale per il lancio di un nuovo sito.
IE Tab – Un emulatore utile per testare le pagine in Explorer all’interno di Chrome..
Instant Wireframe – Estensione che permette di visualizzare qualsiasi pagina web come un wireframe.

27. e infine… Website Destroyer

Abbiamo tutti delle giornate pessime. E quando quei giorni cattivi arrivano a volte potrebbe essere necessario qualcosa che vi aiuterà a liberare la frustrazione e la rabbia per quello che non funziona e che ostacola il vostro lavoro. Forse vi occorre Website Destroyer per ricominciare da zer0. Website Destroyer consente di polverizzare qualsiasi sito web utilizzando un enorme arsenale di armi con munizioni illimitate. Munizioni illimitate! È la bomba che serve?.

27. Conclusioni

Come detto in precedenza, ci sono centinaia di estensioni di Google Chrome disponibili che aiuteranno il vostro flusso di progettazione e di sviluppo web. Sicuramente ne manca qualcuna: si accettano segnalazioni e suggerimenti.

Questo articolo è la parziale traduzione dell’originale pubblicato dal blog di Envato.
©Envato | 2014