Tvorba webu

Jan Řezáč

-

14.5.19

-

čtení na 14 minut

V roce 2014 jsem vydal první českou knihu o procesu návrhu webu Web ostrý jako břitva. I po pěti letech je kniha pořád aktuální, ale posunuly se technologie a možnosti tvorby webu. Takže jsem se rozhodl vydat článek rozšiřující původní knihu. Navíc mám o 5 let více zkušeností. 😃 V tomto článku můžete volně zaměňovat slova web a e-shop.

Web je klíčové místo prezentace značky. Na rozdíl od stránky na sociální síti či výsledků vyhledávání vašeho oblíbeného vyhledávače máte web plně pod kontrolou a tudíž pro většinu firem nedává smysl se ho zbavovat, ale potřebují ho rozvíjet. Cílem firmy ovšem není mít web, ale mít web, který funguje. To znamená, že firmě přináší maximální množství peněz. V případě veřejné správy to může být např. míra zjednodušení života občanů…

Fungující web má tři klíčové vlastnosti:

  1. Chodí na něj lidé
  2. Dělají něco, co vám přináší peníze
  3. Uspokojuje ego sponzora

Pojďme se na to podívat podrobněji.

Chodí na něj lidé

Aby mohl web přinášet peníze, tak na něj musí někdo chodit. Znamená to, že vyvíjíte aktivity, které na web buď dotlačí nějaké lidi — třeba skrze reklamu nebo je web přitáhne svým obsahem či vaší značkou — třeba skrze osobní doporučení či sdílení jiných lidí na sociálních sítích. V každém oboru funguje něco jiného a existuje nespočet agentur, které vám za různé ceny dostanou na web lidi. V našem žargonu se takové činnosti říká integrovaná marketingová komunikace.

Lidé na webu dělají něco, co vám přináší peníze

Poté, co lidé přijdou na web, začnou konzumovat jeho obsah. Ten pro ně musí být srozumitelný, přínosný, důvěryhodný, přesvědčivý, zajímavý, smysluplný,… musí nasedat na jejich vnitřní motivace a překonat jejich vnitřní překážky. Teprve pak máte naději, že:

  • Váš web lidi nadchne
  • Lidé si vás zapamatují
  • Budou se na web vracet
  • Dříve nebo později si něco objednají
  • Doporučí vás ostatním

Web je součástí nákupního cyklu vašich zákazníků — v některých oborech lidé nakupují impulsivně, jinde potřebujete roky budovat vztah. Pro mnoho firem dává smysl se naučit, jak posilovat svoji značku skrze skvělý obsah. To je ale běh na dlouhou trať.

Ash Maurya: Továrna na zákazníka. Kde je úzké místo vašeho marketingu?

Web uspokojuje ego sponzora

Bod tři je v roce 2019 stále povinná položka. Web se musí líbit člověku, který ho platí, takže musí být odpovídajícím způsobem esteticky zpracován. Tento bod nemá žádný vliv na obchodní výkonnost webu, ale má podstatný vliv na spokojenost sponzora a jeho budoucí chuť cokoliv dělat s dodavatelem webu.

Doporučení: Nejdříve vyřešte komunikaci vaší značky, pak obsah webu, a pak teprve nažeňte na web lidi.

Jak vzniká web?

Teď se pojďme podrobněji podívat na to, jak vznikne takový fungující web. Web se dělí v zásadě na tři viditelné komponenty — grafika, obsah a technické řešení. Tyto komponenty mají rozdílný potenciál návratnosti investice. Pořadí je následující:

  1. Obsah — texty, fotky, videa, ilustrace, infografiky,…
  2. Technické řešení — redakční systém, infrastruktura, migrace dat, použité technologie a postupy,…
  3. Grafika — vizuální ztvárnění webu, systém grafických komponent,…

