Jaký je ideální postup tvorby webové prezentace

Dozrál čas na zřízení nových webových stránek, nebo už je načase redesignovat ty staré? Možná dokonce plánujete spustit větší portál či e-shop. Je jedno, o jaký typ internetového projektu se jedná – postup jeho tvorby by měl být vždy podobný.

Projektové přípravě jako nejopomíjenější části procesu tvorby webu věnuji 90 % celého článku.

Kapitoly článku:

1. Projektová příprava - domácí úkol

2. Projektová příprava – analýzy, dokumenty a prototyp

3. Realizace nového webu

4. Analýza dosažených výsledků, testování, vývoj a optimalizace

1) Projektová příprava – domácí úkol

Je to velice podobné, jako když stavíte dům dle individuálního projektu. Nejdřív se musí nový majitel rozhodnout, jaký dům vlastně chce, jaké má na svůj nový dům požadavky. Následně se architekt snaží navrhnout dům tak, aby tyto požadavky a očekávání majitele splnil. Pak ale majitel chce různé věci jinak, a je třeba je předesignovat, upravit a návrh/model domu takto vyladit. Poté, co se architekt a majitel domu na všem shodnou (majitel tedy schválí studii domu s půdorysem a fasádou a odsouhlasí 3D model), vypracují architekti podrobný projekt a dokumentaci pro získání stavebního povolení. Tento proces může trvat tři až šest měsíců. Pokud má majitel dostatek peněz, po přípravě projektu a udělení stavebního povolení může dům stát už za jeden rok.

Velice podobné je to i s tvorbou webu na zakázku. Velká část práce je právě příprava, návrh a ladění toho, jak bude nový web fungovat, aby splňoval očekávání a nároky majitele.

Obrovský rozdíl se tedy projevuje už ve fázi přípravy návrhu domu nebo webu. Doba a cena realizace u individuálního projektu a typového domu je zcela odlišná. Stejně tak je tomu i u individuálního řešení webového projektu v porovnání s krabicovým řešením.

Zadání a s tím spojené analýzy

Dobrý web nemůže vzniknout z nedostatečného zadání, bez pečlivých úvodních analýz. Pokud není k dispozici promyšlené a dobře připravené zadání, bude váš nový web s velkou pravděpodobností selháním a tedy ztrátou vašeho času a vašich peněz.

Jsou firmy, které vám rády projektovou přípravu vypracují, včetně vstupných analýz. Nemáte-li ale na to rozpočet, bude tato část přípravy nové prezentace na vás samotných. Uvádím několik otázek a podnětů k zamyšlení, na které je dobré najít odpovědi před tím, než oslovíte webdesignera a začněte připravovat prototyp, neřkuli grafiku nového webu.

1) Co je cílem webu?

Nejčastějším cílem webu je jednoduše vydělat peníze. Tedy prodat produkt nebo služby. Jak toho ale dosáhnout? Musíme tento cíl konkretizovat, třeba takto: "přivést nové klienty", nebo "podpořit a zvýšit prodej u stávajících klientů", nebo "podpořit obchodní zástupce, kteří prezentují klientům taky firemní webové stránky", nebo "zvýšit návštěvnost a pak více vydělat na reklamě", nebo "získat důvěru, přesvědčit a zanechat u návštěvníků pozitivní emoce".

Cílem webu může být samozřejmě i něco jiného než finanční zisk, ale tato varianta nebývá až tak obvyklá. Zde se jedná třeba o hobby weby, osobní weby, weby státní správy nebo různé jiné internetové stránky.

2) Kdo je cílovou skupinou webu?

Jsou vašimi klienty firmy, nebo soukromé osoby? Rodiny, muži, ženy, studenti? Cílíte na průmysl, správce hotelů, turisty, chudé lidi, majetné lidi... Podle toho je pak třeba k webu přistupovat.

2.1) Co budou návštěvníci od webu očekávat

