Sådan holder du din tekst ren
Intet er vigtigere end læsbarhed, når det kommer til teksten på dit websted.
Absolut ingenting.
Hvis du ikke kan læse ordene, så hvad laver du det? Hvem får din besked?
Lige så vigtigt som selve ordene er tekstdesignen - fra skrifttyper til bindestreg, til hvordan det hele er organiseret på skærmen. En del af designet indeholder ordene selv, hvordan du komponerer de "store ord" på dit websted kan også gøre en forskel.
Font valg
Der er kun så mange skrifttyper at vælge imellem. Det kan være ret overvældende.
Lad det ikke være. Det bedste du kan gøre når det kommer til læsbarhed er at holde det enkelt.
Vælg en eller to skrifttyper til dit websted. Et godt sted at starte er med en skrifttype til hovedtekstkopien og en anden til de store ord, såsom overskrifter, bannere og breakout-tekst. Brug af en anden skrifttype til hvert element er distraherende, forvirrende og vanskeligt at læse.
Start med en sans serif skrifttype til hovedkroppen kopi. Sans serifs er det letteste på øjet, når det kommer til screen reading og har tendens til at fungere godt, selv i mindre størrelser. Serif-skrifttyper kan begynde at "køre sammen" eller tabe deres serifs afhængigt af skriftstørrelse, skærmopløsning og endda farvekontrast mellem teksten og baggrunden.
Husk, at din kropseksemplar er den mest læste ting på webstedet og skal være let at fordøje på skærme til computere, tablet eller mobilenheder. Det er OK at bruge forskellige stilarter af denne skrifttype i kopien, men vær ikke skør. Bolding og kursiv er fantastisk til fokuspunkter, men store blokke af disse stilarter kan være vanskelige at læse.
Hvis du har brug for hjælp til at vælge et skrifttype, der prøver parringstegn med onlineværktøjer som Google Web Fonts eller Typecast.
Orddeling
Nedbrydning er dårlig. Det er grimt. Det er ineffektivt og forvirrende. (Og disse problemer forstørrer på tværs af platforme.)
Hold dig væk fra det.
Hvis du har brug for en genopfriskning, forekommer orddeling, når et ord deles i slutningen af en linje, hvilket får en del af et ord til at ses i slutningen af en linje, og resten af ordet vises i begyndelsen af det næste. Brug af bindestreg er stort set ude af stil, når det kommer til webdesign, men du kommer stadig på tværs af det fra tid til anden. (Det bruges jævnligt i trykte publikationer, såsom aviser.)
Tanken bag brug af bindestreger var at tillade tekst at rumme ordentligt (og jævnt) på tværs af linjer. Når du arbejder med retfærdig tekst, kan du løbe ind i ulige mellemrumsproblemer, når bindestreg er fjernet.
Men bindestreger, der bryder ord, kan gøre teksten svært at læse. At læse en bindestreg kan forårsage en person at snuble over eller forkert fortolke et ord. Ved hjælp af bindestreger kan det også utilsigtet ændre fokus på bestemte ord eller deres indflydelse i resten af kopien. Ubevidst fortæller en bindestreg en læser, at ordet er lidt mindre vigtigt end andre ord, som er helt gengivet.
Reserve bindestreger kun for de ord, der har brug for dem, f.eks. Med modifikatorer, og ikke at bryde linjer. Tekst bliver renere og mere professionel og har øget læsbarhed uden alle de irriterende bindestreger i enderne af linjerne.
Begrundelse
Ligesom bindestreg er fuld retfærdiggørelse faldet uden for webdesign, selv om den stadig bruges almindeligt på tryk.
Type med fuld justering fylder hver linje helt fra venstre margen til højre margen, så hver linje har samme bredde. Ved hjælp af fuld begrundelse opretter (og lukker) mellemrum mellem ord, så afstanden ikke fordeles jævnt. Brug af denne type tekstjustering kan fungere for nogle hjemmesider, men er ikke altid den mest visuelt tiltalende indstilling. Tag et kig på, hvordan din tekst går i stykker og prøver at læse det et par gange for at vurdere, om fuld begrundelse er en levedygtig mulighed.
Der er også andre typer "justering" eller tekstjustering. Du kan indstille tekst, så den står på venstre margen, på højre margen eller nedad i midten.
For engelsksprogede hjemmesider er venstre begrundelse den mest almindelige praksis. Tekst justeres til venstre margen og har en ragged højre kant. Følelsen er venlig og nem at læse. Fordi denne teknik er så almindelig, vil mange læsere ikke engang bemærke, hvordan teksten er oprettet. Dette er din bedste mulighed for at arbejde med store tekstblokke.
Højrejustering er en anden mulighed, men fungerer ikke så godt for klumper af tekst. Med tekst justeret til højre margen og ragged til venstre, er start- og stoppunkter placeret akavet på skærmen. Den naturlige læsningsrækkefølge er omvendt, og kun tanken om at læse tekst på denne måde (især i store mængder) kan gøre en læseren ubehagelig. Reserve højrejusteret tekst til små breakouts, hvis du vil indarbejde det i din designordning.
Centreret tekst er et ganske populært værktøj, selvom det ikke anbefales til store tekstblokke. (Tilladt, at du finder den brugt på denne måde over hele internettet.) Slaggene til centerjustering er meget som dem, der er forbundet med højrejusteret tekst - den har ikke "naturlig" start og stop og kan føle sig akavet på siden. Centerjusteret tekst kan føle sig noget formel (fordi den ofte bruges til ting som invitationer) og bør reserveres til små tekster, hvor vægt er vigtig. Det er ikke et godt valg for store kopiblokke.
Andre typer effekter
Stroker eller konturer
Brug i moderation på større tekstelementer som et fokuspunkt, men undgå i lille tekst.
Striketrykning eller understregning
Begge disse er almindeligt anvendt - gennemtrængende som en notation om, at noget ikke længere er gyldigt og understreger for vægt. Fortsæt med at bruge disse værktøjer, men brug dem sparsomt. Begge arbejder for små stykker tekst, men forårsager enorm læsbarhed, når det drejer sig om mere end et par ord.
Tilting eller forvrængninger
Disse effekter er gode, når du bruger typografi som en kunstform. De er ikke så effektive, når du forsøger at formidle en besked. Du bør undgå tekstmanipulationer og forvrængninger på hovedtekstkopi.
Farve
Brug af farve kan være et godt værktøj til at lægge vægt på et enkelt ord i en tekstblok. (De mest almindeligt og visuelt tiltalende farvekombinationer for tekstblokke er sort eller mørkegrå på hvid eller hvid på en mørk baggrund.) Mål for farver, der står i skarp kontrast til baggrunden, så de er nemme at se og læse. Super-lyse (tænk gul eller fuchsia) farver kan være vanskelige at læse, medmindre de bruges med et tykt, stort skrifttype. Overvej fed skrift med farve for yderligere vægt, men forbehold denne teknik for et begrænset antal ord.
Holder stor tekst ren
Selv om bindestreg kan betragtes som et præference i body copy, bør det altid undgås i stor type. Simple begrundelse stilarter er et must; venstre eller centreret tekst er dine bedste muligheder.
Headers, bannere, breakouts og andre store typer eller møbler skal være læservenlige. Ikke kun er disse ord brugt til navigation, de skal også læses for at holde folk bevæger sig gennem indholdet på din hjemmeside.
Hyphens er snuble.
Odd alignment hjælper ikke navigation.
Der er også et par andre ting at tænke på, når du planlægger designet til din store type.
Tænk på størrelsen af typen i forhold til hovedtekstkopien. Overskrifter og overskrifter, der er betydeligt større og dristige, vil tale højt til læsere, mens mindre, tyndere møbler vil hviske.
Kontrast er af største betydning for store ord. Når du vælger skrifttyper, skal du vælge noget til møbler, der ikke er for ligner kroppens kopi. Overvej en serif skrifttype, idet du husker at serifs fungerer bedst i store størrelser, så terminalerne og detaljerne på hvert brev ikke går tabt i pixels. En anden mulighed er at gå efter farve for at skabe en særskilt stil og hierarki for møbler.
Tænk også på rummet omkring de store ord. Sørg for at store ord hviler i nærheden af den kopi, de beskriver. Tilføj ekstra plads over hver overskrift eller overskrift og kondensér mellemrummet og kopien.
Skriv til at passe
Endelig tænk på pasform.
Se på, hvordan teksten linjer op, når du har skrevet kopien til de store ord. Fyldes det på linjen? Hvor mange linjer?
Visuelt vil du gå til overskrifter, der har et ensartet udseende. Dette gælder både typen stil og hvor længe ordene er. Undgå varer, der fylder en linje fuldstændigt og kun en brøkdel af den næste linje. Tænk på møbler i form af små rektangler; du vil have alt til at passe inde i rammen uden at rumme hvide rum.
Opret en stil til de store ord, uanset om det er et simpelt overskrift, der kun indeholder et par ord eller to linjers komplette tanker over hvert afsnit af teksten. Overvej en del af denne stil som den type overskrift, du bruger - vil det stille et spørgsmål, være en erklæring, fortæl læserne, hvad de skal gøre, vis frem til hvordan man gør noget eller være mere indirekte og søde med ord og frasering?
Prøv at skrive overskrifter og overskrifter, der kun er en linje lange (to i det højeste), brug aktive ord.
Dette kan være svært at opnå og være forsigtig med tricks. Grib ikke en tesaurus og erstat et stort ord for en kort, bare for at få tingene tilpas. (Du vil risikere at bruge det forkerte ord eller bruge et udtryk, som dine læsere måske ikke kender meningen med.) Tænk konversationelt, når du skriver. Skriv ordene og derefter revurdere (klipp eller tilføj), så du opretholder integriteten af det, du vil udtrykke og producere ren, nem at læse kopi.
Konklusion
Ren kopi handler om mere end bare simple skrifttyper og bindestreger. Det handler om at skrive kopi, der giver mening og præsenterer det på en læselig måde.
Tænk på dit publikum, når du lægger det sammen. Du ville bruge en anden teknik og stil, når du skriver blogindlæg om bryllupsideer (traditionel, feminin føler) versus blogging om tatoveringer (sandsynligvis mere edgy og mørk). Dit publikum har indflydelse på billeder, de skal også påvirke din kopi.
Men vigtigst af alt, tænk på, hvordan det hele kommer sammen. Strip alt andet ud af dit websted design, så kun den type bagved. Er det let at læse? Skal du zoome ind eller ud? Skør du på skærmen? Dette er de rigtige spørgsmål, du skal svare, da læsbarhed i slutningen af dagen er vigtigst.
Hvilken tekst finder du svært at læse online? Hvilke teknikker bruger du til at holde din tekst læselig? Lad os vide i kommentarerne.
Fremhævet billede / miniaturebillede, tekst billede via Shutterstock.