Web Open Font Format (WOFF) on Mozillan kehittämä verkkofonttitiedostomuoto. WOFF-tiedosto voi sisältää pakattuja TTF- ja OTF-tiedostoja sekä lisenssitietoja ja muita metatietoja. Tässä on mitä sinun tulee tietää WOFFista. Tämän artikkelin tiedot koskevat WOFF- ja WOFF2-tiedostoja.
Mikä on WOFF-tiedosto?
ZIP-tiedostojen tapaan WOFF-tiedostot toimivat säilöinä muille tiedostoille, erityisesti TrueType Font (TTF)- ja OpenType Font (OTF) -tiedostoille. Tämäntyyppisten tiedostojen avulla web-suunnittelijat voivat käyttää muita kuin useimmissa tietokoneissa esiintyviä vakiomerkkejä. WOFF on korvattu WOFF2-muodolla. WOFF2 tarjoaa entistä parempia pakkausalgoritmeja, mikä pienentää alkuperäisen tiedoston kokoa vielä 30 prosenttia. Siksi WOFF2-tiedostot vievät vähemmän kaistanleveyttä ja latautuvat entistä nopeammin. WOFF-tiedostoilla on .woff-tunniste, kun taas WOFF2-tiedostoilla on .woff2-tunniste.
Miten WOFF-tiedostot toimivat?
Käytännössä kaikki verkkosivut käyttävät CSS (Cascading Style Sheets) -tyylisivuja HTML-koodin ja muiden elementtien asettelun määrittämiseen näytölläsi. Esimerkiksi kehittäjät voivat käyttää CCS:ää verkkofonttien vaihtamiseen viittaamalla käyttäjän tietokoneeseen jo asennettuihin kirjasimiin. Jos tietokoneesi tai selaimesi ei kuitenkaan tue kirjasinta, se näkyy eri fonttina tai ei lataudu ollenkaan riippuen siitä, miten sivun fonttipino on asetettu. Tämän ongelman välttämiseksi mukautetut fontit voidaan tallentaa WOFF-tiedostoon, joka tallennetaan palvelimelle kaikkien muiden web-sivuelementtien kanssa. Suunnittelija voi sitten käyttää @font-face CSS-ominaisuutta viitatakseen WOFF-tiedostoon ja näyttääkseen fontin selaimessa. Google Chrome, Firefox, Microsoft Edge, Opera ja Safari tukevat WOFF-muotoa, mutta sinun on ehkä päivitettävä verkkoselaimesi uusimpaan versioon.
WOFF:n edut
WOFF-tiedostojen käyttämisellä on web-kehittäjien käytettävissä olevien fonttien laajentamisen lisäksi useita etuja. Esimerkiksi:
- puristus: Koska WOFF-tiedostot on pakattu, ne latautuvat nopeammin kuin muut fonttitiedostotyypit.
- HTML- ja CSS-tuki: Toisin kuin kuvatiedostot, WOFF-tiedostot voidaan muotoilla HTML:n ja CSS:n avulla.
- SEO: WOFF-fontit ovat parempia hakukoneoptimoinnissa (SEO) kuin tekstikuvat.
- Optimoitu näyttö: WOFF-tiedostot sisältävät typografisia tietoja, mukaan lukien vanhanaikaisia kontekstuaalisia muotoja ja kuvioita, mikä mahdollistaa optimaalisen näytön kaikissa laitteissa.
- Verkkosivuston saavutettavuus: WOFF-tiedostot tekevät sivustoista helpommin saavutettavia, koska tekstiä voidaan lukea ääneen ja tekstin kuvia ei voida lukea.
- Upottaminen: WOFF-kirjasimet auttavat kansainvälistymisessä, koska niiden avulla voit upottaa kirjasimia, joissa on muiden kielten merkkejä.
Tee omat WOFF-fontisi
FontForgen kaltaisten fonttieditorien avulla voit suunnitella omia fonttijoukkojasi ja viedä ne WOFF-tiedostoina. Voit myös muuntaa WOFF:n TTF- tai OTF-tiedostoiksi FontForgen avulla. Jos sinulla on toinen kirjasineditori, joka tukee vain TTF- tai OTF-muotoa, voit muuntaa fontit WOFF-tiedostoiksi sfnt2woff-työkalulla. Open Font Library ja Font Squirrel sisältävät satoja kirjasimia WOFF-muodossa, jotka ovat ilmaisia kaupalliseen ja ei-kaupalliseen käyttöön.