Accentsconagua
Share
Variable skrifttyper er, i et nøtteskall, skrifttypefiler som har innstillinger du kan endre til subtilt, eller dramatisk endre skriftets utseende. De er satt til å gjøre en stor forskjell for å skrive på nettet, la oss ta en nærmere titt!
Gjennom variabel skriftinnstillinger (som kalles akser) Du kan ta en enkelt skriftfil og lage de forskjellige variasjonene du tidligere kun kunne få gjennom å bruke flere skriftfiler.
For eksempel med en vanlig skriftfamilie, hvis du vil ha en lys, normal og fet vektversjon, må du laste inn tre forskjellige skriftfiler.
Men med en variabel skrifttype som som en vekt akse Du kan justere vekten via CSS for å få lys, normalt og fet utseende fra en enkelt fil:
.lys font-variasjon-innstillinger: "wght" 66; .regulære font-variasjon-innstillinger: "wght" 84; . bold font-variasjon-innstillinger: "wght" 154;
Med denne tilnærmingen får du det samme typografiske utseendet, men med vesentlig forbedrede belastningstider. Hvor du tidligere har hatt å minimere antall varianter du laster inn på en nettside, med variabel skrifter som ikke lenger er et problem, har du mange variasjoner ved fingertipsene dine:
Protipo Variabel på Akse-PraxisSå vidt stilvariabiliteten går, stopper den ikke bare der. Du er ikke begrenset til bare de forskjellige variasjonene du vil være vant til, som vanlig vekt eller kursiv.
For det første kan en hvilken som helst akse ha sin verdi satt hvor som helst langs et glidende område, ikke bare ved innstilte verdier. Så hvis du leter etter en vekt et sted mellom normal og fet, er det helt mulig. Eller hvis du vil at kursivet skal lene deg litt mindre, eller hvis du vil at tegnsbredder skal være litt mer enn standard, er strømmen i hendene dine. Finjuster innstillingene dine til akkurat det du trenger.
For det andre kan skrifter bruke noen akser designeren bryr seg om å tenke på! Ta en titt på innstillingene som er tilgjengelige for Bitcount:
Bitcount innstillinger på akse-praxisAvhengig av skrifttypen, finner du akser som gir deg kontroll over drop-shadows, eller stencil gap, eller tegn terminaler, alternativene er ubegrensede.
Variable skrifttyper ser ut til å gjøre stor innvirkning på hvordan vi jobber som webdesignere. De vil tillate oss å oppnå mye større mangfold og kontroll, samtidig som vi reduserer lasthastighetene. De vil også tillate oss å forgrene seg i vår typografiske kreativitet på måter som var teknisk umulige før.
For å komme i gang med variable skrifttyper har vi satt sammen et kurs som leder deg gjennom alle de viktigste fasettene av hvordan de fungerer, får deg til å sette opp verktøyene du trenger, går deg gjennom koding av CSS som kontrollerer variabel skrifttyper, og viser deg hvordan du oppretter tilbakebetalinger for nettlesere som ennå ikke har støtte.
