Skip to main content

Grafisk design

Principer för grundläggande webbdesign

Luft och mellanrum

Luft, eller tomma ytor, gör att innehållet känns lugnt och lätt att läsa. När du ger element mer utrymme runt sig blir sidan renare och enklare att förstå. Det hjälper också användaren att se vad som hänger ihop och vad som är skilt åt.

Kontrast

Kontrast gör att viktiga delar syns bättre. Det kan handla om färg, storlek eller form. Hög kontrast mellan text och bakgrund gör texten lätt att läsa. Använd kontrast när du vill lyfta fram något, till exempel en knapp eller en rubrik.

Storlek och proportioner

Olika storlekar hjälper användaren att förstå vad som är viktigast. Större element drar mer uppmärksamhet. Mindre element visar att något är mer detaljerat eller mindre viktigt. Håll proportionerna enkla och konsekventa så att sidan känns harmonisk.

Justering och linjer

Element som ligger i linje skapar ordning och tydlighet. När text, bilder och knappar följer samma osynliga linjer blir sidan lättare att läsa. Oreda i justeringen gör att designen känns rörig. Håll dig till några få tydliga linjer.

Färger

Färger påverkar känslan på sidan. Använd få färger och låt dem ha tydliga roller. En färg kan vara huvudfärg, en annan stödjande och en tredje till knappar eller viktiga delar. Se till att färgerna fungerar bra tillsammans och att kontrasten är tillräcklig.

Typografi

Typografi handlar om typsnitt, storlek, radavstånd och stil. Välj ett typsnitt som är lätt att läsa. Använd få olika typsnitt för att skapa lugn. Se också till att texten har bra luft mellan raderna och tillräckligt stor storlek.

Visuell hierarki

Visuell hierarki hjälper användaren att snabbt förstå vad som är viktigast på sidan. Det handlar om hur du ordnar rubriker, text, bilder och knappar. Större, fetare eller färgstarka element hamnar högre i hierarkin. Mindre och svagare element hamnar lägre.