Denne anden artikel i serien om, hvordan vi ikke-professionelle layout’ere kan lave lidt flottere layout, handler om at placere ting pænt. Uerfarne udi layout placerer ofte en sides indhold tilfældigt lidt rundt omkring efter en vag fornemmelse, hvilket resulterer i et rodet og amatøragtigt udseende.

Denne artikels regel hedder “Placering” og handler om at placere indhold pænt og ordnet, så det giver læseren et professionelt indtryk.

Eksempel 1

Toppen af denne artikel er et godt eksempel på regel 2. På figuren nedenfor har jeg sat røde streger ind for at illustrere, hvor kanter flugter med hinanden.

For eksempel flugter linierne i titlen, forfatter etc. med linierne i selve teksten, den såkaldte brødtekst. Det store D’s bund flugter også med disse linier og det store D’s top flugter med den øverste brødtekstlinies top.

Den venstre kant af brødteksten flugter med den venstre kant på den grå baggrundsboks om det store D. Denne flugt-linie ville være pænere, hvis den grå boks stak lidt ud til venstre, så brødteksten og det store D flugtede. Det har jeg imidlertid aldrig fundet ud af at kunne gøre automatisk i css, som bruges til at sætte layout’en på websider. Læs eventuelt mere om matematikken bag hvordan man i css kan Starte med stort bogstav.

I venstre side flugter titlen, forfatter etc. med venstre kant på papiret. Tilsvarende flugter toppen af teksten med øverste kant på papiret. Det er helt i orden, at der er en bred margin mellem papirets kant og teksten. Så længere indholdets kant forløber pænt lige med papirets kant, så ser læseren det som en pæn og ordnet sammenhæng. Det samme gælder naturligvis også mellem to forskellige elementer af indholdet.

Eksempel 2

Den venstre dialogboks følger ikke regel 2, og den virker ganske forvirrende og bestemt ikke professionel. Den højre dialogboks følger meget bedre regel 2, og den er pæn, velordnet og distraherer ikke fra indholdet.

Eksempel 3

Der er ingen grund til at overskrifter rykkes øjensynligt tilfældigt ind på linien. Følg Regel 2 og lad alle linier flugte med hinanden.

Mere om justering af tekst

Der er fire gængse måder at justere tekst, så teksten på en pæn og ordnet måde flugter med papiret.

Venstre-justering, øverst til venstre på figuren, er nok det mest normale (i vestlig venstre-til-højre skrivning) og er altid sikkert til længere tekster. Højre-justering, øverst til højre på figuren, bruges mest til få tekstlinier eller som en speciel effekt. Centrering, nederst til venstre på figuren, virker formelt på de fleste læsere, og egner sig derfor bedre til bryllupsinvitationer end til lange tekst-passager. Fuld justering, nederst til højre på figuren, giver et meget pænt og ordnet indtryk men har den ulempe, at korte linier tit får store huller mellem ordene. Derfor er fuld justering bedre egnet til bøger end til de smalle spalter i en avis.

Tekstbehandlingsprogrammer venstrejusterer tekst ved at lade de yderste bogstavers venstre kant flugte. Desværre lægger menneske-øjne typisk mere vægt på bogstavers tyngde end på deres venstre kant. For eksempel har bogstavet “V” sin tyngde i midten, mens bogstavet “L” har sin tyngde mod venstre. Hvis de to bogstaver skal flugte under hinanden, ser det bedst ud, hvis “V” rykkes lidt længere ud til venstre. Så hvis resultatet skal være rigtig flot, skal man justere hver enkelt linie efter øjemål.

Lodret justeres tekst normalt som vist på følgende figur.

Bogstavernes såkaldte basislinie (engelsk: baseline) står altid i samme højde, illustreret med den røde linie, uanset bogstavernes størrelse.

Læs mere

De fire første regler, jeg beskriver i denne artikelserie, er inspireret fra den engelske bog The Non-Designer’s Design Book af forfatteren Robin Williams.