Innhold
Typografi på nettet har kommet langt. For omtrent et tiår siden var det fortsatt dårlig brukt og gjort veldig dårlig - skadelig brukeropplevelse. Teksten var ikke veldig lesbar på nettet, og de samme skriftene ble brukt om og om igjen. Folk kastet hendene i luften og hevdet at du ikke kunne gjøre typografi på nettet bra.
Men det er en mann som har prøvd å overbevise folk om noe annet, og det er Richard Rutter, medstifter av det innflytelsesrike UX-konsulentverket Clearleft. Nå er det virkelig spenning av nettfonter og typografi, og han er i sentrum.
En av de største spillvekslerne akkurat nå er fremveksten av variable skrifter, en teknologi som gjør det mulig for en enkelt fontfil å oppføre seg som flere skrifter. "Det er veldig interessant hvor raskt dette har kommet ut fra ingenting," forklarer Rutter.
“Adobe, Microsoft, Apple og Google har alle kastet sin samlede vekt bak variable skrifter, og de har alle sine litt forskjellige grunner. Spesielt Googles vil være en ytelse fordi du kan spare veldig mye plass.
Du kan redusere filstørrelsen radikalt fordi du kan ha en vanlig og en fet innpakning
"Hvis du spesielt arbeider med kinesiske, japanske og koreanske språk, vil fontfiler være noen få megabyte i motsetning til latinbaserte fontfiler, som er mye mindre," fortsetter Rutter. "Du kan radikalt kutte ned størrelsen på disse filene fordi du kan ha en vanlig og en fet skrift pakket sammen. Du har nettopp fått en skriftfil for et uendelig antall varianter. Det blir også veldig interessant å se hvordan typen designere vil gi stilistiske variasjoner i skriftene sine som er veldig uvanlige og som vi ikke hadde sett før. ”
Variable skrifttyper kan brukes i ekte prosjekter nå. Nettleserstøtte har nådd over 65 prosent. Både Safari og Chrome støtter allerede variable skrifter, og Firefox og Edge følger snart. De nyeste versjonene av Photoshop og Illustrator støtter dem også, og de er også inkludert i de nyeste Windows- og Mac-operativsystemene - Apples systemfont San Francisco bruker skriftvariasjoner i stor utstrekning.
Clearleft har brukt en variabel font på nettstedet til Ampersand, webtypografikonferansen. Det er et av de første kommersielle nettstedene som noensinne har gjort noe slikt, noe Rutter utforsker i sin artikkel, hvordan man bruker variable skrifttyper i den virkelige verden.
"Vi setter ordet" Ampersand "i seks forskjellige vekter," begeistret Rutter. “Hver enkelt bokstav er satt til en litt annen vekt for å gi den en litt mer håndtegnet følelse. Det er ingen måte du ville ha gjort det tidligere! Du ville ha servert det som en SVG, men nå er det ekte tekst, og vi kan gjøre det med en variabel skrift, som er liten i størrelse fordi den har et veldig lite tegnsett. Det har hele alfabetet og veldig lite annet, men det er alt vi trengte for ett ord. "
Rutter studerte opprinnelig kjemiteknikk og begynte sin karriere med å designe biter av oljerigger lenge før han grunnla Clearleft sammen med Andy Budd og Jeremy Keith i 2005. Han oppdaget først sin kjærlighet til typografi på midten av 1990-tallet. Nettet kom, og hvem som helst kunne lage en webside hvis de kunne skrive inn noen enkle HTML. Rutter syntes det var veldig givende, så han kom inn i design og med det kom typografi.
"I min første ordentlige jobb som designer hos et byrå i London ble jeg introdusert for Robert Bringhursts bok The Elements of Typographic Style," husker Rutter. “Det var en åpenbaring. Jeg ble fascinert av måten han skrev på sider og tankeprosessene bak. Jeg innså - og ble forelsket i - de fine detaljene han la inn i arbeidet sitt. Det fikk virkelig gjenklang hos meg. Det er en fantastisk geekiness til det.
"Det er mange små, tilsynelatende meningsløse detaljer som noen ganger bare du eller andre typografer kan se. Det er din egen spesielle kode på en måte, men hvis du får nok av dem riktig, så kommer det hele sammen til å være noe vakkert og De forbedrer alle leseopplevelsen. "
Det er mange små, tilsynelatende meningsløse detaljer som noen ganger bare du eller andre typografer kan se
Oppdagelsen av Bringhursts bok fikk Rutter til å begynne å skrive om typografi på nettet. Han ønsket å vise folk hvordan man anvender Bringhursts retningslinjer ved hjelp av teknikker tilgjengelig i HTML og CSS og ble en selvutnevnt evangelist for webtypografi. Til slutt førte det til Rutter sin egen bok, Web Typography, en håndbok for å designe vakker og effektiv responsiv typografi.
Opprinnelig var det ment å bli skrevet med Mark Boulton og typograf Jon Tan, som Rutter var med på å grunnlegge banebrytende nettfontjeneste Fontdeck sammen med (nå nedlagt). Det skulle også publiseres gjennom Boultons Five Simple Steps, som ble stengt da byrået hans ble kjøpt opp av Monotype. Til tross for tilbakeslagene var Rutter forpliktet til prosjektet og bestemte seg for å gå videre alene, uten forlag og med hjelp fra Kickstarter; kampanjen nådde målet på mindre enn 48 timer.
Webtypografi er rettet mot både designere og utviklere og blander typografisk teori med det praktiske og tekniske. Rutter prøvde å inkludere alt han kunne tenke seg som ville være relevant for nettypografi. En av teoriene han dekker er hvordan du ikke kan ha en god brukeropplevelse uten god typografi.
"Å se på ord er de aller fleste av det vi gjør på nettet," påpeker han. «Millioner av mennesker gjør det hver dag, og typen er opplevelsen mye av tiden, og det er derfor det er så viktig å få rett.
For noen år siden forsøkte en studie utført av Microsoft i samarbeid med MIT å sammenligne forskjellen mellom det som ble ansett som god og dårlig typografi. Det var ingen signifikant forskjell i form av lesehastighet, oppbevaring av informasjon eller forståelse. Kjernen tingen de fant var at med god typografi følte lesehastigheten raskere og det var en generell følelse av avslapning og glede. Med dårlig typografi, rynket folk mer, så egentlig fant de ut at god typografi gir deg et godt humør. Hvis det ikke er den ultimate brukeropplevelsen, vet jeg ikke hva som er! "
Denne artikkelen ble opprinnelig publisert i utgave 308 av nett, verdens mest solgte magasin for webdesignere og utviklere. Kjøp utgave 308 eller abonner på nett.
Vil du lære mer om å få mest mulig ut av typografi på nettet?
Richard Rutter har en kjærlighet og fascinasjon for typografi og medstifterFontdeck, en banebrytende internettypetjeneste. Som en selvutnevnt evangelist for nettypografi er Richard sjefarrangør av Clearleft’sAmpersand nett typografi konferanser.
På Generate London 2018 vil workshopen hans hjelpe deg med å lage nettsteder med engasjerende, passende, særegne, uttrykksfulle og lesbare nettypografi, som tilpasser seg skjermer i alle former og størrelser. Du lærer hvordan du kan kombinere århundrer gammelt håndverk med banebrytende teknologi - inkludert variable skrifttyper - for å designe og utvikle de beste opplevelsene for leserne dine.
Generate London finner sted fra 19. til 21. september 2018.Få billetten din nå.
