Font Awesome: la guida completa della biblioteca

Font Awesome: la guida completa della biblioteca


Icone gratis Font fantastico: cosa è e cosa è usato per. Come collegare le icone al sito. Vantaggi e svantaggi della biblioteca.

Cos'è il font fantastico e cosa è usato per il sito. Benefici della biblioteca.

Set di icone impressionante font: la guida definitiva

Il carattere impressionante è un insieme di caratteri e icone basati su CSS e meno. Lo strumento consente di collegare rapidamente tutti i tipi di icone al sito, migliorando significativamente la sua progettazione e usabilità. È sufficiente inserire alcune linee di codice.

Font Awesome ti offre icone vettoriali scalabili che puoi facilmente personalizzare: dimensioni, colori, ombre e tutto il resto che può essere fatto con CSS.

Font Awesome Library ha una vasta collezione di migliori suggerimenti per te. Migliora il tuo progetto con icone uniche. In effetti, questo è un insieme enorme di tutti i tipi di icone che puoi usare per i tuoi scopi.

In fondawesome, tutte le icone sono assolutamente e completamente gratuite. La biblioteca è concessa con licenza sotto la GNU General Public License. Ciò significa che può essere usato liberamente nei progetti commerciali e, in linea di principio, ovunque.

Il set è stato creato da Dave Gandhi. Comprende icone di social media gratuite, icone per migliorare l'interfaccia utente e altro ancora.

Tipicamente, gli script dei font fantastici dei font vengono utilizzati in combinazione con bootstrap e bootstrapcdn. Il carattere fantastico è il secondo solo per i font di Google in popolarità.

Come funziona

La caratteristica principale è che tutte le fantastiche icone dei font non sono immagini statiche. Sono in formato font. In altre parole, questi sono font di icone. Ad esempio, un'icona di ricerca o un logo di social network è la stessa dei caratteri semplici A, B, c.

Font Icone fantastiche   sono create usando i vettori scalabili. Pertanto, possono essere aumentati a quasi tutte le dimensioni.

Tutte le icone disponibili sono incluse in un file di font. Tutto ciò di cui hai bisogno è scaricare questo file dal sito ufficiale e collegarlo negli stili.

Perché i designer scelgono il carattere fantastico

Il carattere fantastico ha una serie di vantaggi:

  • Connessione veloce. Hai solo bisogno di scaricare un file speciale dal sito ufficiale e collegarlo specificando il percorso nel codice CSS.
  • Flessibilità e scalabilità. Le icone possono essere ingrandite a qualsiasi dimensione. I simboli saranno chiari come il dispositivo consente. Nell'età del design reattivo, questo è importante. A proposito, per la stessa ragione, i font fantastici icone sono adatti per i display Retina.
  • Stilizzazione. Le icone possono essere facilmente modificate in colore, dimensioni, ombre o altri parametri esterni. Il designer ottiene tutti i vantaggi del testo regolare dello stile. Puoi anche ruotare le icone. Ad esempio, visualizzare sottosopra o ruotare di 90 gradi.
  • Caricamento rapido del sito. Tutte le icone sono incluse in un file di font. Quindi ci vuole solo una richiesta HTTP per caricare il carattere fantastico. Questo è ottimo per le prestazioni del sito web.
  • Amore dei browser. Il font Awesome è uno strumento del browser cross-browser. Non devi preoccuparti della compatibilità del browser di font e icone. Sono ben supportati da tutti loro. Anche vecchio IE8.
  • Compatibile con diversi quadri. La biblioteca è stata creata principalmente per Bootstrap. Tuttavia, funzionerà bene con altri quadri.
  • Diversi formati. Lo strumento è disponibile in formati .EOT, .TTF, .Woff e SVG. Quindi il font fantastico è gestito nello stesso modo degli altri font web.
  • Nessun javascript richiesto. Il carattere impressionante non richiede JavaScript per funzionare.

Pertanto, il font fantastico è uno strumento efficace e conveniente che salva in modo significativo il tempo di layout e accelera il tuo sito web.

Svantaggi del font fantastico

Lo strumento ha anche svantaggi. Fortunatamente, non ci sono molti di loro.

