01 / FULL-WIDTH HERO
Weby, které dávají značce prostor vyrůst.
Velká plocha, jasná hierarchie a minimum dekorací. Layout je široký, ale text zůstává čitelný a kontrolovaný.
BP PATTERN LAB · EDITORIAL AGENCY · FULL WIDTH
02 / EDITORIAL STATEMENT
Ne každá sekce potřebuje box. Někdy stačí typografie, rytmus a dostatek vzduchu.
Full-width přístup neznamená roztáhnout text od kraje ke kraji. Sekce může být široká, zatímco odstavec zůstává kolem 650–760 px. Právě ten kontrast vytváří moderní editorial pocit.
03 / STACKED CAPABILITIES
Čtyři vrstvy jednoho dobrého webu.
01
Strategie
Nejdřív směr. Co má web udělat, komu má mluvit a co má návštěvník pochopit během prvních sekund.
02
Struktura
Informační architektura, která vede bez vysvětlování. Každá sekce má vlastní úkol.
03
Design
Výrazná vizuální hierarchie, která si dovolí být velká, ale nikdy není hlučná.
04
Dotažení
Responzivita, výkon, přístupnost a drobnosti, které rozhodují o profesionálním výsledku.
08 / HUMAN NOTE
„Silný web nemusí být složitý. Musí mít jasný názor, dobře se číst a vést návštěvníka přesně tam, kam potřebujete.“
Design principle / BP Pattern Lab
Photo: PHC Software / Unsplash
09 / PROCESS
Pět kroků od chaosu k jasnému webu.
01
Zmapujeme problém
Nezačínáme barvami. Začínáme tím, co musí web vyřešit.
02
Postavíme kostru
Obsah a navigace dostanou pořadí, které dává návštěvníkovi smysl.
03
Najdeme vizuální jazyk
Typografie, obraz, kontrast a pohyb začnou pracovat jako jeden systém.
04
Otestujeme realitu
Mobil, tablet, rychlost, formuláře i slepé uličky dostanou praktickou kontrolu.
05
Spustíme s rezervou
Web je připravený růst, ne jen vypadat dobře v den spuštění.
10 / SERVICE INDEX
Služby jako obsahový index.
01 / WEB DESIGN
Prezentační weby
Jasný web pro firmu, službu nebo osobní značku.
02 / CONTENT
Obsahové weby
Struktura pro více témat, článků a dlouhodobý růst.
03 / LANDING
Landing pages
Jedna stránka, jeden cíl, minimum odboček.
04 / SYSTEM
Design systémy
Opakovatelné sekce, komponenty a pravidla pro další rozvoj.
11 / CASE STUDIES
CASE 01 · SERVICE BRAND
Klidná značka. Výrazná digitální přítomnost.
CASE 02 · B2B PLATFORM
Složitý produkt vysvětlený bez složitosti.
Photos: myHQ Workspaces & PHC Software / Unsplash
12 / CLOSING CTA
Nechte stránku dýchat. Ale nenechte návštěvníka tápat.
Velký závěr funguje jako poslední rozhodovací bod: jedna myšlenka, jeden další krok.
13 / EDGE-TO-EDGE SPLIT
Obraz může začít přesně tam, kde končí viewport.
Full-bleed obraz nepotřebuje záporné marginy. Root sekce je skutečně přes celou šířku a bezpečný vnitřní padding dostává jen textová část.
14 / REVERSED EDGE SPLIT
Stejný princip. Opačný rytmus.
Střídání obrazu vlevo a vpravo dává dlouhé stránce pohyb bez toho, aby bylo nutné každou sekci vymýšlet od nuly.
15 / ASYMMETRIC EDITORIAL GRID
EDITORIAL COMPOSITION
Ne všechno musí sedět v jedné rovné mřížce.
Asymetrie funguje, když stojí na pevném gridu. Text má svůj bezpečný sloupec a fotografie mohou pracovat až k okrajům stránky.