Architektura webu

Jedna kostra, pět kůží — a co by mohlo přijít po ní

Většina webů, které stavím, vychází ze stejné osvědčené kostry — mění se barvy, fonty a obsah podle klienta, architektura zůstává. Níž je vidět, jak taková základní šablona vypadá — a pak pět úplně jiných přístupů k designu, kterými by šlo portfolio rozšířit o weby, co nejsou jen přebarvenou verzí téhož.

Co mají společné

Současná sdílená šablona

logo · odkazy · CTA tlačítko (fixní lišta, ztmavne při scrollu)
HEROkicker → velký nadpis → podtext → 2 CTA tlačítka → 3 statistiky/fakta
karta
karta
karta
01
02
03
04
FAQ (accordion) → kontaktní formulář → patička

Judo Klatovy

tmavá navy + klubová červená

Krajský svaz juda

stejná kostra, krajská modrá

RacekSoft

světlá, teplá krémová

U Staré Lípy

fotoheró, teplá amber

TAXI Chalupa

tmavá + výstražná žlutá

Pět nových směrů

Kompletně jiná architektura

Každý koncept je živá ukázka — klikněte a prohlédněte si ho celý.

01 / Redakční

Editorial

Pro: osobní značky, fotografy, autory, butikové poradce

Web jako rozevřený časopis — asymetrický grid, velký serif titulek přes fotku, citace na okraji, popisky u obrázků jako v tisku. Prodává hlas a příběh, ne tlačítka.

  • Žádné hero CTA na první pohled — headline a fotka nesou váhu samy
  • Pull-quote v kurzívě jako vizuální kotva sekce
  • Navigace minimální, klidná
Otevřít ukázku — Ateliér Světlo
02 / Technický

Brutalist

Pro: vývojářské nástroje, technické produkty, sebevědomé startupy

Žádné stíny, žádné zaoblené rohy. Monospace písmo, silné černé linky, jedna výstražná barva. Web, co vypadá jako technická specifikace, ne jako prodejní leták.

  • Viditelné mřížkové linky místo neviditelných paddingů
  • Tlačítka jako terminálové příkazy, ne bubliny
  • Sekce oddělené silnou čarou, ne prázdným místem
Otevřít ukázku — NULA monitoring
03 / Přehledový

Bento grid

Pro: firmy s víc službami najednou, kde zákazník chce rychlý přehled

Žádný lineární scroll příběh — všechno je vidět naráz jako modulární dlaždice, podobně jako přehled aplikace. Rychlejší rozhodování pro zákazníka, co spěchá.

  • Obsah je "prostorový", ne "časový"
  • Jedna dlaždice = jedna odpověď na jednu otázku zákazníka
  • Barva použita sémanticky, ne jen dekorativně
Otevřít ukázku — Studio Rovnováha
04 / Atmosférický

Kinematografický scroll

Pro: restaurace, penziony, svatby, zážitkové služby

Web jako film — celoobrazovkové scény, jedna myšlenka na obrazovku, jemný parallax, tenký indikátor postupu místo klasické navigace. Prodává pocit, ne fakta.

  • Snap-scroll mezi "scénami"
  • Tečkový indikátor scén místo tradiční nav lišty
  • Text je řídký a pomalý — ticho je součást designu
Otevřít ukázku — Zámecký Sad
05 / Řemeslný

Paper & Craft

Pro: řemeslníky, pekárny, rodinné farmy, lokální obchody

Teplý papírový podklad, jemně natočené "kartičky" jako přilepené samolepky, nedokonalost jako hodnota — vypadá to udělané rukou, ne vygenerované šablonou.

  • Drobné nahodilé natočení prvků místo dokonale rovných linií
  • Odznaky/samolepky místo strojových štítků
  • Stín jako "papír na papíře"
Otevřít ukázku — Pekárna U Mlýna

Některý z těchto stylů sedí i vám?

Klidně z něj postavíme skutečný web na míru vaší firmě.

Pojďme se pobavit