Cum să vedeți ce font utilizează un site web

Dacă ați fost vreodată complet luat cu un font pe care l-ați văzut pe un site web, este posibil să vă fi întrebat cum să descoperiți cum se numește, astfel încât să îl puteți folosi în propriul dvs. conținut. Tipografia de calitate poate îmbunătăți experiențele de lectură ale vizitatorilor dvs., deci ar putea merita să faceți un efort pentru ao găsi. Indiferent de motivul pentru care verificați ce font este utilizat pe un site web, există multe instrumente care vă pot ajuta.

În acest articol, vom discuta de ce ați putea dori să vedeți ce font utilizează un site web. De asemenea, vă vom arăta cum să faceți acest lucru.

Să începem!

Abonați-vă la canalul nostru Youtube

De ce ați putea dori să verificați ce font utilizează un site web

După cum am menționat deja, fonturile frumoase și lizibile pot îmbunătăți experiența utilizatorului (UX) și lizibilitatea site-ului dvs. De asemenea, se asigură că vizitatorii se pot angaja confortabil cu conținutul dvs. fără a se lupta să-l descifreze. Dacă textul dvs. este elegant, dar ilizibil, cititorilor le va fi greu să înțeleagă sau să aprecieze materialul dvs.

Butoanele de îndemn (CTA) se pot dovedi, de asemenea, inutile, dacă textul lor nu poate fi citit. Acesta este motivul pentru care s-ar putea să vă fie de folos să păstrați o listă de fonturi care vă atrag atenția pentru că sunt atât elegante cât și lizibile. Apoi le puteți utiliza pe site-ul dvs. sau pentru un client în viitor.

Cum să vedeți ce font utilizează un site web (3 metode disponibile)

Există mai multe metode pe care le puteți utiliza pentru a verifica ce font utilizează un site web. Funcția de inspecție a browserului dvs. este o soluție excelentă, dar există extensii care pot produce efecte echivalente. Puteți găsi chiar fonturi din imagini folosind instrumente online. Să aruncăm o privire la fiecare dintre aceste opțiuni.

1. Identificați fonturile utilizând instrumentul Browser Inspector

Unul dintre cele mai simple moduri de a verifica ce font utilizează un site web este cu instrumentul de inspecție al browserului. Deși vom lucra cu Chrome Inspector în acest exemplu, merită menționat faptul că alte browsere au funcții echivalente.

Mai întâi, faceți clic dreapta pe pagina web care conține fontul pe care doriți să îl găsiți. Din meniul rezultat, selectați Inspectați:

Dacă preferați să utilizați o comandă rapidă de la tastatură, încercați Ctrl + Shift + I pentru Windows sau Linux. Dacă utilizați un Mac, echivalentul este Cmd + Shift + I.

În fereastra din partea dreaptă a ecranului, căutați textul folosind fontul pe care doriți să îl verificați. Va fi evidențiat când selectați elementul HTML corespunzător:

Apoi, faceți clic pe fila Calculat și căutați „font-family”:

Ar trebui să vedeți numele fontului și stilul acestuia listate aici.

Pentru a vedea CSS-ul legat de font, căutați sub fila Stiluri . Puteți derula pentru a căuta valori legate de font. Cu toate acestea, deoarece ar putea exista suprascrieri și reguli de stil irelevante aici, fila Calculat este de obicei mai utilă.

2. Găsiți fonturi printr-o extensie de browser

Extensiile pentru browser pot oferi o modalitate mai simplă de a găsi detalii despre fonturi pe un site web, mai ales dacă nu vă simțiți confortabil cu inspectorul. În plus, de obicei pot oferi răspunsul pe care îl căutați mai repede, astfel încât să puteți reveni la sarcina pe care o aveți.

Unele astfel de suplimente includ:

• Fontanello: gratuită, această extensie vă permite să găsiți numele, greutatea, stilul fontului și mai simplu evidențiind și făcând clic dreapta pe acesta în timp ce navigați.
• WhatFont: eficientizarea detecției fontului și mai mult, WhatFont vă permite să vizualizați numele unui tip de literă doar trecând deasupra acestuia.
• CSS Peeper: Creată pentru designerii web, această extensie este puțin mai robustă și vă poate oferi detalii suplimentare din codul CSS al paginii web.

Cu toate acestea, fiecare dintre aceste extensii are suport de browser variat. WhatFont este disponibil pentru Firefox, Chrome, Safari și Internet Explorer. Fontanello, pe de altă parte, este disponibil numai pentru Firefox și Chrome. CSS Peeper este un instrument specific Chrome, pe care nu îl veți putea folosi cu nicio altă platformă.

Pentru a găsi rapid numele unui anumit font, WhatFont este cea mai ușoară opțiune de utilizat. Deoarece are și suport pentru majoritatea browserelor, îl vom folosi pentru o demonstrație rapidă.

Odată ce ați instalat WhatFont, puteți verifica ce font utilizează un site web activându-l în bara de instrumente a browserului dvs. și trecând pe un anumit text:

Când plasați cursorul peste text, veți vedea doar numele fontului. Cu toate acestea, făcând clic pe nume vă va afișa un popup extins cu mai multe detalii, cum ar fi dimensiunea, greutatea, culoarea și înălțimea liniei. De asemenea, poate identifica dacă un tip de caractere este disponibil prin Typekit sau Google Fonts.

După ce ați terminat verificarea detaliilor fontului, puteți ieși din instrument folosind butonul Exit WhatFont din colțul din dreapta sus al ferestrei browserului.

3. Detectați fonturi în imagini

În cele din urmă, puteți încerca, de asemenea, să vizualizați fonturile utilizate în imagini. Aceasta include tipuri de caractere pe care le-ați văzut în sigle sau infografii. Din experiența noastră cu detectoarele de fonturi, WhatTheFont este cel mai eficient instrument online pentru acest job.

Pentru a utiliza WhatTheFont, va trebui să încărcați imaginea în cauză și să selectați secțiunea cu fontul relevant:

Apoi va returna o pagină de rezultate cu mai multe fonturi similare, dacă nu potriviri exacte, cu cea pe care încercați să o identificați:

Rata dvs. de succes aici poate varia în funcție de sursa fontului și de popularitate. Dacă numele exact al fontului este extrem de important pentru dvs., poate fi greu să găsiți un instrument care să vă ofere ceea ce doriți.

Cu toate acestea, dacă sunteți deschis să utilizați un font similar cu cel pe care l-ați găsit într-o imagine, un detector online ar trebui să se potrivească foarte bine nevoilor dvs.

Concluzie

Fonturile vizibile și atrăgătoare pot îmbunătăți experiența de citire pentru vizitatorii site-ului dvs. web. Acest lucru vă poate determina să rămâneți în căutarea unor noi tipuri de caractere pe care le puteți folosi fie pe site-ul dvs., fie pentru clienții dvs. Indiferent de motivul pentru care doriți să verificați ce font utilizează un site web, există multe instrumente care vă pot ajuta.

În această postare, am discutat trei metode pentru a vedea ce font utilizează un site web:

1. Identificați fonturile folosind instrumentul de inspecție al browserului.
2. Găsiți fonturi utilizând o extensie de browser, cum ar fi WhatFont.
3. Detectați fonturile din imagini folosind WhatTheFont.

Aveți întrebări despre cum să verificați ce font este utilizat pe un site web? Spuneți-ne în secțiunea de comentarii de mai jos!

Imagine de rudall30 / shutterstock.com