Co vaše cílová skupina na webu bude dělat, co tam bude hledat, co jí chcete sdělit a jak jí to chcete sdělit? Pokud jste restaurace, bude je zajímat jídelní lístek, ceny a obědové menu, fotogalerie, on-line rezervace, adresa, otevírací hodiny, reference a hodnocení od klientů. Pokud jste soukromá vysoká škola, vaše návštěvníky bude zajímat úplně něco jiného. Překvapivě to, co návštěvníci na webu nejvíc potřebují, často na webech chybí, protože to majitel stránek opomněl. Zkoumejte, jaké informace a obsah váš web vyzvednou nad konkurenci v oboru. Pak je třeba tyto informace poskytnout přehledně a přívětivě tak, aby se uživatelům s webem dobře pracovalo.

2.2) Co chcete, aby lidé na webu udělali

Zjednodušeně řečeno, jde vždy o nějakou akci. Třeba objednali produkt/službu, zavolali vám, poptali, nakoupili, rezervovali, registrovali se, nebo se vás alespoň na něco zeptali a nechali vám svůj e-mail pro odpověď...

3) Jakou máte konkurenci

Prozkoumat, s kým budete "soupeřit", inspirovat se a následně navrhnout ještě lepší řešení. Možná to zní jednoduše, ale vyžaduje to čas, zkušenosti a řekněme fantazii.

4) Obsah webu a informační architektura

Co bude obsahem webu a jaká bude jeho struktura? K tomu částečně pomohou již předešlé odpovědi, je však dobré zjistit, jaké informace budou vaše návštěvníky zajímat, a web pak tomu přizpůsobit. Analýza klíčových slov je pro toto jako stvořená. Analýzou klíčových slov, která ve vyhledávačích lidé zadávají, zjistíte věci, jež by vás normálně nenapadly. Dozvíte se třeba, že může být dobré přidat nekomerční informační část webu, která bude vašim návštěvníkům poskytovat "zdarma" užitečné informace relevantní k vaší činnosti. Takový blog nebo recenze novinek a zajímavostí budou důkazem vaší odbornosti a také přivedou na web nové návštěvníky přes vyhledávače a pomocí sdílení mezi lidmi – třeba na sociálních sítích.
Analýza klíčových slov (AKW) vám pomůže k navržení optimální informační architektury nového webu. Ale i pro tuto analýzu je potřeba mít připravené zadání a je nutné sepsat si oblasti, slova a fráze, ze kterých bude analýza vycházet.

Jak získáte obsah webu, kdo tento obsah vytvoří a kdo jej bude na web vkládat? Toto je jednoduché vyřešit u webové vizitky s minimem informací, ale složité u e-shopu s tisíci položkami zboží. V případě rozsáhlých webů je tvorba obsahu dražší než samotná výroba webu jako takového (příprava obsahu rozsáhlého webu/shopu >> analýzy + prototyp + grafika + programování + další).

5) Jak přivedete návštěvníky na web?

Web žije, jen když ho lidé navštěvují, jinak je mrtvý a zbytečný. Zamyslete se nad tím, jak budete přivádět na web návštěvníky, ještě předtím, než se pustíte do výroby nových stránek.

• Přes vyhledávače? Pokud ano, je třeba mít promyšlené, jak si získat pozornost a dobrou reputaci u vyhledávačů.
• Přes placenou inzerci, jako jsou PPC/PPM kampaně? Pak je potřeba, aby měl web co nejvyšší konverzní poměr. Ten je sice potřeba tak či tak, ale PPC může být hodně drahé, a když pak lidé nezkonvertují (např. nenakoupí), je to hodně bolestivé.
• Aktivitou na sociálních sítích?
• Off-line reklamou?
• Možná aktivitou vašeho call-centra či obchodních zástupců?

Přivést návštěvníky na web stojí čas nebo peníze. Sami od sebe na web nepřijdou. Investice do návštěvnosti velice pravděpodobně brzy přesáhne cenu výroby webu. To s sebou také přináší otázku, jestli má smysl na výrobě webu šetřit. Přivést návštěvníky na váš web je drahé. Kvalitní web vám při stejné návštěvnosti přinese mnohonásobně větší výtěžnost než web, na kterém jste nesmyslně šetřili a který nakonec návštěvníky odradí a jehož používání návštěvníky frustruje.