Lidé chodí na web kvůli obsahu, takže je nejdůležitější a má největší šanci vám vydělat peníze. Technické řešení musí být dostatečně dobré na to, aby při konzumaci obsahu neházelo návštěvníkům klacky pod nohy a zadavateli ulehčovalo práci při správě webu. Dá se na něm hodně pokazit. Ego sponzora se ale místo prvních dvou komponent soustředí na líbivou grafiku, která má zároveň nejmenší vliv na vydělávání peněz. Neplatí to pro úplně všechny weby, ale pro ten váš pravděpodobně ano.

Doporučení: nedávejte peníze do krásné grafiky, ale do skvělého obsahu. Dostatečně dobrá grafika pro většinu webů stačí.

Příklad ze života

Firma se rozhodla vybrat dodavatele webu na základě grafického návrhu. Vybraný dodavatel následně nebyl schopen dodat rozumné technické řešení, takže po roce čekání a spoustě ztracených příležitostí zadavatel odepsal čtvrt milionu korun a zkouší to znovu.

Zadání webu

Obsah, technické řešení a grafika jsou viditelné komponenty webu. Neviditelná komponenta, na které všechny tři závisí je takzvané Zadání webu nebo také Návrh webu. Zadání webu popisuje, co bude web obsahovat a jak se bude chovat vůči návštěvníkům. Web vznikne na základě zadání.
Videokurz Strategický webdesign popisuje celou tvorbu webu:

Zadání webu je defakto sada dokumentů, které popisují podobu budoucího webu — jako text, interaktivní prototyp či různé diagramy a frameworky.

Zadání typicky obsahuje wireframy, drátěné modely webu

Nejpodstatnější na zadání webu není jeho forma, ale proces vzniku. Zadání webu buď může vznikat na fantazii nebo na faktech. Fantazie znamená, že si sednete s dodavatelem webu, ten vás vyzpovídá a dodá vám wireframy, tedy drátěné modely webu. Když se ho zeptáte, jak vznikly, tak bude říkat něco o dlouholetých zkušenostech. Pro vás to znamená jediné, můžete je zahodit.

Druhá možnost je, že zadání vznikne na faktech, což znamená, že dodavatel vloží poměrně hodně energie do toho, aby fakta v projektu skutečně byly. Nezbytné minimum aktivit, které se musí stát vždy, pokud chcete zadání fungujícího marketingového webu, je následující:

  1. Dodavatel webu porozumí vašemu byznysu — to znamená společné workshopy, rozhovory s vašimi zaměstnanci, shromažďování informací o vás jako organizaci působící na nějakém trhu.
  2. Dodavatel webu porozumí lidem, pro které web děláte — to znamená, že udělá uživatelský výzkum. Minimální rozsah je analýza klíčových slov a rozhovory s vašimi zákazníky.
  3. Dodavatel navrhne obsah webu — na základě analýzy všech předchozích informací a ideace vznikne struktura stránek budoucího webu a obsah jednotlivých stránek.
  4. Vznikne prototyp z wireframe — obsah dodavatel převede do vizuální makety budoucího řešení. Tato maketa musí projít testováním.
  5. Vznikne technické zadání — pokud vytváříte web na míru, tak musí být jasné, jaké má splňovat výkonnostní parametry, jak bude komunikovat se systémy třetích stran apod.

Prototyp z wireframe a technické zadání lze přeskočit, pokud jste se rozhodli pro pronajaté řešení webu. O pronájmu více níže.

Proběhne tedy velké množství prací, které nejsou na první pohled vidět a zároveň s jejich výstupy můžete pracovat i mimo web např. při optimalizaci fungování vlastní firmy, produktů či komunikace k zákazníkům. Pro jistotu to zopakuji — není podstatná maketa webu, podstatný je proces, jak se k ní dostanete.

