Webbfonter

1

Krav på skärmfont

StyleSheets

Kantutjämning

2

Inbäddning

-TrueType

-Skyddsnivåer

-Bitstream stöldsäker

-Formgivare mot

3

Microsoft gratis

-Bakgrund

-Matthew Carter

-Thomas Rickner

Adobes webfonter

4

Fontanalys

Verdana

-Stilprov mager

-Stilprov fet

Georgia

-Stilprov mager

-Stilprov fet

Stilprover 10-12

-Arial

-Times

-Myriad web

-Minion web

Slutsats

Storleksproblemet

Reflektioner




Artiklar

Baskerville

Caslon

Cloister Old Style

Formatmallar CSS

Frakturen

Garamond

Jenson MM

Minion MM

MultipleMaster

Myriad MM

Pekpinnar 1

Pekpinnar 2

Poynter

RailwayType & Agenda

Tidningstypsnitt

Webbfonter

Webbtypografi

1 2 3 4

Storleksproblem

Typtrivsel

God typografi i Word (pdf)

Bildskärms-
typografi 1995




 

Webbfonter för läsbarhet på bildskärm

För typsnitt på bildskärm gäller delvis andra villkor än för tryck. Stil och utrycksfullhet träder här tillbaks för grundläggande krav på läsbarhet, där finesser och finstämd linjeföring blir rätt meningslös. Aftonklänning och smoking göre sig ej besvär, här gäller jeans och träningsoverall.

Det spelar faktiskt inte så stor roll om tecknen på bildskärmen följer de teckenformer vi ser i utskrift, det viktiga är att de har viss släktskap och är läsbara. Och att bildskärmens disposition av texten ger vägledning till hur texten blir disponerad i tryck.

Det viktigaste för typsnitt på bildskärm är kombinationen av teckenform och teckenmellanrum och inte minst ordmellanrummens storlek.

Tecknen måste kunna särskiljas och det underlättas av öppna former och små särskiljande detaljer. Tecknen måste vart och ett skiljas åt av lite luft. Det underlättas av enkla former och räta linjer. Slutligen måste orden skiljas åt av precis så där lagom mycket luft, så där lagom mycket mer luft än som finns mellan tecknen.

Få typsnitt klarar i dagsläget denna robusta matematik. Saken kompliceras av att välartade typer (Myriad) uppför sig riktigt illa i vissa teckenstorlekar, medan busar (Arial) blir gentlemän i rätt kostym.

StyleSheets

Med HTML 4 blir Cascading Style Sheets standard för webben. <FONT>-taggen ska bort, och istället ska typografering ske med hjälp av stilmallar. Det ger oss bättre möjligheter att styra typografin på webben. Med CSS kan man inte bara välja typsnitt och grad i ett antal steg, utan i detalj specificera teckenstorlek, linjevikt, stilsort etc, med samma möjligheter som i DTP. Dessutom kan placeringen av stycken och andra grafiska objekt styras på i princip samma sätt som i desktop-programmen, med angivelser av avståndet från sidans nollpunkt i övre vänstra hörnet.

Därmed blir grafisk formgivning en realitet på webben. Därmed kan också html-koder som avser struktur och innehåll återfå sin egentliga funktion, t.ex. att H1-6 anger rubrikhierarkier. Valfri formgivning kan sedan knytas till respektive header-tag. Nya möjligheter öppnar sig, men aktualiserar ånyo typsnitts-problemet. Det spelar ingen roll hur fint man formger en sida och hur noggrant man specificerar typografin – om användaren inte har det typsnitt som anges i stilmallen blir det ”mycket skrik och lite ull” som kärringen sa när hon klippte grisen.

Knappar och kantutjämning

Ett sätt att lösa problemet med återgivning av typsnitt på webben är ju att arbeta med text som gif-bilder, i alla fall där det är viktigt med den grafiska formgivningen. Kantutjämning erbjuder en lösning, men den skapar också problem.

Att kantutjämna eller inte kantutjämna, det är frågan. Det har blivit kutym på webben att använda kantutjämning i små rubriker och knapptexter. Därmed har det blivit suddigt på webben. I början trodde man väl att det var något fel på bildskärmen eller att man fått smolk i ögat, men nu har vi vant oss vid dimman och och anstränger oss att tolka de tecken som döljs i diset. Men ur typografisk synpunkt är det enastående dåligt. Aldrig någonsin skulle vi acceptera så dålig teckenåtergivning i tryck. Men på webben är vi toleranta – men även där kan och bör tecken vara klara, tydliga och lättlästa. Och det är ingalunda omöjligt.

