6 componenti aggiuntivi essenziali per Firefox per i progettisti
Come webdesigner (e utente tecnologicamente esperto di Internet), non ci sono scuse per non utilizzare Firefox come browser web principale. Se non stai ancora utilizzando Firefox, devi andare e Scaricare è proprio ora. Firefox non solo fornisce un'esperienza di navigazione in Internet all'avanguardia, ma fornisce anche una quantità infinita di funzionalità che non troverete in nessun altro browser Internet.
Poiché terze parti possono sviluppare componenti aggiuntivi per Firefox, scaricando i migliori componenti aggiuntivi disponibili, è possibile trasformare Firefox in uno strumento che aumenta notevolmente la produttività e consente di risparmiare un numero illimitato di tempo. Dal momento che ci sono tanti diversi add-on disponibili per il download, può essere un po 'opprimente scegliere quelli che dovresti usare.
Pertanto, ho deciso di fare tutto il legwork per te e compilare un elenco dei sei migliori componenti aggiuntivi di Firefox per i web designer.
Sviluppatore web
Sebbene sia chiamato Sviluppatore web , questo componente aggiuntivo di Firefox è assolutamente inestimabile per i web designer. Se stavi solo scaricando e installando un componente aggiuntivo per Firefox, questo è quello che ti consiglierei. Il motivo è che questo componente aggiuntivo offre una varietà di funzioni utili diverse e potrebbe essere classificato come componente aggiuntivo dell'esercito svizzero di Firefox .
La prima caratteristica di questo componente aggiuntivo che i designer troveranno utile è il menu CSS . Le caratteristiche di questo menu includono la possibilità di disabilitare gli stili, visualizzare i CSS per tipo di media, visualizzare CSS, visualizzare le informazioni di stile, aggiungere un foglio di stile utente personalizzato o modificare direttamente CSS .
La prossima caratteristica di interesse per i designer è il menu Immagine . Oltre a consentire di visualizzare gli attributi ALT, le dimensioni dell'immagine, le dimensioni dei file immagine e i percorsi delle immagini, è possibile disabilitare le immagini, trovare immagini rotte, rappresentare immagini, sostituire le immagini con attributi ALT e diverse funzioni aggiuntive.
Sebbene potrei dedicare diverse pagine a tutte le funzionalità offerte da questo componente aggiuntivo, voglio solo toccare alcune altre funzioni che i web designer troveranno particolarmente utili. Questi includono la capacità di delineare diversi elementi (che vanno dai frame agli elementi a livello di blocco), modificare HTML e mostrare elementi nascosti .
Firebug
Mentre Web Developer è il primo componente aggiuntivo che consiglierei a qualsiasi designer, Firebug si chiude secondo in termini di utilità per i progettisti.
Con Firebug, ti viene immediatamente data la possibilità di modificare, eseguire il debug o monitorare qualsiasi pagina web . Firebug ti dà il pieno controllo su CSS, HTML e JavaScript di qualunque pagina tu scelga. La cosa migliore è che ogni modifica apportata viene eseguita dal vivo e istantaneamente , in modo da poter testare rapidamente i diversi cambiamenti e vedere immediatamente i risultati di tali modifiche.
Come la maggior parte dei migliori componenti aggiuntivi per Firefox, Firebug va oltre le sue funzionalità di base e offre una vasta gamma di opzioni che rendono facile per qualsiasi utente personalizzare completamente il loro uso di questo componente aggiuntivo. Alcune delle funzionalità e opzioni aggiuntive offerte da Firebug includono le scorciatoie da tastiera, la possibilità di controllare come e dove appare l'area di editing di Firebug, le guide visive per la modifica dei CSS, l'analisi delle attività di rete e la registrazione personalizzabile per JavaScript .
ColorZilla
Come web designer, non sai mai quando l'ispirazione ti colpirà mentre navighi su Internet. Ad esempio, potresti guardare un sito Web e trovare un colore che ti piace davvero.
Se si desidera un modo rapido ed efficiente per essere in grado di scoprire l'esatto valore HSV e RGB per quello strumento, è necessario installare il file ColorZilla Aggiungi su.
Il componente aggiuntivo ColorZilla presenta un contagocce online , che rende abbastanza semplice ottenere il valore esatto di un colore specifico. Oltre al eyedropper online, ColorZilla offre diverse funzionalità aggiuntive che la maggior parte dei web designer troverà utili come un analizzatore di colori DOM e un visualizzatore di palette online . L'analizzatore di colori DOM consente di individuare elementi sulla pagina che corrispondono a un determinato colore e scoprire le regole CSS che specificano un determinato colore, mentre il visualizzatore di palette online consente di aggiungere e condividere le tavolozze di colori che si desidera.
FireShot
Sebbene il tuo sistema operativo abbia indubbiamente una funzione di cattura dello schermo incorporata, ciò non significa che l'acquisizione di schermate predefinita abbia tutte le funzionalità di cui potresti aver bisogno.
Ad esempio, la cattura dello schermo di default del tuo sistema operativo può catturare porzioni di una pagina Web al di fuori della finestra del browser?
Nella maggior parte dei casi, la risposta a questa domanda sarà no. Fortunatamente, esiste un componente aggiuntivo per Firefox che offre questa funzionalità, oltre a una serie di altre utili funzioni.
FireShot è un add-on avanzato per la cattura dello schermo per Firefox . Oltre a darti la possibilità di catturare un'intera pagina web (anche quando ci sono porzioni della pagina web che non sono visibili a causa dei vincoli della finestra del browser), FireShot ti consente anche di aggiungere annotazioni direttamente al tuo cattura dello schermo.
FireShot ti offre diverse opzioni per gestire le catture dello schermo. Non solo possono essere salvati in una varietà di formati di file, ma possono anche essere salvati sul computer, inviati via email ad altri o salvati sul server di hosting gratuito di FireShot. Come risultato della sua vasta gamma di funzionalità, questo componente aggiuntivo ha attratto oltre centocinquantamila utenti attivi e si è dimostrato prezioso per i web designer e altri professionisti di Internet.
Validatore CSS / Validatore HTML
Come designer, vuoi essere sicuro che tutto il tuo duro lavoro sia facilmente accessibile ai visitatori e visualizzato correttamente. Uno dei modi più semplici per garantire che entrambe queste attività vengano eseguite è la convalida di tutto il codice .
Sebbene siano due componenti aggiuntivi separati, sia il Validator CSS che il Validator HTML dovrebbero essere installati nel browser di qualsiasi web designer. Una volta installati i componenti aggiuntivi, il Validatore CSS è possibile accedere dal menu Strumenti, mentre è possibile accedere al Validatore HTML dalla barra di stato di Firefox.
Ciascuno dei componenti aggiuntivi convalida il codice con gli standard W3C appropriati . Mentre il validatore CSS esegue semplicemente una convalida standard del codice, HTML Validator fornisce alcune funzionalità aggiuntive.
Quando si utilizza il Validatore HTML, è possibile scegliere di convalidare direttamente nel browser (dove vengono visualizzati eventuali errori come icona della barra di stato), mostrare la fonte con le spiegazioni degli errori dopo la convalida o una convalida con le soluzioni proposte per eventuali errori.
Browser Window Resizer
Come qualcuno che crea progetti per Internet, uno dei problemi più frustranti che si incontrano senza dubbio è la creazione di progetti che funzionano su una varietà di dimensioni dello schermo.
Poiché non sai se un visitatore visualizzerà il tuo lavoro a 640 × 480, 800 × 600, 1024 × 768, 1280 × 1024 o 1600 × 1200, è tua responsabilità creare disegni che funzionino con tutte queste risoluzioni .
Mentre ci sono una varietà di modi per visualizzare il tuo lavoro a risoluzioni diverse, ho trovato che il browser Componente aggiuntivo Window Resizer è il modo più efficiente per eseguire questo compito. Una volta scaricato e installato questo componente aggiuntivo, sarai in grado di ridimensionare immediatamente la finestra del browser su una delle risoluzioni standard elencate sopra.
Ciò ti consentirà di vedere se il tuo design avrà un bell'aspetto per i visitatori che non utilizzano la tua stessa risoluzione. La cosa migliore di questo componente aggiuntivo è che se lo si utilizza in combinazione con gli altri componenti aggiuntivi in questo elenco (in particolare Firebug), quando si vede che qualcosa non viene visualizzato correttamente, è possibile apportare immediatamente modifiche al codice e vedere se questo risolve il problema, il tutto senza mai lasciare la finestra del browser corrente.
Conosci altre buone estensioni per i designer? Sentiti libero di commentare e lasciaci un feedback.