6) Jaký je váš rozpočet?

Rozpočet bych rozdělil minimálně na tři části, a to:

1. vstupní investice – jednorázová investice
   - příprava a výroba webu, tvorba obsahu, naplnění webu obsahem...
2. investice do reklamy – pravidelná investice
   - získání návštěvnosti...
3. investice do vylepšování a vývoje webu – pravidelně / příležitostně
   - analýza výkonnosti, úpravy funkčnosti a designu stránek, rozšiřování a úpravy obsahu...

2) Projektová příprava – analýzy, dokumenty a prototyp

Zadání je z vaší strany připravené. Domácí úkol jste udělali, takže co teď dál? Ne ne, stále to ještě není grafika ani programování, ale detailnější analýzy:

1. Analýza klíčových slov s návrhy pro obsah a strukturu webu.
2. Konkurenční analýza a návrh webu.
3. Příprava prototypu a jeho testování.

Jak na tyto analýzy?

A) svépomocí
Můžete si vše připravit sami, u malých internetových projektů by to nemusel být velký problém. Při středních a větších projektech je už projektová příprava složitější a asi ji sami nezvládnete.

B) s webdesignerem / webdesignovým studiem
Můžete tyto analýzy řešit přímo se svým webdesignovým studiem. Pokud se ale studio nezajímá o to, co chcete, neklade vám otázky a "netrápí" vás svými dotazy, pak je něco asi špatně a bude lepší obrátit se jinam. Můžete zkusit tato webová studia, která mají projektovou přípravu jako jednu ze svých služeb:

• zkuste to s námi www.artweby.cz/weby/individualni-webova-reseni-na-miru
• nebo se obraťte na www.peckadesign.cz/ sprava
• nebo taky na www.sherwood.cz/ kompetence/analytika-a-poradenstvi/

Náš tip: Ptáte se, proč máte chtít návrh webu? Přečtěte si srozumitelný článek.

C) specializovaní odborníci
Lze se také obrátit na jinou firmu nebo freelancera, která/ý se zabývá výhradně projektovou přípravou. Jako třeba:

• Jan Řezáč: janrezac.com
• Dobrý web: dobryweb.cz
• H1: h1.cz/navrh-webovych-stranek
• Jan Kvasnička: kvasnickajan.cz/sluzby/

Projektová příprava končí sestavením prototypu stránek a dokumentace, které definují, jak má daný web fungovat.

Následuje volný přepis postupu, který prezentoval Jan Řezáč v odpovědích na ask.fm/janrezac po dotazu, jaký je ideální workflow webového projektu.
Níže popsaný postup je poměrně nákladný a vhodný zejména pro velké projekty. Cena takovéto projektové přípravy se může pohybovat ve statisících korun. Je dobré vědět, jak vznikají větší a úspěšné weby. Inspirovat se tím i při menším projektu s menším rozpočtem tak, aby i váš projekt (ať už web, e-shop nebo portál) byl co nejúspěšnější.
Vyplatí se znát obecné principy, které se skrývají za jednotlivými kroky, protože často není dost času ani rozpočtu pro ideální variantu.
 

---

1. Zorientování se v kontextu - na straně zákazníka detailní a podrobně vyplněný brief doplněný workshopem / rozhovory s jednotlivými stakeholdery včetně těch na technické podpoře / nemanažerských pozicích; na straně zákazníků zákazníka hloubkové rozhovory s různými segmenty cílovky i lidmi, kteří volí konkurenci, data z analytických nástrojů, online dotazníky, marketingové průzkumy a další zdroje dat, co jsou k dispozici
2. Analýza výše uvedeného; dotažení prerekvizit pro práci (brand klienta, USP produktů,...)
3. Týmový brainstorming
4. Syntéza výše uvedeného do podoby prototypu, který bude ve finále na dostatečné úrovni detailu včetně obsahu, který půjde rovnou obratem kvalitativně testovat
5. Několik iterací kvalitativního testování v kombinaci s předchozím výzkumem; celý tým i klient se účastní testování a na základě každé iterace upravuje celý koncept nejen na úrovni GUI
6. Dokončení dodatečné dokumentace k prototypu a podrobné rozplánování toků zákazníků na touchpointech, které souvisí s webem (tohle už je service design, web ti může selhat na špatně nastavených procesech na pobočce / balení produktu / potvrzovacím emailu)
7. Oponentura celého konceptu alespoň dvěma různými specialisty na návrh webu
8. Finalizace prototypu a start grafických prací (tady jsme cca ve 20% procesu pro všechny včetně UXáka, realizátora je potřeba kontrolovat a usměrňovat vzhledem k vizi...)

