Her får du nogle eksempler på, hvordan tekst kan og bør formateres. Hvordan den kan se ud.

Men først et par ord om skrift på nettet – fonte og typografi.

Vi har vænnet os til at læse tekst på skærm, også lange tekster. Men det er sværere at læse tekst på skærm end på papir og vi har andre forventninger til tekst online.

Det har betydning, om læseren er ung eller gammel, har godt syn eller mindre godt.
Og naturligvis er det ikke uden betydning, hvilken slags skærm din webtekst skal læses på – stor eller lille computerskærm, god eller mindre god, smartphone, iPad etc. Din webtekst skal kunne læses på forskellige typer skærm.

Brede spalter med lille skrift er svære at læse

Det er bedst, med 40-45 enheder pr. linje på små skærme som smartphone, iPad.
Men ellers er omkring 70 enheder pr. linje det mest behagelige at læse på en skærm.

I øvrigt bør den bredeste spalte på dit website være mindst så bred, at der er plads til en YouTube video, som ofte er mindst 560 pixel bred

Sådan formaterer du din tekst

At formatere tekst vil sige, at du markerer en bid tekst og derefter vælger, hvilken type tekst det skal være.
Du kan bestemme, om teksten skal være:

  • understreget, gennemstreget, kursiv, fed
  • venstrestillet, centreret eller højrestillet
  • overskrift (seks forskellige)
  • almindelig brødtekst
  • billedtekst
  • citat
  • listetekst med bullets eller tal
  • indrykket i venstre side, indrykket i højre side
  • du kan også vælge farver

De forskellige teksttypers udseende styres af koder – på en af to måder:

  • af koder, der ligger i et såkaldt stylesheet.
  • af inline koder, der ligger omkring den eksakte tekst

Eksempelvis er der i et stylesheet disse seks forskellige koder til overskrifter:

Overskrift 1 <H1>

Overskrift 2 <H2>

Overskrift 3 <H3>

Overskrift 4 <H4>

Overskrift 5 <H5>
Overskrift 6 <H6>

Lige nu ser de forskellige overskrifter ud som herover.

Hvis jeg ændrer i det stylesheet, der bestemmer, hvordan overskrifterne ser ud, vil ændringen straks efter slå igennem på alle overskrifter.

Lad os sige, at du om et år år har brugt Overskrift3 i langt over 100 tilfælde.
Ændres stylesheetet for den kode, vil ændringen slå igennem på alle de tekstbidder, der er markeret som overskrift3

Det gør, at det er nemt at ændre udseendet radikalt på hele dit website.Helt almindelig brødtekst

Dummytekst i store mængder

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Det er ikke godt med en masse kursiv skrift

Kursiv tekst er svær at læse på skærm. Brug kun kursiv til enkelte ord. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Undgå fed skrift i store mængder

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Kan Holger finde linket?

Vi tror helt instinktivt, at farvet tekst er link.

Du forvirrer derfor folk, hvis du ikke meget konsekvent holder dig til, at din brødtekst har én farve – og tekst, der afviger derfra i farver er link. Helt slemt er det naturligvis, at bruge linkfarven i andre sammenhænge end til netop link.
Men uanset farven, vil vi opfatte farvet tekst som link.

Lorem ipsum dolor sit amet
consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

 

BRUG STORE BOGSTAVER

DET ER OGSÅ EN RIGTIG SKIDT AT SKRIVE HELE AFSNIT ELLER LANGE SÆTNINGER MED STORE BOGSTAVER – OGSÅ KALDET VERSALER. Det er svært at læse tekst, der er skrevet med lutter store bogstaver.

Vær opmærksom på, at mennesker med stress og/eller depression kan have særligt svært ved at holde fokus på lange tekster. Her kan du se eksempel på, hvordan du kan designe sider til folk, der er stressede.

Her er en skrfit-side med praktiske eksempler på linjelængder, skrifttyper, skriftstørrelser, brug af farver etc.

Pin It on Pinterest