Vlastní modelový projekt
Jak jsem navrhl a vytvořil ukázkový web dílny
Jak může vypadat web malé dílny, která potřebuje představit svou práci a pomoci návštěvníkovi vybrat službu? Připravil jsem vlastní modelový projekt od návrhu po fungující web. Na něm ukazuji vzhled, práci s obsahem i ovládání jednotlivých částí.
Spolupracuji převážně online s klienty z celého Česka i Slovenska.
Jde o smyšlenou truhlářskou dílnu s ilustračními fotografiemi. Není to reference skutečného zákazníka. Formulář a rezervace jsou demonstrace: nic neodesílají a nevytvářejí skutečnou rezervaci.
Otevřít živou ukázku ↗
Modelové zadání
Návštěvník má rychle pochopit nabídku, prohlédnout si odpovídající inspiraci a dostat se ke kontaktu. Majitel takového webu může potřebovat měnit fotografie nebo přidávat novinky bez zásahu do kódu. Tyto potřeby byly základem návrhu.
Služby a inspirace mají vlastní prostor
Úvod představuje nabídku a vede k realizacím. Galerie používá kategorie, takže lze vybírat například kuchyně nebo skříně. Jednotlivá alba mají vlastní detail a fotografie lze zvětšit a procházet klávesnicí i dotykem.
Kuchyňská služba má samostatnou stránku s modelovými variantami. Když návštěvník přejde z kuchyní na poptávku, formulář už ví, že jde o kuchyň, a nemusí ji znovu vybírat. Co už sám napsal nebo vybral, se tím nepřepíše.
Čeština, angličtina a telefon
Web obsahuje českou i anglickou verzi. Přepnutí jazyka zachovává odpovídající detail realizace nebo služby. Světlý a tmavý motiv doplňuje rozvržení pro různé šířky obrazovky.
Na telefonu je důležitá dostupnost ovládacích prvků, čitelné popisky a použitelná galerie. Při návrhu proto nestačil pohled na jeden desktopový náhled; kontroloval jsem i úzké zobrazení a zvětšené písmo.
Obsah se dá spravovat samostatně
Ukázka používá Pages CMS pro předem určené texty, fotografie, novinky, realizace a detail služby. Editor mění obsah v samostatném rozhraní. Změna se zveřejní až po úspěšném sestavení a nasazení webu.
Vyzkoušel jsem i práci editora s omezeným přístupem: vidí jen obsah webu, rozpracovaný článek zůstane skrytý, dokud ho nezveřejní, a přístup lze kdykoli odebrat. U vašeho webu nastavíme práva, rozsah úprav a návod podle toho, kdo bude obsah spravovat.
Jak jsem řešení ověřoval
Web hlídají automatické testy: obsah a navigace, galerie, obě jazykové verze, předvýběr poptávky i fungování bez JavaScriptu. Ručně jsem prošel světlý i tmavý motiv, ovládání klávesnicí, úzké obrazovky a skutečný telefon s Androidem, včetně gest v galerii a zvětšeného písma.
Při laboratorním měření na simulovaném pomalejším telefonu jsem upravil načítání písma. Hlavní obsah úvodu se pak zobrazil zhruba o 14 % dříve (z 1,9 s na 1,7 s).
Co ukázka dokládá
Můžete si vyzkoušet konkrétní vzhled, strukturu a ovládání a podívat se, jak spolu souvisejí služby, fotografie a kontakt. Pro váš web vybereme jen části, které odpovídají vaší nabídce.