In questo articolo riprendiamo un argomento introdotto un paio di mesi or sono e che potete rileggere a questo indirizzo e andiamo a vedere alcune estensioni gratuite di Google Chrome, tra le centinaia proposte, che siamo soliti utilizzare nel nostro lavoro di Web Designer.
In primis per poter installare un’estensione dobbiamo conoscerne il nome e ci basta poi richiamarla dal browser e cliccare sul pulsante aggiungi.
Come vediamo in figura l’estensione è già installata nel dispositivo in uso e questo ci viene prontamente segnalato.
Le estensioni installate ci vengono mostrate nell’angolo in alto a destra del nostro browser come vedremo nelle prossime figure.
ColorZilla
La prima che vediamo si chiama ColorZilla ed è piuttosto conosciuta; questa estensione ci permette, una volta attivata, di campionare, copiare e salvare negli appunti i colori direttamente dal client. Se per esempio volessimo sapere che colore blu usa Veneto Formazione nell’angolo a sinistra della hero section in homepage ci basta un semplice click per avere a disposizione esadecimale e rgb.
Questo campione si può puoi tranquillamente richiamare dal pannello Color Picker dell’estensione stessa.
Measurelt
La seconda estensione che proponiamo si chiama Measurelt e ha come unico scopo prendere misure all’interno della pagina web dal client come possiamo vedere nella prossima figura. Utilissima in più occasioni e ve ne renderete conto da soli utilizzandola durante il vostro lavoro.
Awesome Screenshot
Estensione tra le più utili sicuramente a mio avviso è Awesome Screenshot che ci permette di ricavare screenshot di intere pagine o porzioni delle stesse in maniera assolutamente rapida ed efficace pur avendo, ahimè, qualche bug nelle esecuzioni di tanto in tanto che scoprirete durante l’utilizzo. A prescindere rimane un ottimo strumento di lavoro che vi consiglio caldamente.
CSSViewer
Anche se a volte non precisissimo CSSViewer è un ottimo strumento per ricavare informazioni sullo stile di un elemento semplicemente posandocisi sopra con il cursore del mouse. Se per esempio volessi avere delle informazioni sul testo corsi in partenza del nostro sito ufficiale mi basterà passarci sopra come vediamo nella figura successiva
Wappalyzer
Ultima ma non ultima Wappalyzer, estensione in costante aggiornamento, che ci permette di ricavare numerose informazioni sul sito web che stiamo visitando, dal server ai framework o plug-in presenti nello stesso. Queste informazioni possono rivelarsi molto utili per scoprire la tecnologia con cui un sito è stato creato o la piattaforma su cui si appoggia.
Segnalo infine velocemente una piccola estensione molto utile che risponde al nome di New Tab Redirect, che permette di gestire i redirect quando apriamo una nuova scheda, cosa che di default Chrome non permette e l’immancabile Firebug di cui parleremo con più calma, data la sua complessità, in un prossimo articolo.
Non vi rimane che aggiungere queste estensioni al nostro browser e provarle voi stessi. Buon lavoro.
Per scaricare le slide segui questo link.
Ancora nessun commento