7 suggerimenti di esperti sull'icona Web impostano l'utilizzo e i vantaggi

Ti stai chiedendo di utilizzare un'icona impostata per il tuo sito Web e quale scegliere? Questi suggerimenti di esperti potrebbero solo convincerti di ciò che molti sviluppatori web professionisti già sanno: è molto più semplice cercare icone da un set di icone incluso, piuttosto che trovare le icone una per una e trovare un modo per renderle in qualche modo coerenti insieme.

Abbiamo chiesto alla community i migliori consigli sull'uso dei set di icone e molti di loro concordano sull'uso del famoso set di icone Font Awesome, ma non è l'unico set di icone disponibile sul mercato.

Quale set di icone stai usando? Fatecelo sapere nei commenti!

 Stai utilizzando un'icona specifica impostata per il tuo sito Web? Stai usando Font Awesome per un uso specifico (ad es. Con Shopify, per una newsletter, ...)? In tal caso, perché lo stai usando e qual è la tua esperienza con il set di icone? Hai usato il loro CDN, hai notato qualche miglioramento per il tuo utilizzo?

Jeff Roscher: aggiunge uno stile semplice e piacevole che i clienti trovano moderno e accattivante

Usiamo Font Awesome su eWorkOrders.com. Fa parte del nostro sito di marketing e del nostro software as a service (SAAS), un sistema computerizzato di gestione della manutenzione (CMMS). Sul nostro sito di marketing, aggiunge uno stile semplice e piacevole che i potenziali clienti trovano moderno e accattivante. Abbiamo aggiunto bordi interessanti ed eventi mouseover per renderli più interattivi ed emozionanti. Per i nostri clienti, le icone Font Awesome sono utilizzate come segnale visivo all'interno dei campi di input per aiutare a identificare il tipo di dati da inserire, come un'icona del calendario in un campo data, una busta in un campo dell'indirizzo e-mail o un'icona del telefono in un campo per un numero di telefono. Sono utilizzati su pulsanti funzionali, come modifica, copia e stampa.

Le icone vengono utilizzate per fornire informazioni visive rapide sui dati come un'icona esclamativa rossa accanto a un ordine di lavoro scaduto o quando qualcosa richiede attenzione. Sono in pochi altri posti anche solo per rendere il programma più bello ..

Font Awesome è stato fantastico! Il loro CDN è veloce e ci sono molte opzioni per ogni diverso tipo di icona di cui abbiamo bisogno. Non siamo mai stati delusi.

Jeff è il presidente di eWorkOrders.com. eWorkOrders è un CMMS basato sul Web facile da usare che aiuta i clienti a gestire richieste di assistenza, ordini di lavoro, risorse, manutenzione preventiva e altro ancora.
Jeff è il presidente di eWorkOrders.com. eWorkOrders è un CMMS basato sul Web facile da usare che aiuta i clienti a gestire richieste di assistenza, ordini di lavoro, risorse, manutenzione preventiva e altro ancora.

Rachel Foley: un modo economico per accedere facilmente a una vasta libreria di icone

In Map My Clienti, facciamo affidamento su Font Awesome per la nostra iconografia su tutti i canali di marketing e sui nostri prodotti, tra cui:

  • Sito web
  • Messaggi di posta elettronica
  • Social media
  • Grafica personalizzata
  • App mobile
  • App Web

Usiamo Font Awesome perché è un modo conveniente per accedere a una vasta libreria di icone con facilità. Lo stile è più sul lato ludico che si allinea al nostro marchio; inoltre, la possibilità per noi di utilizzare pesi e stili di icone diversi ci dà la libertà.

Usiamo il CDN per le nostre applicazioni che consente un'esperienza molto coerente nell'intera esperienza utente del prodotto. Inoltre, è super semplice aggiornarlo quando è necessario. Con i materiali di marketing, siamo un po 'più flessibili e utilizziamo una miscela di CDN, la nostra installazione locale e le versioni vettoriali.

La FA è sempre stata affidabile per noi da quando abbiamo adottato completamente a gennaio.

Rachel è una web designer con sede a New York e professionista del content marketing con l'obiettivo di migliorare i marchi B2B in crescita e costruire il successo del marketing a lungo termine attraverso la strategia SEO. Attualmente è presso Mappa i miei clienti, una società di software di vendita B2B che crea soluzioni per i team di vendita sul campo.
Rachel è una web designer con sede a New York e professionista del content marketing con l'obiettivo di migliorare i marchi B2B in crescita e costruire il successo del marketing a lungo termine attraverso la strategia SEO. Attualmente è presso Mappa i miei clienti, una società di software di vendita B2B che crea soluzioni per i team di vendita sul campo.

Andrew Ruditser: come Font Awesome aggiornato, anche noi

Font Awesome is used on all our sites since the dawn of time. When we first started working with Font Awesome, it was mainly used for their Social media Icons. As Font Awesome upgraded, so did we. Not only are their phone icons fantastic, we enjoy the comical icons that they offer. As of recent, Font Awesome announced their version 6 icons. To us, this shows that Font Awesome cares for their users, and want to keep their system up to date with recent code.

Font Awesome ora offre una vasta gamma di icone tra cui scegliere. Riteniamo che questa flessibilità ci sia utile dalla fase di progettazione alla fase di sviluppo. Per Font Awesome, la loro piattaforma offre due opzioni per i loro utenti. The First Options è un servizio gratuito che offre 1.588 icone gratuite tra cui scegliere. La seconda opzione è un abbonamento Pro, che offre 7.842 icone. Questa azienda ha anche quello che chiamiamo un cheat sheet Icon. Questo elenco mostra tutte le loro icone offerte da Font Awesome, che ci informano se fanno parte del pacchetto gratuito o del pacchetto pro.