Zadání webu není vidět na první pohled, takže ho mnoho dodavatelů přeskakuje a jde přímo na věc. Jejich weby pak často nefungují, protože mají mizerný obsah i technické řešení. Ale firma zase vyplýtvala peníze levně. Neznamená to, že nemůžete mít jako zadavatel štěstí, jen ta šance je relativně nízká a čím složitější projekt, tím je pravděpodobnost úspěchu bez zadání nižší. Bez dobrého zadání zadavatel riskuje celou investici do webu.

Doporučení: Pokud má web fungovat, tak nepřeskakujte zadání, zejména pak uživatelský výzkum. Poptávka není zadání.

Příklad ze života

Byli jsme poptáni jako dozor do výběrového řízení na cca 60 webů. Zadavatel na první schůzce prohlásil, že nebude dělat žádné drahé analýzy, protože už se v úzkém kruhu vedení shodli, jak to bude. Bez zadání z našeho pohledu nelze vypsat výběrové řízení na web, takže jsme se rozloučili. Tento postup už opakují potřetí v posledních 10 letech, zatím bez viditelných přínosů. Ale zase dostanou pěknou grafiku.

Zadavatel z příkladu se odhadem spálil s firmami, které mu dodaly fantazijní projekty a teď nemá důvěru k dodavatelům drahých analýz. Na druhé straně je financován z veřejných prostředků, takže si může dovolit mít mizerný web.

V případě menších webových projektů může být zadání webu zároveň nejvyšší položka celého rozpočtu, obzvláště ve chvíli, kdy za sebou zatím nemáte žádný uživatelský výzkum. Počítejte s tím, že zadání webu bude vyžadovat desítky hodin práce na vaší straně a stovky na straně dodavatele.

Zadání webu by mělo cílit na co nejmenší relevantní web při spuštění (tzv. MVP, tedy Minimum Viable Product). Důvod je jednoduchý — čím více si toho vymyslíte, tím větší bude úvodní investice a delší čas ke spuštění webu. Po spuštění můžete web dále rozvíjet.

Příklad ze života

Majitel budoucího e-shopu si průběžně vymýšlel nové a nové funkcionality, které mají být dostupné při spuštění e-shopu, jen aby se později ukázalo, že většinu jeho skvělých nápadů nikdo nepoužívá. Projekt se protáhl o rok a došlo k milionovým ztrátám v příležitostech i odepsaných investicích.

Zadání webu je základ pro tvorbu nového webu. Pokud chcete pouze vylepšit stávající web, tak začněte Auditem webu.

Volba řešení

V roce 2019 máte jako zadavatel širokou paletu možných přístupů k tvorbě webu. Liší se jak nároky na profesionalitu dodavatelů, tak cenou a časem dodání.

V možnostech níže uvádím cenové odhady. Když píšu o minimální relevantní ceně, tak to znamená, že projekt nebude podinvestovaný. Na trhu jsou dodavatelé, kteří vám web na míru udělají i za 50 000 Kč, ale výsledek bude pravděpodobně velmi špatný a svou investici následně odepíšete spolu s množstvím vloženého času a energie na vaší straně. Ceny jsou počítány bez tvorby zadání webu.

Web zcela na míru

Necháte si postavit unikátní řešení přímo pro vaše potřeby. Tento přístup byl zcela standardní v posledních 20 letech, takže ho mnoho zadavatelů vyžaduje. Budete potřebovat pečlivě vybrat dodavatele webu a důkladně prověřit jeho technické schopnosti, abyste měli jistotu, že je vám takové řešení skutečně schopen dodat. S tím vám pomůže technický dozor webových projektů. Minimální relevantní investice do webu/e-shopu na míru je milion korun, tvorba trvá alespoň rok. E-shopy na míru tvoří např. Shopsys.

Web na šabloně a/nebo hotovém redakčním systému

