Tips til design
Brugervenlighed
Fremhæv dine links. Brugerne leder efter links, så hvis dine linktekster er sigende finder brugeren hurtigt, det han leder efter.
Brugervenlige tekster
Typografi
Typografi handler om tekstens fysiske udtryk. Typografien beskæftiger sig med skrifttyper, layout af tekster og læselighed.
Her er en koncentreret oversigt over typografiens hovedpunkter med fokus på typografi på Internettet.
Typografiske begreber og værktøjer:
Skrifttyper på Internettet
Skrifttyper til webbrug skal være lette at læse, og så skal de være installeret på brugerens computer.
Normalt anbefaler man sans serif (groteske) skrifter til webbrug. De kendeste sans serif skrifter er Arial og Verdana. Verdana er en stor åben font specielt designet til skærmen. Generelt signalerer sans serif fonte en moderne og seriøs stil.
Men på moderne skærme kan serif (antikva) skrifter sagtens bruges. Georgia er designet til skærmbrug og meget velegnet. Times new roman ikke egnet. Den er alt for kompakt, og svær at læse. Serif fonte signalerer tradition og gamle solide værdier.
Nogle af de mest udbredte fonte på nettet er:
- Verdana
- Arial
- Georgia
- Trebuchet
Skrifttyperne udgør en væsentlig del af typografien.
Her kan du læse meget mere om skrifttyper, fonte, statistikker og skrifttypernes visuelle signaler.
Overskrifter. Typografiske hierakier
Overskrifter skal give overblik, strukturere og skabe typografiske hierakier i tekster. Brug dem til at:
- Give brugeren informationer om indholdet.
- Dele tekst og informationer op i mindre dele.
- Skabe hierakier. Vis hvad der er vigtigst!
Brug tydelige kontraster i overskrifterne. Enten i form af størrelseskontrast. Eller formkontrast. F.eks. ved at vælge en anden skrifttype til overskriften. Variation i typografien skaber kontrast, og så skiller overskrifterne sig ud, og skaber både opmærksomhed og overblik.
Brug ikke for mange niveauer i dine overskrifter. Overskrift, mellemrubrik ("under-overskrift") er ofte passende.
Til webbrug skal du bruge mange overskrifter. Brugerne læser ikke dine sider. De skimmer dem!
Læs hvordan du understøtter skimningen med brugervenlige tekster.
Font-størrelse
Font-størrelsen afhænger selvfølgelig af den font, man har valgt at bruge.
Men fontstørrelsen er også afhængig af moden på nettet. Efter en lang periode, hvor meget små fontstørrelse har været moderne, går trenden nu i retning af større fonte. Tydeligst er det inden for web 2.0, hvor f.eks. både tekster og menuer bliver større.
Når de forskellige font-størrelsen skal vælges, så er det vigtigt at tænke på størrelseskontrasten skal være tydelig.
Prøv f.eks. 1.5em, 1.2em og 1em til overskrift, mellemrubrik og brødtekst.
Hvis målgruppen er ældre over 50, eller børn under 10 skal man bruge store fonte. Gerne på 12px eller større.
Linjelængde
Undersøgelser viser at hvis linjelængden når over 60-70 tegn, bliver teksten sværere at læse.
Derfor er det en god typografisk regel at holde en faste bredder på sine tekster. Ellers kan linjerne blive alt for lange på større skærme. For at udnytte skærmens bredde bedst, kan det være nødvendigt at dele det tekstlige indhold op i spalter.
Linjeafstand
Linjeafstanden (skydning i typografisk fagsprog) er afhængig af skriftstørrelsen, skrifttypen og linjens længde. Jo længere linjer jo større linjeafstand. En tilpas linjeafstand gør det lettere for øjet at fange den næste linje og fortsætte læsningen på den.
Et bud kunne være en linjeafstand (line-height i css og html) på 16px til en font-størrelse på 11px.
Justeringer i typografien
Venstrejusteret tekst er den mest almindelige justering til brødtekst og læse-typografi. Den er meget læsevenlig, da øjet let finder den næste linje, på grund af den faste forkant.
Pas på med centreret tekst. Design med mange centrerede elementer giver ofte et kedeligt og statisk indtryk. Centrerede brødtekster bliver meget vanskelige at læse, da starten på linjerne er svære at finde for øjet.
Pas også på med at bruge centrede overskrifter til venstrejusteret tekst. Det kan give et rodet og ubeslutsomt udtryk, hvis vi ikke tør tage en beslutning om at enten at holde kant eller centrere.
Brugt med omtanke kan centrerede elementer signalere balance og harmoni.
Højrejusteret tekst kan være god til tabeller eller f.eks. konsultativ typografi, hvor man gerne vil have bestemte ting til at stå nær hinanden. Gestaltloven om nærhed
| Navn: | Jens Jensen |
| By: | Aarhus |
| Beskæftigelse: | Typograf |
Højrejusteret tekst kan også bruges til at skabe opmærksomhed eller dynamik.
Lige margener (justify) kan være meget farlig at bruge, da det kan give uhensigtsmæssige resultater.
Især ved korte linijer bliver nogle ord trukket så langt fra hinanden, at afstanden mellem ordene, bliver længere end afstanden mellem linjerne. Det kan gøre teksten særdeles svær vanskelig at læse.
På nettet ses denne typografi oftest brugt i blogs.
Litteratur om typografi
Dette har kun været en meget kort gennemgang af de vigtigst regler i typografien. Og primært rettet mod nettet.
Hvis du vil vide mere om typografi, f.eks. om typografi til tryk, kan jeg stærkt anbefale: "Grundbog i typografi" af Henrik Birkvig. Han giver en meget grundig gennemgang af grundlæggende typografi.
En anden god bog om typografi er Kim Pedersens bog: Displaytypografi. Som titlen antyder er fokus i bogen displaytypografi. Bogen er udsolgt fra forlaget, men kan sikkert findes p dit bibliotek.
3 former for typografi
Typografi kan opdeles i 3 hovedområder:
- Læse-typografi
- Display-typografi
- Konsultativ typografi
Læsetypografi
Læsetypografien beskæftiger sig med traditionel tekst, der er bygget op med overskrifter og brødtekst.
Læsetypografien udgør over 90% af den typografi vi ser på nettet, og det er læsetypografien, jeg har fokuseret på her.
Konsultativ typografi
Konsultativ typografi bruges til hurtige opslag. F.eks. til navne/adresse lister, dispositioner, oversigter etc.
Konsultativ typografi skal være hurtig at få øje på, overskue og læse.
Jens Jensen
Typografi-vej 101
8000 Aarhus C
Display Typografi
Display typografi bruges som blikfang. F.eks. i logo'er som logotypes eller opmærksomhedsskabende overskrifter.
Men displaytypografien er meget mere end bare overskrifter. Den er udsmykning og formidler af visuel indentitet, og behøver ikke at være læsevenlig.
På nettet vil man oftest bruge billeder til displaytypografi, for at sikre at alle brugere vil se det samme resultat.
Her er et eksempel fra Dr. Martens hjemmeside, hvor produktkategorien er skrevet med displaytypografi.
Stilen er håndskrift med øls hånd og fonten skal sammen med de øvrige visuelle virkemidler formidle en lidt rå og rustik grunge-agtigt stemning.