...

Výše uvedený postup návrhu webu je tak drahý, že ho většina klientů nikdy nezrealizuje (za mě 200 000+ Kč na návrh střední webové prezentace, ale samozřejmě závisí na rozsahu každé etapy, segmentaci cílovky,... hodně rozsáhlá cílovka znamená vyšší cenu výzkumu, protože rozhovory časově neošidíš). Výhodou je výrazné snížení rizika, že to celé krachne (což by šlo zabezpečit i agilně... i když asi ne moc levněji... ale to už je na delší debatu).

Jinak můj názor na rádoby "specifičnost" webových projektů je ten, že vyplývá z nedostatečně uchopeného procesu návrhu na straně webdesignerů. Webové projekty jsou sice unikátní (proto jsou to projekty), ale v zásadě vybíráš v rámci každé fáze procesu návrhu takové metody, které jsou relevantní vzhledem k projektovým omezením na straně klienta. Třeba budget nebo čas ti ořežou spoustu výzkumu, testování a brainstormingů a s nimi spojené kreativity.

konec citace Jan Řezáč

---

3) Realizace nového webu

Konečně jsme u realizace a výběru webového studia, pokud jste s ním tedy již nepracovali na projektové přípravě. Přečtěte si kratší článek o výběru dodavatele, typech řešení a požadavcích, které je potřeba na dodavatele klást.

4) Analýza dosažených výsledků, testování, vývoj a optimalizace

Web musí žít, růst, zlepšovat se a přizpůsobovat se vašim aktuálním požadavkům, požadavkům uživatelů a obecným trendům. Používat k tomu můžete různé nástroje pro analýzu a měření výkonnosti webu, od Google Analytics, přes teplotní mapy, po A/B testování a uživatelské (UX) testování oční kamerou, které považuji za nejpokročilejší metodu. Tomu, jak web analyzovat a následně vylepšovat, nejspíš budu věnovat prostor i v dalších připravovaných článcích.

Zajímavé tematické odkazy

Téma tvorby a projektové přípravy webu je neuvěřitelně rozsáhlé. Do jednoho článku se nevejde vše, o čem je dobré vědět. Proto zde uvádím další studijní materiál. Různé blogy, články a prezentace.

Na těchto blozích najdete informace o tvorbě uživatelského rozhraní a prototypech, interakčním designu, obsahové strategii a návrhu informační architektury webu.
Česky psané blogy:
   blog.kvasnickajan.cz
   blog.filosof.biz
Podrobně rozebraný postup Jak navrhnout úspěšný web krok za krokem.
SlideShare prezentace v angličtině o návrhu produktu (webu) z pohledu designera.
Rozsáhlý článek v angličtině o tom, jak navrhovat informační architekturu webu na smashingmagazine.com.

Video – přednáška

Tato přednáška je zajímavá pro zadavatele webu. Jan Řezáč v ní vzpomíná obsahovou strategii a interakční design (minuta 17 až 23). Podává unikátní interpretaci Maslowovy pyramidy na případě úspěšného webu a v asi 30. minutě vysvětluje, že návštěvníky je potřeba na web nejen přivést, ale také je na něm udržet – poskytnout jim komfort, získat si jejich důvěru, přesvědčit je a zanechat v nich pozitivní emoce. U všeho uvádí i pochopitelné příklady.