For å bruke den mest grunnleggende forklaringen er typografi utforming og bruk av skrifttyper som kommunikasjonsmiddel. Mange anser typografi for å ha begynt med Gutenberg og utviklingen av flyttbar type, men typografi går mye lenger enn det. Denne grenen av design har faktisk sine røtter i håndskrevne brevformer.
Typografi omfatter alt fra kalligrafi gjennom den digitale typen som vi ser i dag på nettsider av alle slag. Typografiens art inkluderer også typedesignere som lager nye brevformularer som deretter blir til fontfiler som andre design kan bruke i sitt arbeid, fra trykte verk til de nevnte nettstedene. Så forskjellig som disse verkene kan være, legger grunnleggende om typografi dem til grunn.
Elementene til typografi
Hvis du noen gang har snakket med en webdesigner som bruker typografi i sitt arbeid, har du sannsynligvis hørt ordene "skrifttype" og / eller "skrifttype". Mange bruker disse to termene om hverandre, men det er faktisk noen forskjeller mellom disse to elementene.
Typeface er begrepet gitt til en familie av skrifttyper (som Helvetica Regular, Helvetica Italic, Helvetica Black og Helvetica Bold). Alle de forskjellige versjonene av Helvetica utgjør det komplette skrifttypen.
Skrift er termen som brukes når noen refererer til bare en vekt eller stil i den familien (for eksempel Helvetica Bold). Så mange skrifttyper består av en rekke individuelle skrifttyper, som alle er like og relaterte, men forskjellige på en eller annen måte. Enkelte skrifttyper kan bare inneholde en enkelt skrift, mens andre kan inkludere mange variasjoner av brevformene som utgjør skriftene.
Hvis dette virker forvirrende, vær ikke bekymret, hvis noen ikke er en typografisk ekspert, vil de trolig bruke begrepet "font" uavhengig av hvilket av disse vilkårene de virkelig betyr, og til og med mange profesjonelle designere bruker disse to termene om hverandre. Med mindre du snakker til en ren type designer om håndverketes mekanikk, er du sannsynligvis ganske trygg ved å bruke hvilken av disse to termene du foretrekker. Når det blir sagt, hvis du forstår skillet og riktig kan bruke de riktige betingelsene, er det aldri noe dårlig!
Typeface Klassifikasjoner
Noen ganger kalt "generiske fontfamilier", disse er store grupperinger av skrifttyper basert på en rekke generiske klassifikasjoner som forskjellige skrifttyper faller under. På nettsider er det seks typer skrifttypeklassifikasjoner som du sannsynligvis vil se:
- Serif
- Sans serif
- Manus
- monospaced
- kursiv
- Fantasi
Det finnes også en rekke andre skrifttypeklassifikasjoner som er offshoots av disse. For eksempel, "slab serif" skrifter ligner serifs, men alle har en gjenkjennelig design med tykke, klumpete serifs på brevformene. Serif og sans-serif er de to vanligste font klassifikasjonene som brukes på de fleste nettsteder.
Typeface Anatomy
Hver skrifttype består av forskjellige elementer som skiller den fra andre skrifttyper, som refereres til som skrifttypeanatomi. Med mindre du spesifikt skal gå inn i type design og ønsker å skape helt nye skrifttyper, trenger webdesignere generelt bare å kjenne grunnleggende om skriftterminologi.
På et grunnleggende nivå er elementene i skrifttypeanatomi som du bør være oppmerksom på, "cap" og "x-height" og "descenders" og "ascenders."
Hett og x-høyde er høyden på hovedbokstaver i skrifttypen og høyden på brevet x. Det forteller deg hvor høyt de største bokstavene vil være, så vel som hvor store bokstaver vil være. Alle skrifttyper er dimensjonerte basert på disse to egenskapene.
Nedfaller og oppstigninger er delene av bokstaver som går under og over x-høyden. Dette refererer vanligvis til små bokstaver. For eksempel har bokstaven "b" en oppstigning (stykket som stikker "opp" fra brevet) mens bokstaven "p" har en nedstigning (delene som dypper "ned" fra brevet).
Spacing Around Letters
Det er flere justeringer som kan gjøres mellom og rundt bokstaver som påvirker typografi. Digitale skrifter er opprettet med mange av disse egenskapene på plass, og på nettsteder har vi begrenset evne til å endre disse aspektene av skriften. Dette er ofte en god ting siden standardinnstillingen som skrifter vises, er vanligvis å foretrekke.
- utligning: Det horisontale mellomrom mellom individuelle bokstaver
- sporing: Rommet mellom grupper av bokstaver
- ledende: Vertikal plass mellom linjene av typen (dette kalles linjehøyde i nettstedets termer)
- Måle: Lengden på tekstlinjer
- Justering: Visuell plassering av tekst til venstre, høyre, sentrert eller rettferdiggjort
- Ligaturer: Bokstaver flyttet så nært sammen at deres anatomier kombineres, i hovedsak flyter ett brev til et annet
Flere typografielementer
Typografi er mer enn bare de skrifttypene som brukes, og hvite rom rundt dem. Det er også noen andre ting du bør huske på når du oppretter et godt typografisk system for ethvert design:
"Hyphenation" er tillegget av en bindestrek (-) på slutten av linjene for å forhindre problemer i lesbarhet eller gjøre justering se bedre ut. Selv om de ofte finnes i trykte dokumenter, ignorerer de fleste webdesignere hyphenering og bruker ikke den i sitt arbeid fordi det ikke er noe som håndteres godt automatisk av nettlesere.
"Fille" er den ujevne vertikale kanten av en blokk med tekst. Når du tar hensyn til typografi, bør du se på tekstblokkene dine som helhet for å sikre at laken ikke påvirker designen.Hvis laken er for hakket eller ujevn, kan det påvirke leseblokkens lesbarhet og gjøre det distraherende. Dette er noe som automatisk håndteres av nettleseren når det gjelder hvordan det brytes inn fra linje til linje.
Et enkelt ord i enden av en kolonne er enke, og hvis det er på toppen av en ny kolonne, er det en foreldreløs. "Enker" og "foreldreløse" ser dårlig ut og kan være vanskelig å lese.
Å få tekstlinjene dine til å vise perfekt i en nettleser, er et grusomt forslag, spesielt når du har en responsiv nettside og forskjellige skjermer for forskjellige skjermstørrelser. Målet ditt bør være å se på nettstedet i forskjellige størrelser for å prøve å skape det beste utseendet, samtidig som du aksepterer at innholdet i visse tilfeller vil ha windows, foreldreløse eller andre mindre enn ideelle skjermer. Målet ditt bør være å minimere disse aspektene av en type design, samtidig som det er realistisk i det faktum at du ikke kan oppnå fullkommenhet for hver skjermstørrelse og skjerm.
Fremgangsmåte for å sjekke din typografi
- Velg typene nøye, se på anatomien til typen, samt hvilken type familie den er i.
- Hvis du bygger designet med plassholdertekst, må du ikke godkjenne den endelige utformingen til du har sett den virkelige teksten i designet.
- Vær oppmerksom på de små detaljene i typografien, som bindestreker og bindestreker.
- Se på hver blokk med tekst som om det ikke hadde ord i det. Hvilke former gjør teksten på siden? Pass på at disse figurene bærer hele sidedesignet fremover.