Huomautus: Seuraava artikkeli auttaa sinua: Kuinka tunnistaa verkkosivuston kirjasimet Inspect Element Toolin ja Browser Pluginin avulla?
Värien ja tekstuurin lisäksi fontit ovat tärkeitä. Tässä artikkelissa haluamme opettaa sinulle kuinka tunnistaa verkkosivun fontti kahdella tavalla.
Selatessasi Internetiä saatat törmätä verkkosivustoon, jossa on kaunis fontti. Tällä hetkellä haluat tietää tämän verkkosivuston fontin.
Tätä tarkoitusta varten voit nopeasti siirtyä Inspect Element -työkaluun tai selainlaajennuksiin selvittääksesi fontin. Opi tunnistamaan verkkosivuston tai verkkosivun kirjasintyyppi näillä kahdella menetelmällä.
Kuinka tunnistaa fontit Inspect Elementin avulla
Selaimessa on työkalu nimeltä Inspect Element, jonka avulla voit tarkistaa verkkosivustojen lähdekoodit. Voit ymmärtää suunnitteluelementit katsomalla HTML-, CSS- ja muuta tietoa. Tämä työkalu soveltuu myös oman verkkosivustosi Suunnitteluun.
Fontien tunnistaminen Inspect Element -työkalulla on erittäin helppoa eikä vaadi ohjelmointiosaamista. Tämä työkalu on saatavilla kaikissa selaimissa ja käyttää samaa muotoa.
Voit tunnistaa fontin selaimen tarkastustyökalulla seuraavasti:
- Avaa haluamasi Verkkosivusto.
- Korosta teksti halutulla fontilla ja napsauta sitä hiiren kakkospainikkeella.
- Napsauta avautuvassa valikossa “Tarkista”.
- Napsauta Laskettu-osiota, kun Tarkastus-valikko avautuu.
- Vieritä alas löytääksesi Fonttiperhe-osion. Löydät kirjasimen nimen ja tyylin sekä tietysti mitat tästä osiosta.
Muita tapoja käyttää tarkastustyökalua
Jos etsit nopeampaa tapaa tunnistaa verkkosivuston kirjasin Tarkastustyökalun avulla, kokeile seuraavaa tapaa:
- Avaa haluamasi sivusto.
- Paina Ctrl + Shift + C Windowsissa ja Command + Shift + C Mac OS:ssä.
- Vie hiiri tekstin päälle nähdäksesi fontin, värikoodin ja reunuksen.
Löydät myös luettelon verkkosivustoilla käytetyistä fonteista selaimen Tarkastus-työkalun avulla. Voit tehdä tämän seuraavasti:
- Siirry haluamallesi verkkosivustolle.
- Avaa lähdekoodi painamalla Ctrl + Shift + I Windowsissa ja Command + Shift + I Mac OS:ssä.
- Napsauta Verkko-välilehteä ja valitse sitten Fontti-välilehti.
- Tässä on luettelo verkkosivustolla käytetyistä fonteista.
Sinun on päivitettävä tai päivitettävä sivu, jotta näet heti luettelon kaikista kirjasimista.
Tunnista fontit selainlaajennuksilla
Jos etsit helpompaa tapaa tunnistaa fontti, voit asentaa laajennuksen. Vaikka tähän tarkoitukseen on kehitetty monia laajennuksia, niitä käytetään laajasti: WhatFont ja Font Finder.
Katsotaan alla, kuinka kirjasimia tunnistetaan näiden laajennusten avulla.
1. WhatFont
Yksi syistä tämän laajennuksen suosioon on kyky tunnistaa nopeasti useita fontteja samanaikaisesti, mutta miten tätä laajennusta pitäisi käyttää?
- Kun WhatFont on käytössä selaimessasi, vie hiiri tekstin päälle nähdäksesi sen fontin.
- Kun napsautat tekstiä, näkyviin tulee ponnahdusikkuna, joka näyttää lisätietoja kirjasimesta, kuten fontin koon, värin ja tyylin.
- Lisäksi voit valita useita tekstiosia sivulla kerralla vertaillaksesi kirjasimia.
Voit ladata tämän laajennuksen ilmaiseksi kromi, TulikettuJa safari.
2. Font Finder
Tämä laajennus näyttää myös tiedot, kun viet hiiren tekstin päälle. Se sisältää kuitenkin monia teknisiä yksityiskohtia. Tästä syystä, jos et ole perehtynyt web-suunnitteluun, olet todennäköisesti hämmentynyt.
Font Finder sopii paremmin verkkokehittäjille, jotka haluavat korvata nykyiset fontit uusilla. Tämän lähestymistavan avulla voit testata fontteja ennen pysyvien muutosten tekemistä.
Voit testata fonttia Font Finderilla seuraavasti:
- Korosta tekstin osa verkkosivulla.
- Napsauta sitä hiiren kakkospainikkeella ja valitse avautuvasta valikosta “Font Finder”.
- Valitse “Korvaa fontti” -vaihtoehto ja kirjoita fontin nimi. Kirjoita esimerkiksi Calibri-fontti ja katso, kuinka tekstiä muutetaan esikatselussa.
- Jos haluat nollata fontin, se tehdään päivittämällä sivu.
Voit ladata Finder Font -laajennuksen verkkotunnukselle kromi, Microsoft EdgeJa Firefox for vapaa.
Kuinka tunnistaa fontin kuvassa
Jos haluat havaita fontteja valokuvassa, selainlaajennukset ja Tarkastus-työkalu eivät välttämättä toimi sinulle. Voit kuitenkin käyttää verkkotyökaluja, kuten: WhatFontis tai WhatTheFont.
Valokuvien fonttien tunnistamisprosessi on suurelta osin sama kaikissa yllä mainituissa työkaluissa. Joten tehdään tämä WhatTheFont-työkalulla:
- Lataa haluamasi valokuva.
- Kirjoita tämä kuva WhatTheFont-työkaluun.
- Tämä työkalu tunnistaa automaattisesti kuvan tekstin. Suurenna tai pienennä laatikon kokoa halutun fontin mukaan. Kun olet valmis, napsauta nuolivaihtoehtoa.
- Seuraavaksi WhatTheFont yhdistää kuvan fontin galleriassaan oleviin fontteihin ja näyttää lähimmät fontit.
- Jos et löydä sopivaa vaihtoehtoa fonttien joukosta, voit tarkastella lisää vastaavia fontteja napsauttamalla “Näytä lisää tuloksia” -vaihtoehtoa.
Kuten artikkelin alussa totesimme, kirjasimilla on tärkeä rooli verkkosivuston tai graafisen suunnittelun menestyksessä. Joten oikealla fontilla voit lisätä yleisön sitoutumista verkkosivustoosi tai suunnitteluun. Voit myös käyttää yllä olevia menetelmiä haluamiesi fonttien tunnistamiseen.
