Defnyddio Ffontiau Custom ar y Tudalennau Gwe
Mae cynnwys y testun bob amser wedi bod yn ddarn pwysig o wefannau, ond yn ystod dyddiau cynnar y We, roedd dylunwyr a datblygwyr yn gyfyngedig iawn yn y rheolaeth teipograffig a oedd ganddynt dros eu tudalennau gwe. Roedd hyn yn cynnwys cyfyngiad yn y ffontiau y gallent eu defnyddio'n ddibynadwy ar eu gwefannau. Rydych chi wedi clywed yn debygol y term "ffontiau diogel ar y we" a grybwyllwyd yn y gorffennol. Cyfeiriodd hyn at y set fach o ffontiau a oedd yn debygol iawn o gael eu cynnwys ar gyfrifiadur person, sy'n golygu pe bai safle'n defnyddio un o'r ffontiau hynny, roedd yn bet diogel y byddai'n ei rendro'n gywir ar borwr unigolyn.
Heddiw, mae gan weithwyr proffesiynol gwefannau llu o ffontiau a theipiau newydd i weithio gyda nhw, ac un ohonynt yw fformat WOFF.
Beth yw WOFF?
Mae WOFF yn acronym sy'n sefyll ar gyfer "Web Open Font Format". Fe'i defnyddir i gywasgu ffontiau i'w defnyddio gyda'r eiddo CSS @ font-face. Mae'n ffordd o fewnosod ffontiau ar dudalennau gwe er mwyn i chi allu defnyddio ffontiau arbenigol y tu hwnt i'r "Arial, Times New Roman, Georgia" nodweddiadol - sef rhai o'r ffontiau diogel y cyfeirir atynt ar y we.
Cyflwynwyd WOFF i'r W3C fel safon ar gyfer ffontiau pacio ar gyfer tudalennau gwe. Daeth yn ddrafft waith ar 16 Tachwedd, 2010. Heddiw, mae gennym WOFF 2.0, sy'n gwella'r cywasgu o'r fersiwn gyntaf o'r fformat o bron i 30%. Mewn rhai achosion, gall yr arbedion hyn fod yn fwy sylweddol hyd yn oed!
Pam Defnyddiwch WOFF?
Mae ffontiau'r We, gan gynnwys y rhai a ddarperir trwy fformat WOFF, yn darparu llawer o fanteision dros ddewisiadau ffont eraill. Yn ddefnyddiol â'r ffontiau diogel ar y we, ac yn sicr mae lle yn dal i gael y ffontiau hynny yn ein gwaith, mae'n braf hefyd ehangu ein dewisiadau ac agor ein dewisiadau teipograffig.
Mae gan ffontiau WOFF y manteision canlynol:
- Maent yn fwy hygyrch na ffontiau fel delweddau. Mae WOFF yn arddull testun HTML plaen gyda CSS, gan roi mynediad i chi a rheolaeth ddylunio na fydd y delweddau yn ei ganiatáu.
- Mae ffeiliau WOFF yn cynnwys gwybodaeth deipograffyddol fel ffurfiau cyd-destunol a hen ffigurau arddull. Mae hyn yn rhoi gwell teipograffeg i'ch tudalennau gwe oherwydd eich bod yn defnyddio'r cymeriadau cywir, nid brasamcanion yn unig.
- Gall ffontiau WOFF helpu gyda rhyngwladoli oherwydd gallwch chi fewnosod ffontiau gyda chymeriadau o ieithoedd eraill.
- Fel pob testun styled CSS, mae ffontiau wedi'u styled gyda WOFF yn fwy cyfeillgar i chwilio am beiriannau. Nid yw peiriannau chwilio yn "gweld" testun wedi'i fewnosod mewn delwedd, ac er y gall testun ALT helpu, nid oes yn lle'r testun ei hun.
- Mae ffontiau WOFF yn cael eu cywasgu, felly maent yn llai na mathau eraill o ffeiliau ffont. Bydd hyn yn helpu gyda chyflymder lawrlwytho safle a pherfformiad cyffredinol.
- Gallwch ddefnyddio ffeiliau WOFF i gadw'ch hunaniaeth brand trwy fewnosod eich ffontiau corfforaethol fel ffeiliau WOFF.
Cefnogaeth Porwr WOFF
Mae gan WOFF gefnogaeth porwr ardderchog mewn porwyr modern, gan gynnwys:
- Chrome 6+
- Firefox 3.6+
- Internet Explorer 9+
- Opera 11.1+
- Safari 5.1+
Fe'i cefnogir yn y bôn ar draws y bwrdd y dyddiau hyn, gyda'r unig eithriad yn holl fersiynau Opera Mini.
Sut i ddefnyddio Fformatau WOFF
Er mwyn defnyddio ffeil WOFF, mae angen i chi lwytho ffeil WOFF i'ch gweinydd gwe, rhowch enw iddo gyda'r eiddo @ font-face, ac yna ffoniwch y ffont yn eich CSS. Er enghraifft:
- Llwythwch y ffont o'r enw myWoffFont.woff i gyfeiriadur / ffontiau'r gweinydd gwe.
- Yn eich ffeil CSS, ychwanegwch adran @ font-face:
@ font-face {
ffont-deulu: myWoffFont;
fformat: url ('/ fonts / myWoffFont.woff') fformat ('woff');
}
- Ychwanegwch yr enw ffont newydd (myWoffFont) at eich stack ffont CSS, fel y byddech chi'n enw unrhyw ffont arall:
p {
ffont-deulu: myWoffFont , Genefa, Arial, Helvetica, sans-serif;
}
Ble i Get Fonts WOFF
Mae yna ddau le gwych y gallwch ddod o hyd i lawer o ffontiau WOFF sydd am ddim i ddefnydd masnachol ac anfasnachol:
- Llyfrgell Fformat Agored
- Gwiwer y Ddaear
Os oes gennych drwydded i ddefnyddio ffont nad yw ar gael mewn fformat WOFF, gallwch ddefnyddio crewrydd WOFF fel yn Wiwer y Ffont er mwyn trosi'ch ffeiliau ffont i mewn i ffeiliau WOFF. Mae yna hefyd offeryn llinell gorchymyn o'r enw sfnt2woff y gallwch ei ddefnyddio ar Macintosh a Windows i drosi eich ffontiau TrueType / OpenType i WOFF.
Lawrlwythwch y deuaidd sy'n briodol i'ch system a'i redeg ar y llinell orchymyn (neu'r Terfynell) a dilynwch y cyfarwyddiadau.
Enghraifft WOFF
Dyma rai enghreifftiau o ffeiliau WOFF: Tudalen WOFF ar HTML5 mewn 24 awr.
Erthygl wreiddiol gan Jennifer Krynin. Golygwyd gan Jeremy Girard ar 7/11/17