Necháte si postavit unikátní řešení přímo pro vaše potřeby, ale využijete existující komponenty. Na rozdíl od webu na míru koupí dodavatel za pár dolarů grafickou šablonu a tu vám nasadí na redakční systém, např. Wordpress. Patří sem i e-shopové systémy typu Shopio. Znamená to rychlejší a levnější vývoj webu, který může mít mnoho úprav na míru. Minimální relevantní investice do projektu webu/e-shopu na šabloně jsou stovky tisíc korun.

Pronájem webu

Pronájem webu je zcela jiný přístup než předchozí dvě možnosti. Je to vlastně operativní leasing pro weby. Vyberete si některý ze systémů pro pronájem webu a web si na něm naklikáte. Nepotřebujete programátory, grafika, infrastrukturu či technický dozor. Minimální relevantní cena jsou desítky tisíc korun (pokud to necháte naklikat externího dodavatele, jinak jen váš čas) a nízký měsíčný paušál.

Příklad ze života

Firma si nechala vytvořit web za 100 000 Kč na redakčním systému Wordpress. Výsledek je dražší a kvalitativně horší než tentýž web na pronajatém řešení. Pořád potřebují programátora na průběžné aktualizace a navíc platí za hosting a údržbu systému.

Zadavatelé projektů mají pocit, že nutně potřebují web na míru či na Wordpressu. Není tomu tak. Evoluce a konkurenční boj způsobily, že díky pronájmu webů dostanete řádově kvalitnější řešení než levný web míru. Vím, že statisíce korun nepůsobí levně, ale v kontextu webů na míru jsou to drobné.

Marketingovým webovým projektům, které nemají stovky stránek a složitou funkcionalitu, stačí skoro vždycky pronajaté řešení. Za pár kaček dostanete řádově lepší web než v případě podinvestovaného webu na míru či na hotovém redakčním systému.

Systémy pro pronájem webu samozřejmě zatím nemusí řešit všechny funkcionality, které na webu potřebujete. Nikdo neříká, že potřebujete vše řešit na jednom systému — např. rezervační systém může běžet jako samostatně pronajatý produkt, který dodavatel propojí s webem.

Řešení pro pronájem webů

  • Shoptet—pronájem e-shopů
  • Solidpixels — marketingové weby
  • Wix — marketingové weby
  • a mnoho dalších…

Volba dodavatele webu

Videokurz Strategický webdesign popisuje celou tvorbu webu:

V případě, že jste se rozhodli jít do webu na míru či na šabloně a hotovém redakčním systému, tak budete potřebovat vybrat dodavatele. Naše zkušenost je taková, že dodavatelé mají v rámci firmy kompetence buď v grafice, nebo v technickém řešení nebo v tvorbě obsahu, takže pokud chcete špičkové řešení, tak budete potřebovat vybrat a odřídit více dodavatelů.

