atstarpes
1. Whitespace (atstarpes un elpa dizainā)
- Izmanto konsekventas vertikālās atstarpes starp blokiem (piemēram, 24–48px).
- Ievēro lielāku iekšējo atstarpi (padding) ap svarīgiem blokiem, piemēram, hero sekcijām.
- Nelieto pārāk mazas atstarpes – tās vizuāli “saspiest” lapu un apgrūtina uztveri.
- Izmanto lielākas atstarpes sekcijām ar atšķirīgu fonu, lai radītu dabiskas sadaļu pārejas.
- Paturi prātā “white space hierarchy”: jo svarīgāks elements, jo vairāk vietas tam apkārt.
krāsas
2. Krāsas (Colors)
- Izmanto ne vairāk kā 3–5 primārās krāsas visā projektā.
- Definē brand palette: primārā, sekundārā un akcenta krāsa.
- Ierobežo košas krāsas tikai CTA pogām vai svarīgiem elementiem.
- Foniem priekšroku dod gaišiem vai ļoti tumšiem toņiem, lai nodrošinātu augstu kontrastu ar tekstu.
- Nodrošini, ka krāsu kontrasts atbilst WCAG (4.5:1 tekstam).
- Izmanto vienādas krāsas toņus visām ikonām vai ilustrācijām.
3. Tipogrāfija (Fonts & Font size)
- Izvēlies 1 primāro fontu tekstam un 1 akcenta fontu virsrakstiem (ja nepieciešams).
- Veido konsekventu hierarhiju (piemērs):
- H1: 40–60px
- H2: 28–40px
- H3: 22–28px
- Body: 16–18px
- Small text: 14px
- Minimālais rindas augstums (line-height) — 1.4–1.6.
- Nelieto vairāk par 2–3 dažādiem font-weight visā lapā.
- Nodrošini pietiekamu fonta izmēru arī mobilajā skatā (vismaz 15–16px parastajam tekstam).
