Síla prázdného
prostoru.
Proč je v designu důležitý „white-space“? Podívejte se, jak vhodným rozložením prvků své stránky zpřehledníte.
V této lekci
Prázdné místo vytváří strukturu, hierarchii a harmonii
Místo, které na stránce zůstává nezaplněné, se v designu nazývá „white-space“. Zahrnuje části stránek bez obsahu i prostor mezi prvky. Ačkoliv se může zdát jako mrhání místem, plní zásadní funkce:
Prázdný prostor přidáte kolem libovolného prvku nastavením okrajů v záložce Poloha a rozložení 
.
Obsah chce také dýchat
Prázdné místo ulehčuje pozorovateli soustředit se na konkrétní bod. Čím větší okraje nastavíte, tím dříve si prvku návštěvníci všimnou.
Tomu, co má poutat největší pozornost, dopřejte nejvíce místa.
Co je blízko u sebe, jeví se jako celek
Mozek nevnímá web jako soubor samotářů, ale jako vzájemně propojenou kompozici. Prvky blízko sebe působí jako jeden tým. Toho využíváme pro logické členění obsahu.
Vizuální členění skupin vyjádříte pomocí svislých mezer:
Největší mezery: mezi hlavními sekcemi (např. Ceník vs Galerie)
Střední mezery: mezi podskupinami (kategorie ceníku)
Malé mezery: mezi jednotlivými položkami
Čím jemnější členění, tím menší mezery
Kdyby byly všechny mezery stejné, oko by nepoznalo, co k čemu patří. Čím hlouběji do struktury jdete, tím menší mezery používejte.
Zachovejte hierarchii rozestupů pro logickou orientaci návštěvníka.
Vytvořte vizuální rytmus
Lidé milují vzory. Pokud nastavíte určitou vzdálenost mezi nadpisem a textem, používejte ji takovou všude. Opakováním stejných rozestupů vytvoříte harmonii, ve které se návštěvník intuitivně zorientuje.
- Stejné rozestupy mezi sekcemi
- Stejné okraje u sloupců
- Stejné mezery v galerii
- Stejné paddingy pro tlačítka
V saywebpage jsou rozestupy a okraje nastaveny již za Vás — nemusíte si nad tím lámat hlavu.
Někdy je lepší to přehnat
Stránky budou působit lépe, když budou mít raději „přehnaně“ velké okraje, než kdyby byly prvky na sebe natlačené. Když chcete web zpřehlednit, přidejte prázdné místo.
1 Prázdné místo vytváří hierarchii a rytmus.
2 Většími rozestupy zpřehledníte své stránky.
3 White-space poutá pozornost k důležitému.
4 Jednotné rozestupy ulehčují orientaci.
Vytvoř si
vlastní stránky
Profesionální web zvládneš levou zadní. Začni hned teď a využij 30 dní na vyzkoušení zdarma.
Bez nutnosti zadávat platební kartu.
