Come trovare il carattere di una pagina Web utilizzando lo strumento Inspect Element e le estensioni del browser

Il successo del tuo sito web dipende molto dal suo aspetto. Avere la giusta combinazione di colori e il tema manterrà i tuoi visitatori sul tuo sito un po' più a lungo. Oltre alla tavolozza dei colori e alla struttura del tuo sito, anche il carattere che scegli svolge un ruolo essenziale nel mantenere il pubblico coinvolto.

Forse ti imbatti in un sito interessante mentre navighi sul Web e vuoi sapere quali caratteri sta utilizzando. Con le estensioni online e lo strumento Inspect Element integrato nel tuo browser, identificare un font è facile e veloce.

Nel caso non lo sapessi, lo strumento Inspect Element integrato nel tuo browser ti consente di esaminare il codice sorgente di un sito web. Puoi comprendere gli elementi di progettazione di un sito esaminando i suoi CSS, HTML e altre informazioni. È un ottimo modo per trarre ispirazione quando si progetta il proprio sito.

Il processo di identificazione di un font utilizzando lo strumento Inspect Element è abbastanza semplice e non avrai bisogno di alcuna abilità di codifica. Questo strumento è disponibile in tutti i browser sul mercato e ognuno ha un layout simile.

Ecco come identificare un carattere utilizzando lo strumento di ispezione del browser.

1. Apri il sito web che desideri utilizzare.
2. Evidenzia il testo con il carattere che desideri identificare e fai clic con il pulsante destro del mouse.
3. Clicca su Ispezionare dal menu contestuale.
4. Quando si apre il menu Ispeziona, fare clic su calcolato.
5. Scorri verso il basso per trovare il Famiglia di font sezione. Qui puoi trovare il nome e lo stile del carattere, nonché le sue dimensioni.

Se desideri un modo più rapido per trovare il carattere di un sito utilizzando lo strumento Ispeziona, prova invece questo:

1. Apri il sito web che desideri utilizzare.
2. stampa Ctrl + Maiusc + C (Cmd + Maiusc + C su Mac).
3. Passa il mouse sul testo per visualizzare lo stile del carattere, la dimensione, il codice colore e il margine.

Puoi anche controllare l'elenco dei caratteri utilizzati in una pagina Web utilizzando lo strumento Ispeziona. Ecco come farlo:

1. Vai alla pagina web.
2. Apri il codice sorgente premendo Ctrl + Maiusc + I (Cmd + Maiusc + I su Mac).
3. Clicca il Rete scheda, quindi selezionare Font scheda.
4. Qui vedrai un elenco di tutti i caratteri utilizzati nella pagina web.

Per ottenere l'elenco di tutti i caratteri in tempo reale, potrebbe essere necessario aggiornare la pagina web.

Relazionato: Come aumentare o diminuire la dimensione del carattere in Firefox

Come identificare i caratteri utilizzando le estensioni del browser

Se desideri un modo più comodo per identificare un carattere, potresti voler installare un'estensione del browser per la ricerca dei caratteri. Sebbene ci siano diverse estensioni del browser che possono aiutare a rilevare i caratteri sul Web, le due più popolari sono WhatFont e Trova font.

Diamo un'occhiata al processo di identificazione dei caratteri utilizzando entrambe le estensioni.

1. WhatFont

WhatFont è molto popolare per rilevare rapidamente più caratteri contemporaneamente. Ecco come utilizzare questo strumento.

1. Quando WhatFont è abilitato nel tuo browser, passa il mouse sul testo per mostrarne il carattere.
2. Dopo aver fatto clic sul testo, verrà visualizzata una finestra popup con il resto dei dettagli del carattere, come la dimensione, il colore e lo stile del carattere.
3. Inoltre, puoi selezionare più sezioni di testo contemporaneamente per confrontare diversi tipi di carattere sulla stessa pagina.

Scarica: Per quale tipo di carattere Cromo | Firefox | Safari (Gratuito)

2. Trova font

Font Finder mostra anche i dettagli del carattere quando passi con il mouse su qualsiasi testo su un sito web. Tuttavia, fornisce molti dettagli tecnici, quindi può creare un po' di confusione se non si ha familiarità con il web design.

Detto questo, Font Finder è più adatto agli sviluppatori web che desiderano sostituire i caratteri esistenti con quelli nuovi in ​​tempo reale. Ciò semplifica il test dei caratteri prima di apportare modifiche permanenti.

Ecco come testare un font usando Font Finder:

1. Evidenzia una porzione di testo dalla pagina web.
2. Fare clic destro su di esso e selezionare Trova font dal menu contestuale.
3. Selezionare Sostituisci carattere con e inserisci il nome del carattere. Aggiungiamo Calibri e guarda come cambia il carattere nell'anteprima.
4. Se vuoi ripristinare il carattere, aggiorna la pagina.

Scarica: FontFinder per Cromo | Bordo | Firefox (Gratuito)

Che ne dici di controllare il carattere in un'immagine?

Se desideri identificare i caratteri in un'immagine, le estensioni del browser e lo strumento di ispezione del browser potrebbero non essere d'aiuto. Tuttavia, puoi provare strumenti di ispezione delle immagini online come Che cosa è?, CarattereScoiattolo, Fontspring, WhatTheFont, e molti altri.

Il processo per identificare un font da un'immagine è in gran parte lo stesso in tutti gli strumenti. Proviamo a identificare il carattere in un'immagine utilizzando WhatTheFont.

1. Se non l'hai già fatto, scarica l'immagine che desideri utilizzare.
2. Importa l'immagine in WhatTheFont.
3. WhatTheFont rileverà automaticamente il testo nella tua immagine. Riduci o ingrandisci la casella di ritaglio in modo che racchiuda il carattere che desideri identificare. Colpire il pulsante freccia Al termine.
4. WhatTheFont abbinerà quindi il carattere nell'immagine con i caratteri nella sua galleria e ti mostrerà i caratteri strettamente correlati.
5. Se non trovi subito una buona corrispondenza, puoi continuare a fare clic Mostra più risultati per vedere altri tipi di carattere correlati.

Relazionato: I migliori siti web di font gratuiti per font gratuiti online

Rileva i caratteri dal Web e usali nei tuoi progetti

I caratteri svolgono un ruolo significativo nel successo di un sito Web o di un progetto grafico. Se ti imbatti in un font accattivante durante la navigazione sul Web, puoi facilmente rilevarlo utilizzando i metodi sopra.

WhatTheFont e 4 alternative per trovare i caratteri dalle immagini

Vuoi trovare i caratteri dalle immagini? Esistono strumenti online che possono farlo per te, tra cui WhatTheFont e varie alternative.

Leggi Avanti

Circa l'autore