Fonts Web Safe in CSS | Spiegato

I caratteri funzionano come marchi di qualsiasi sito Web in quanto questi caratteri forniscono uno splendido aspetto visivo a qualsiasi sito Web. C'è sempre una prospettiva che i caratteri che funzionano magnificamente su una piattaforma/dispositivo potrebbero non essere efficaci per altre piattaforme. Pertanto, i caratteri Web-Safe sono sempre la prima scelta dello sviluppatore.

I caratteri che sono accessibili a quasi tutti i dispositivi e supportati dalla maggior parte dei browser sono indicati come caratteri Web-Safe. Questi caratteri sono installati a livello globale su tutti i browser e dispositivi. Questo articolo presenterà alcuni caratteri notevoli di Web-Safe insieme alle loro famiglie di carattere generici:

• Serif (Times New Roman, Georgia)
• Sans-serif (Arial, Calibri, Helvetica)
• Corsivo (Script mt)
• Monospaziale (Corriere)

Quindi iniziamo!

Serif

I caratteri che appartengono alla famiglia Serif hanno piccoli colpi decorativi ai margini della lettera.

Times New Roman

Un carattere estremamente popolare che appartiene alla famiglia Serif ed è usato come carattere principale per le applicazioni Windows. È più comunemente usato nella tesi di ricerca, articoli e media stampati come i giornali.

Esempio

Lo snippet di seguito ti permetterà di capire come utilizzare il nuovo carattere romano in HTML/CSS

Html

Un esempio di volte nuovi caratteri romani

CSS

P
Font-Family: "Times New Roman", Serif;

Il seguente sarà l'output risultante per lo snippet sopra:

Georgia

È un carattere elegante che appartiene alla famiglia Serif ed è molto leggibile a varie dimensioni dei caratteri, quindi, considerata l'opzione perfetta per i progetti mobili reattivi:

Html

Un esempio di caratteri Georgia

CSS

P
Font-Family: Georgia, Serif;

Lo snippet di codice sopra mostra il seguente output:

Sans-serif

A differenza dei caratteri serif, non hanno alcun colpo invece questi caratteri sono lettere semplici. I caratteri SAN-Serif sono considerati come facilmente leggibili caratteri rispetto a qualsiasi altra famiglia di caratteri.

Arial

I caratteri ariali e i loro familiari sono considerati i caratteri web più sicuri e il motivo dietro è molto semplice i.e. I caratteri Arial sono facilmente disponibili su tutte le piattaforme/sistemi operativi.

Esempio

Considera il pezzo di codice di seguito che descrive come sembrano i caratteri Arial:

Html

Un esempio di caratteri Arial

CSS

P
Font-Family: Arial, sans-serif;

Nel codice di cui sopra, scriviamo "san-serif" come fallback perché nessun carattere è al cento per cento. Il seguito sarà il risultato per il codice sopra:

Helvetica

È uno dei caratteri più comunemente usati che appartengono alla famiglia sans-serif. È considerato il carattere commerciale ed è molto popolare tra i designer:

Html

Un esempio di caratteri Helvetica

CSS

P
Font-Family: Helvetica, sans-serif;

Snippet sopra dato mostra il seguente risultato:

Calibri

È il carattere Microsoft standard dal rilascio di MS Office 2007 e ha un aspetto molto elegante.

Html

lt; p> un esempio di caratteri calibri

CSS

P
Font-Family: Calibri, sans-serif;

Lo snippet di codice sopra produce il seguente risultato:

Script Mt

È uno dei caratteri più popolari della famiglia corsiva ed è molto simile alla calligrafia umana

Html

Un esempio di caratteri di script mt

CSS

P
Font-Family: 'Script Mt', corsivo;

L'output dello snippet di codice sopra apparirà così:

Courier New

È un carattere molto comunemente usato della famiglia monospaziale che è principalmente utilizzato per mostrare i codici di programmazione e oltre a questa maggior parte delle e -mail usate il corriere nuovo come carattere predefinito.

Html

Un esempio di caratteri di script mt

CSS

P
Font-Family: "Courier New", Monospace;

Lo snippet di cui sopra genera il seguente output:

Conclusione

I caratteri Web-Safe sono caratteri universalmente installati e possono essere visualizzati in modo sicuro su qualsiasi dispositivo. Esistono numerosi caratteri Web-Safe da Sans-Serif, Serif, Monospace e Cursive Family disponibili su quasi tutti i dispositivi. In questo articolo, abbiamo appreso di alcuni caratteri di sicurezza web ampiamente utilizzati ed eseguito un'implementazione pratica di questi caratteri in vari campi.