Nggunakake Fon Custom ing Kaca Web
Isi teks mesthi dadi wigati situs web, nanging ing awal-awal jaman Web, perancang lan pangembang sing banget diwatesi ing kontrol tipografi sing wis ana ing situs web. Iki kalebu watesan ing font sing padha bisa dipercaya digunakake ing situs. Sampeyan pancen krungu istilah "web safe fonts" sing kasebut ing mangsa sing lawas. Iki kalebu pirang-pirang huruf cilik sing mungkin banget disertakan ing komputer wong, tegese yen sampeyan nggunakake situs salah sawijining fonts, iku pancen aman sing bakal dikirim kanthi bener ing browser wong.
Dina iki, profesional web duwe tuan rumah fonts anyar lan ngetik opsi kanggo nggarap, salah sawijining format WOFF.
Apa WOFF?
WOFF minangka akronim sing tegesé "Format Font Web Terbuka." Iki digunakake kanggo ngompres fonts kanggo nggunakake CSS @ font-face property. Iku cara kanggo nampilake fonts ing kaca web supaya sampeyan bisa nggunakake hurup khusus ngluwihi khas "Arial, Times New Roman, Georgia" - sing sawetara saka kasebut web aman fonts.
WOFF dikirimake ing W3C minangka standar kanggo font kemasan kanggo kaca web. Dadi dadi konsep kerja ing tanggal 16 Nopember 2010. Dina iki kita bener duwe WOFF 2.0, sing mbenake kompresi saka versi pisanan saka format nganti meh 30%. Ing sawetara kasus, tabungan bisa malah luwih substansial!
Apa Gunakake WOFF?
Fon web, kalebu sing dikirim liwat format WOFF, nyedhiyakake akeh kaluwihan saka pilihan font liyane. Minangka migunani minangka font-font sing aman web wis, lan mesthi isih papan kanggo fonts ing karya kita, iku uga apik kanggo nggedhekake pilihan kita lan mbukak opsi typographic kita.
WOFF fonts duwe keuntungan ing ngisor iki:
- Padha luwih gampang dibandhingake fonts kaya gambar. WOFF gaya teks HTML biasa karo CSS, menehi sampeyan aksesibilitas lan kontrol desain sing gambar ora ngidini kanggo.
- File WOFF kalebu informasi tipografis kaya formulir kontekstual lan tokoh gaya lawas. Iki menehi kaca web sing luwih apik nganggo tipografi amarga sampeyan nggunakake karakter sing bener, ora mung perkiraan.
- WOFF fonts bisa mbantu internasionalisasi amarga sampeyan bisa nampilake fonts karo karakter saka basa liya.
- Kaya kabeh teks gaya CSS, fonts gaya karo WOFF luwih disenengi mesin pencari. Mesin telusur ora "ndeleng" teks sing ditrapake ing gambar, lan nalika teks ALT bisa mbantu, ora ana pengganti teks kasebut.
- WOFF fonts dikompres, dadi luwih cilik tinimbang jinis file font liyane. Iki bakal mbantu kanthi cepet download situs lan kinerja sakabèhé.
- Sampeyan bisa nggunakake file WOFF kanggo ngreksa identitas merek kanthi nglebokake font perusahaan minangka file WOFF.
WOFF Browser Support
WOFF nduweni dhukungan browser banget ing browser modern, kayata:
- Chrome 6+
- Firefox 3.6+
- Internet Explorer 9+
- Opera 11.1+
- Safari 5.1+
Iki pancen didhukung ing papan saiki, kanthi pengecualian mung kabeh versi Opera Mini.
Carane Gunakake WOFF Fonts
Supaya bisa nggunakake file WOFF, sampeyan kudu ngunggah file WOFF menyang server web, menehi jeneng mawa @ font-face property, banjur hubungi font ing CSS sampeyan. Tuladhane:
- Ngunggah font sing disebut myWoffFont.woff menyang direktori / fonts saka server web.
- Ing file CSS sampeyan nambah @ font-face bagean:
@ font-face {
font-family: myWoffFont;
src: url ('/ fonts / myWoffFont.woff') format ('woff');
}
- Nambah jeneng font anyar (myWoffFont) kanggo tumpukan font CSS, kaya jeneng font liyane:
p {
font-family: myWoffFont , Geneva, Arial, Helvetica, sans-serif;
}
Endi Njaluk WOFF Fonts
Ana rong panggonan sing gedhe sampeyan bisa nemokake fonts WOFF sing gratis kanggo panggunaan komersial lan non-komersial:
- Bukak Library Font
- Bajingan
Yen sampeyan duwe lisensi kanggo nggunakake font sing ora kasedhiya ing format WOFF, sampeyan bisa nggunakake pencipta WOFF kaya ing Font Squirrel kanggo ngonversi file font menyang file WOFF. Ana uga alat baris perintah sing disebut sfnt2woff sing bisa digunakake ing Macintosh lan Windows kanggo ngonversi font TrueType / OpenType Panjenengan menyang WOFF.
Ngundhuh binar cocok kanggo sistem sampeyan lan mbukak ing baris perintah (utawa Terminal) lan tindakake instruksi.
WOFF Conto
Kene sawetara conto file WOFF: WOFF Page on HTML5 ing 24 Jam.
Artikel asli dening Jennifer Krynin. Diedit dening Jeremy Girard ing 7/11/17