Všichni dodavatelé nejsou stejní. Pár věcí, které byste si měli uvědomit:

  • Nejdůležitější je technický dodavatel. S ním budete pracovat roky a nebudete ho moci vyměnit. Přenositelnost technického řešení webu je jen teoretická a ve většině případů je levnější a rychlejší ho zahodit a začít znovu.
  • Nepoznáte skutečné technické kompetence firmy. V House of Řezáč nejčastěji spolupracujeme s Nehoupat, kteří nám pomohou prověřit technické schopnosti dodavatele. Tento krok je nesmírně důležitý kvůli bodu jedna — s technickým dodavatelem jdete defakto do manželství a tudíž je vhodné vědět, na čem jste, ještě předtím, než řeknete ano.
  • Veškerá ujednání s technickým dodavatelem musí být zasmluvněna a součástí smlouvy musí být dohody o provozu, údržbě a rychlosti reakce dodavatele v případě opravy chyb. Takzvané SLA. Dohodu je potřeba písemně uzavřít před začátkem spolupráce, jinak budete velmi smutní ve fázi Rozvoj a údržba webu. Neexistence SLA ohrožuje celou vaši investici a nelze udělat zpětně za dobrých podmínek. Na smlouvách obecně spolupracujeme se SEDLAKOVA LEGAL, kteří kombinují právní a technické kompetence. Tohle je důležité zejména proto, že běžní právníci netuší, kde mohou nastat technická úskalí dohody.
  • Kromě technických kompetencí potřebujete mít jistotu, že dodavatel má kompetence odřídit daný projekt. To hodně záleží na schopnostech projektového manažera, který bude přiřazen právě k vašemu projektu. Chtějte ho vidět dopředu. Nechte si ukázat, jak pracuje. Chtějte reference od zákazníků, jejichž projekty řídil.
  • Bez zadání webu nemá smysl vyjednávat o ceně projektu. Můžete si dělat maximálně porovnání kompetencí dodavatelů a hodinových sazeb. Někdy to stačí, ale většinou potřebujete mít hotové zadání ještě před začátkem volby dodavatele.
  • Tvůrci obsahu a grafici jsou nahraditelní poměrně rychle a dobře, pokud budete mít dobře právně ošetřenou spolupráci, tzn. možnost dělat si s obsahem a grafikou, co chcete. Znovu tedy potřebujete dobrou smlouvu.
  • Grafický návrh vybírejte podle referencí grafika. V případě, že chcete uspořádat soutěž o návrh, tak se připravte zaplatit skicovné všem zúčastněným. V opačném případě se vám přihlásí jen amatéři.

Příklad ze života

Zadavatel investoval miliony korun do webového systému na míru bez pořádné smlouvy a SLA. Dodavatel následně požadoval násobky obvyklé ceny za správu a údržbu projektu. Zpětně už dobrou dohodu neuděláte.

Jak zvolit dodavatele webu? Tohle už závisí na konkrétním projektu. Nejdůležitější parametr je, že už má za sebou projekt podobného rozsahu a jeho bývalí klienti jsou s ním spokojeni. Můžete volit i méně zkušeného dodavatele, ale připravte se dát rozdíl v ceně do technického dozoru a externího projektového manažera.

Doporučení: Nepodceňujte výběr dodavatele, zejména toho technického. Špatná volba ohrožuje vaši investici.

Tvorba webu

Konečně se začíná tvořit! Tato fáze je z větší části v rukou vašich dodavatelů a oni by měli být ti, kteří vás tvorbou webu provedou. Neznamená to ale, že můžete vydechnout a vrhnout energii jiným směrem. Čeká vás několik zásadních úkolů:

  1. Příprava podkladů pro grafiku — logo, grafický manuál, fotografie, apod.
  2. Příprava podkladů pro obsah — velké množství textů, fotek, schůzek,… dle dohody s tvůrcem obsahu. Bude nutné vše zkoordinovat a vytvořit spoustu textu.
  3. Schvalování grafiky, obsahu a chování webu.
  4. Řešení detailů a spousta větších či menších rozhodnutí. Od napojení na platební bránu přes rozhodnutí o cenotvorbě dopravy po řešení technických detailů.

Prakticky to znamená, že nejen dodavatel, ale i zadavatel musí mít v týmu projektového manažera s dostatečnými kompetencemi. Jinak se tvorba webu začne protahovat a přímo úměrně začne klesat chuť vašeho dodavatele s vámi spolupracovat.

Projektový manažer dodavatele a projektový manažer zadavatele uzavřou dohodu o samotném průběhu projektu. Osvědčilo se nám mít s dodavateli pravidelná setkání cca jednou za 14 dní a na nich projít progress projektu, vyřešit potřebná rozhodnutí a koordinovat práci. Na setkáních je také možné uzavírat dohody na příští etapu prací. Alternativa je půl roku čekat na první verzi webu a pak se dohádat s dodavatelem, který odvedl spoustu zbytečné práce.

Veškerá komunikace týkající se projektu by měla jít mimo e-mail. Důvod je jednoduchý — chcete vidět, jak se projekt vyvíjí dopředu a na nic zásadního nezapomenout. My pro projektové řízení používáme Asanu, často je využíván Basecamp či Trello.

