Visuell hierarki

visuell hierarki grunder webbdesign

I korthet

Visuell hierarki innebär att organisera designelementen för att styra besökarens ögon så att de fokuserar på sidans viktigaste delar.

Nyckelpunkter för Visuell hierarki

1

Visuell hierarki kan implementeras med hjälp av  storlek, färg, position med mera.

2

Hierarkin styr användarupplevelsen. Om dina besökares ögon dras till olika saker får de olika upplevelser av sidan.

3

Använd 2-3 teckenstorlekar för att indikera betydelseordning, alternativt starka färger för viktiga element.

4

En bra turmregel är att inkludera en stor, mellan och liten komponent i din design.

5

Eftersom visuell hierarki omfattar det du ser, betyder det att alla olika delar på sidan har sin egna hierarki. 

6

Om du kisar, eller lägger ett suddigt filter över din design, kommer detaljer försvinna och du kan analysera hierarkin bättre.

Exempel

TEXT

Läs mer om Visuell hierarki

kontrast grunder webbdesign

Kontrast

Kontrast innefattar användning av olika färger, former eller storlekar för att särskilja ett element från resten.
whitespace webbdesign

Whitespace

Whitespace är tomrummet runt och mellan element på en designyta, vilket skapar balans och ökar läsbarheten.
proportion grunder webbdeisgn

Proportion

Proportion innebär att du använder storlek för att symbolisera värde och prioritering i din komposition.
Rulla till toppen
Vi använder kakor för att göra din upplevelse bättre.