Innanzitutto, le icone possono essere dipinte solo in un unico colore. Tuttavia, questa limitazione può essere aggirata. Ad esempio, combinando icone gratuite l'una con l'altra. O usando effetti CSS

In secondo luogo, la fonte Briefesome Library contiene troppe icone e sono tutte incluse in un unico file. Se un designer o un progettista di layout ha bisogno solo di collegare un paio di icone, devono ancora caricare completamente l'intera libreria. E queste sono centinaia di migliaia di icone extra che occuperano spazio. Tuttavia, c'è anche una soluzione - creando il proprio assemblaggio, che includerà solo le icone necessarie.

Font fantastici versioni: 5 e 6

Il font Awesome 5 è stato rilasciato il 7 dicembre 2017 e originariamente conteneva 1278 icone. La quinta versione è disponibile in due pacchetti: GRATUITA (Font GRAZIE GRATIS) e pagato (font Awesome Pro). Il piano gratuito contiene anche icone da tutte le quarte versioni. Le icone sono disponibili sotto la licenza SIL Open Font 1.1, Creative Commons Attribution 4.0 e MIT.

Licenza SIL Open Font (OFL-1.1) | Iniziativa open source.
Creative Commons - Attribution 4.0 International - CC di 4,0
La licenza MIT | Iniziativa open source.

Font Awesome 6 è una nuova versione rilasciata nella seconda metà del 2020. Include nuove icone ed è disponibile solo in un piano a pagamento.

Font Awesome 6 Alpha è anche sulla strada nel 2021. Questa è un'altra nuova generazione della libreria di icone. Oltre alle nuove icone, la versione 6 Alpha aggiunge anche nuovi stili, nuovi servizi e strumenti assistivi. Gli utenti possono pre-ordine.

Piani gratuiti e pagati: differenze e caratteristiche

È possibile scaricare icone gratuitamente o piano tariffario a pagamento.

Il piano gratuito include oltre 1600 icone e 1 set. Un kit è una raccolta di icone, stili e impostazioni che consente di apportare rapidamente modifiche senza aggiungere il codice.

Tariffa a pagamento:

  • Include oltre 7800 icone e 20 set.
  • Fornisce accesso al font Awesome Pro. Ciò significa che le icone possono essere utilizzate nelle applicazioni mobili native e sul computer (ad esempio, in un editor di testo di Word o durante la creazione di una presentazione in PowerPoint).
  • Ti permette di caricare le tue icone. Puoi usare le tue icone a fianco o al posto delle icone ufficiali font fantastiche. Ad esempio, è così che è possibile caricare un logo aziendale. È possibile eseguire le stesse azioni con le tue icone come con quelle di base - cambia lo stile, la dimensione, il colore, ecc.

Entrambe le versioni sono perpetua. Cioè, sono forniti una volta per tutte.

Modi per connettere il font fantastico

Prima di tutto, devi andare al sito ufficiale e scaricare la biblioteca. L'archivio scaricato deve essere disaccordo e le cartelle CSS e Font copiate nella cartella del tuo sito.

Successivamente, il percorso verso il file della libreria è specificato tra i tag della testa. Per esempio:

Come visualizzare le icone fantastiche dei font su un sito web. Metodi più popolari:

1.Usando HTML.

La via più facile.

Devi andare alla galleria sul sito ufficiale (fontawesome.com/icons?d=Gallery) e scegliere l'icona che ti piace. Ogni icona ha un codice personale, ad esempio:. Basta copiarlo e incollarlo nel posto giusto nel codice.

2. VIA CSS.

Per fare ciò, utilizzare i pseudo-elementi dopo o prima, così come l'Unicode dell'icona richiesta. Puoi prendere tutto nella stessa galleria. Un esempio di tale codice: F209.

Un esempio di una voce di file di stile:

Div :: dopo {display: blocco; Contenuto: 'F209'; Font-Family: 'font fantastico 5 gratis';}

In conclusione: tutte le fantastiche icone dei font

Quindi, il font fantastico è un modo veloce e conveniente per aggiungere icone gratuite al tuo sito web. Tutte le icone sono facilmente scalabili e non rallentano il sito.





Commenti (0)

lascia un commento