Doporučení: Mějte před začátkem projektu jasno, kdo ho bude řídit na vaší straně.

Spuštění webu

Den D! Wow. Konečně jsme se dostali až sem, tak to pojďme spustit. Všichni jsou vyčerpaní, natěšení a připraveni web konečně dostat do světa. Zastavte se. Před spuštěním je potřeba ještě udělat pár věcí, pokud si máte být jisti, že výsledek dopadne dobře:

  1. Otestujte web skrze uživatelské testování. Tohle zvládne firma, která vám připravovala zadání.
  2. Web podrobně pročtěte. Toto by měl udělat někdo, kdo na projektu ideálně nepracoval.
  3. Nechte si podrobně nastavit měření webu. Základní kód Google Analytics nestačí.
  4. Nechte třetí stranu prověřit, že web správně technicky funguje a vše je připraveno na spuštění. My tento bod řešíme jako součást Auditu webu.

Příklad ze života

Zadavatel najal nezkušeného dodavatele webu na míru, který nepřesměroval původní URL webu na nové ekvivalenty. Počet poptávek klesl na desetinu a zadavatel málem zkrachoval.

Pak už chybí jen marketingová kampaň, šampus a chlebíčky. Užijte si to, spustili jste web!

Rozvoj a údržba

Spuštěním webu práce začíná! Po spuštění webu budete mít spoustu požadavků na další rozvoj. Měli byste je mít, protože jste web spouštěli jako MVP (tedy v minimální variantě) a zároveň s nimi počítají vaši dodavatelé díky uzavřenému SLA. Rozvoj může opět probíhat v rytmu původně nastavených setkání a přes nastavený systém pro projektové řízení.

  • Po spuštění webu začíná čas integrované marketingové komunikace — na fungující web musí chodit lidé. Marketing typicky dodávají jiní dodavatelé než ti, kteří vytvářeli váš web. Opět je potřeba uzavřít dohody a odřídit celou spolupráci.
  • Web má smysl propagovat a rozvíjet jen ve chvíli, kdy měříte dopady své činnosti. Je tedy potřeba mít podrobně nastavenou analytiku, rozumět číslům, která měříte a reagovat na ně.
  • V rámci rozvoje a údržby půjde zejména o to, aby váš web využíval naplno svůj potenciál. Podněty přinesou požadavky z interního týmu, místa ke zlepšení ale reálně najdete skrze audit webu, uživatelský výzkum, uživatelské testování a analýzu dat.
  • Nápady mají všichni, ale ne všechny nápady přináší peníze. Ve spoustě případů tedy dává smysl nejdříve ověřit potenciál vašeho nápadu před jeho drahou implementací do webu. Znamená to plánovat, designovat a vyhodnocovat experimenty.

Tvorba a rozvoj webu je projekt, který vám může pomoci nejen posunout komunikaci firmy navenek, ale i prověřit vaše procesy a směřování celé organizace.

Objevujte design a marketing s House of Řezáč >> rodový newsletter.

Kam dál?

Stejně jako v roce 2014 i dnes platí, že pro tvorbu webu potřebuje zadavatel získat znalosti, jinak své peníze utratí špatně. Máme pro vás tři zdroje, které vám mohou pomoci:

Jak vám můžeme pomoci?

  • Audit webu — zanalyzujeme váš stávající web a navrhneme konkrétní kroky tak, aby web fungoval lépe
  • Uživatelský výzkum — najdeme nové příležitosti pro rozvoj služeb, produktů, marketingu či webu
  • Tvorba webu — vytvoříme zadání pro váš marketingový web a dohlédneme na dodavatele (potažmo vám výsledek naklikáme v systému na pronájem)
  • Webová analytika — nastavíme vám měření a pomůžeme vám získat správná data pro rozhodování