Problemet uppstår när man så gärna vill använda de snygga typsnitt som man använder i tryck och som kanske hör till en organisations grafiska profil. Utan kantutjämning ser tecknen ofta ut som fluglort eller som vilket trist typsnitt som helst. Kantutjämning kompenserar och ger en ganska stor likhet med de tryckta tecknen – för webbformgivaren vill säga. För den vanlige läsaren, som inte ser någon särskild poäng med Gill Sans Bold framför Franklin Gothic eller Arial Bold, ser det bara grötigt och suddigt ut. Arial utan kantutjämning är i dessa lägen faktiskt att föredra, ur typografisk och informativ synpunkt. Det finns dock några alternativ.

I små grader, under c:a 18 punkter (varierar mellan olika typsnitt och vikter), är det inte längre fråga om kantutjämning, utan om teckenutjämning. I dessa små grader omfattar tecknets grundstreck bara två till tre punkter eller mindre, och av dessa punkter ska en mjuk tonövergång skapas. En sådan toning måste kanske omfatta tre–fyra punkter. Alltså måste nedtoningen börja inne i själva tecknet, som helt enkelt äts upp eller suddas ut. Det är inte bara kanten, utan själva tecknet, som jämnas ut. Och det var ju inte det man ville.

Kantutjämning bör därför endast användas i större rubrikgrader, där kanten blir mycket liten i förhållande till tecknets linjer. Och där bör man verkligen använda kantutjämning. I mindre grader kan man använda kantutjämning för att skapa en softad effekt, där den effekten är viktigare än läsbarheten. Problematiken illustreras av bildexemplen nedan.

Gill Sans 16 och 12 kantutjämnad

Av bildexemplen får Gill Sans representera normaltillståndet med kanutjämnade tecken på designade webbsidor. I båda graderna känns Gill Sans igen, men tecknen är otydliga och kräver en ansträngning från läsarens sida att tolkas rena.

Myriad Webb 15 och 12 kantutjämnad

Myriad Web är på intet sätt bättre än Gill Sans. Stilmässigt är det faktiskt bara nyanser som skiljer dem åt i kantutjämnat skick och suddigheten är densamma. Arial är lite öppnare, trots att Myriad som typform är öppnare i tryck. Myriad Web har egentligen ingenting att erbjuda härvidlag.

Övriga exempel nedan saknar kantutjämning, och är därmed lättare att läsa, men alla är inte vackra eller stilrena.

Arial 14 och 11

Den mindre graden ser avsevärt trevligare ut än Gills mindre, men den större graden är påtagligt klumpig. Tillriktningen är dock i allmänhet god. Om man gör bilden i Photoshop får man individuellt anpassa vissa teckenmellanrum, men det gäller för samtliga fonter som sätts utan kantutjämning i detta program.

Myriad Web 15 och 12

Myriad i Adobes speciella webb-version har inga egenskaper som motiverar det framför Arial.

Verdana 13 och 10

Verdana har en öppnare teckenform och riktigt lyser av klarhet och enkelhet. Texten är lättläst och i mina ögon inbjudande som knapp eller klickbar rubrik. Estetiskt sett håller det måttet, och kan konkurrera med Gill Sans i detta sammanhang. Åven den mindre graden är tydlig och lättläst. Tveklöst är Verdana överlägsen som knapp-typsnitt i alla avseenden utom ett; det tar upp för mycket plats.

Tahoma 13 och 10

Tahoma är förebilden för Verdana och har i stort sett samma teckenformer, men är i vissa tecken smalare och rent allmänt tätare tillriktad. Tahoma är därför bättre för knappar och rubriker, när Verdanas luftigare teckenmellanrum blir för utrymmeskrävande. Men Tahoma distribueras inte längre med Microsofts program och OS och finns inte som standard på Mac-sidan. Därför bör det användas i form av gif-texter när det används som komplement till Verdana.

>>> Webbfonter del 2: Inbäddningsproblematiken >>>

 

© Text och illustrationer Stefan Lundhem

| FyrisFonts | Typsnitt | Beställa | Artiklar | Ordbok | Länkar | Innehåll | Om |

< - - - Sidan uppdaterad 010304 - - - >