Per aggiungere, Font Awesome offre anche un'opzione per estrarre il loro codice dalla loro CDN. Consigliamo vivamente di seguire il loro percorso. Il loro CDN ha un tempo di risposta rapido e non abbiamo quasi nessun ritardo tra il nostro sito e la loro piattaforma.

Andrew Ruditser, coordinatore tecnologico capo
Andrew Ruditser, coordinatore tecnologico capo

Jeff Romero: rende la velocità della pagina molto più veloce

Sviluppiamo siti Web personalizzati su Wordpress per clienti aziendali di piccole e medie dimensioni. Abbiamo storicamente usato immagini per rappresentare varie icone sui nostri siti Web che vanno dai profili dei social media alle icone di telefono ed e-mail. Il processo per utilizzare un'immagine per le icone richiede di trovare un set coerente di icone, caricarle e quindi ridimensionarle per assicurarsi che si adattino al sito.

Sebbene sia un piccolo file di immagine, è un po 'un processo per ottenere un set coerente di icone e farle corrispondere al modello del sito. Ora, usando Font Awesome e il suo plugin Wordpress, possiamo sostituire le icone con un set coerente di media che richiede semplicemente di copiare / incollare una riga di HTML. Ancora meglio, le icone possono essere ridimensionate con una piccola quantità di CSS (usando la proprietà size-font). Le icone vengono visualizzate meglio di un'icona basata su immagini e sono chiaramente visibili sui dispositivi mobili. Infine, poiché è una linea di HTML piuttosto che un file di immagine, rende la velocità della pagina molto più veloce.

Jeff Romero è il co-fondatore di Octiv Digital, un'agenzia di marketing digitale specializzata in strategia SEO locale e aziendale, gestione della pubblicità pay-per-click, web design / sviluppo e servizi di analisi di marketing.
Jeff Romero è il co-fondatore di Octiv Digital, un'agenzia di marketing digitale specializzata in strategia SEO locale e aziendale, gestione della pubblicità pay-per-click, web design / sviluppo e servizi di analisi di marketing.

Vance: particolarmente buono quando non hai un designer nella tua squadra

Come sviluppatore web, utilizzo Font Awesome come soluzione rapida per molte icone carine. Detto questo, Font Awesome è particolarmente utile quando non hai un designer nel tuo team di sviluppo. È utile per lo sviluppo di plug-in Wordpress perché gli sviluppatori potrebbero incorporarli nei loro plug-in usando i CDN di Font Awesome in pochissimo tempo.

La mia esperienza con Font Awesome è stata buona finora. Ma ciò non significa che non abbia alcun inconveniente. Uno degli ovvi inconvenienti è la velocità di caricamento della pagina (prestazioni). Poiché è una soluzione rapida, devi incorporare un intero set di icone anche se usi solo alcune icone. Ciò potrebbe ridurre la velocità di caricamento del sito Web e i punteggi di Google Page Speed ​​(PSI).

Vance, uno sviluppatore web e un proprietario web.
Vance, uno sviluppatore web e un proprietario web.

Sunny Ashley: semplice, pulito e immediatamente riconoscibile per i nuovi visitatori

Utilizziamo le icone Font Awesome nel nostro piè di pagina del sito Web. In particolare, utilizziamo le icone di Facebook, Twitter e LinkedIn per fare riferimento ai nostri canali di social media. Sono semplici, puliti e immediatamente riconoscibili per i nuovi visitatori. Come altri utenti di Font Awesome sanno, erano anche molto veloci e facili da configurare.

Sunny Ashley, fondatore e CEO di Autoshopinvoice. Autoshopinvoice fornisce software di gestione dei negozi per autofficine e garage indipendenti.
Sunny Ashley, fondatore e CEO di Autoshopinvoice. Autoshopinvoice fornisce software di gestione dei negozi per autofficine e garage indipendenti.

Burak Özdemir: le icone piuma non causano una dimensione DOM eccessiva

Feather Icons è una raccolta di icone open source leggibili e visivamente gradevoli progettate e gestite da Cole Bemis. A partire da giugno 2020, ci sono più di 280 icone disponibili. Tutte le icone fornite da Feather Icons hanno la licenza MIT e possono essere scaricate separatamente come file SVG. È possibile personalizzare la dimensione dell'icona, il colore del tratto dell'icona e la larghezza del tratto sul sito Web dell'icona piuma prima di scaricarli.

Feather Icons può essere un'ottima scelta per il tuo sito Web o progetto se sei uno sviluppatore o sai come gestire alcune attività front-end di base. Poiché queste icone leggere possono anche essere visualizzate con una libreria JavaScript modulare, non causano una dimensione DOM eccessiva, una metrica che può danneggiare le prestazioni della tua pagina web. Pertanto, con l'utilizzo di Feather Icons, è possibile ridurre la velocità di caricamento della pagina più rispetto ad altri pacchetti disponibili sul mercato. L'unico aspetto negativo dell'utilizzo di questo set di icone è che non è possibile trovare la maggior parte delle icone del marchio.

Icone di piume
Burak Özdemir è uno sviluppatore web dalla Turchia. È specializzato nella creazione di applicazioni basate sul Web.
Burak Özdemir è uno sviluppatore web dalla Turchia. È specializzato nella creazione di applicazioni basate sul Web.

Michel Pinson
Circa l'autore - Michel Pinson
Michel Pinson è un appassionato di viaggi e un creatore di contenuti. Unendo la passione per l'educazione e l'esplorazione, è stato commesso a condividere le conoscenze e ispirare gli altri attraverso un accattivante contenuto educativo. Avvicinando il mondo a dare potere alle persone con competenza globale e un senso di voglia di viaggiare.




Commenti (0)

lascia un commento