Kolik stojí web nebo e-shop?

Pokračujte dále v tomto článku: Umíte se zeptat sami sebe? — K čemu má sloužit váš nový web nebo e-shop? — Kdo vám prezentaci nebo obchod na internetu udělá? — Jak velký je váš web? — Co tedy znamená udělat nový web nebo e-shop? — Tak kolik to tedy bude stát? — Další aspekty úspěšné realizace webu, za které se platí

Pro smysluplnou reakci je potřeba se pořádně zamyslet nad účelem použití a dalšími aspekty. Jinak získáte rozptyl u auta od 10 tisíc za velmi ojetou Škodu Favorit až po 50 milionů za nové a nadupané Bugatti Veyron. Potažmo od 50 tisíc za zahradní domek z Bauhausu ke kamarádovi na pozemek po 50 milionů za moderní vilu od architekta v atraktivní lokalitě.

Umíte se zeptat sami sebe?

Kam budu autem jezdit? Jak často? Koho nebo co budu vozit? Jaké speciální funkce potřebuji? Chci pohodlí nebo ušetřit? Co provozní náklady?

Kde má dům stát? Je to novostavba nebo rekonstrukce? Kolik bude mít pater a místností? Co sklep, garáž nebo sklad? Zahrada? Způsob vytápění? Standard zařízení koupelen, nábytku, kuchyně?

Tyto otázky napadnou většinu z vás, kteří o novém autě nebo domu uvažujete. Nejisté však je, kolik otázek vás napadne v roli zadavatele webu. Zkusíme se podívat na to, co vše byste měli vzít v úvahu.

K čemu má sloužit váš nový web nebo e-shop?

Začneme tím, k čemu má web sloužit, co je jeho hlavním cílem. Je docela rozdíl, jestli chcete jen vystavit pár svých fotek a cestopisných článků z dovolené nebo děláte web pro získávání poptávek firmě, která plánuje během několika let zdvojnásobit obrat v řádu stovek milionů korun, má široké portfolio produktů a služeb a pohybuje se v silně konkurenčním prostředí.

Každopádně je potřeba si cíle webu stanovit a s nimi potom neustále pracovat. Při návrhu, realizaci i propagaci webu mějte hlavní cíle pořád na zřeteli a hlídejte, že je web umožňuje naplnit. V záplavě produktů a dalšího obsahu se totiž snadno zapomene na to hlavní - aby se v tom uživatel vyznal a vždy věděl, kam má dále pokračovat.

Doporučujeme začít myšlenkovou mapou webu. Není nutné ji vnímat už jako finální strukturu výsledného řešení, do ní může ještě promluvit analýza klíčových slov kvůli dohledatelnosti nebo nutnost zachovat určité vstupní strányk s ohledem na udržení organické návštěvnosti. Nicméně pro základní představu, co vše má web obsahovat, aby dával smysl, je mindmapa ideální. Zapojte do ní rovnou poznámky, co na které stránce očekáváte zhruba za obsah a proč.

Kdo vám prezentaci nebo obchod na internetu udělá?

Dále je dobré se zamyslet, kdo by měl web dodat. Web není komodita, jedná se spíše o službu na míru. Zde už tedy srovnání s autem kulhá, sedí spíše příměr ke stavbě domu. Ten si také můžete udělat sami jen s pomocí kamarádů, nebo poptat šikovného zedníka, menší partu nebo profesionální stavební firmu pokrývající všechny profese. O tom,  jak poptat web  a co vše do poptávky napsat jsme už na našem blogu rozepsali. 

V zásadě se opakují čtyři základní scénáře. Slýcháme je pravidelně od klientů.

1) Jste brouk pytlík nebo máte takového kamaráda

Web si vymyslíte, napíšete, nakreslíte, naprogramujete i vyzkoušíte sám. Nebo se s pomocí kamaráda. Takové řešení může být relativně levné, ovšem zabere vám dost času i "operační paměti". A pozor na termíny, kamarádi jsou v tomto nevyzpytatelní a pokud si výrobu webu vezmete přímo na svoje triko, je potom otázkou priorit, čemu budete den po dni dávat přednost: zda přípravě webu nebo své běžné činnosti. Počítejte minimálně desítky hodin práce.

2) Seženete si freelancera

Volnonohých webotvůrců najdete na internetu dost. Zajímejte se o jejich reference a ptejte se jich, jaké všechny činnosti umějí pokrýt. Tvorba webu je multidisciplinární a málokdo je v dnešním světě schopen zastat mnoho rolí na vysoké úrovni. Freelancer bude určitě zdatný v oblasti, z níž primárně pochází - nejčastěji v grafice či kódování. Ale vy potřebujete také originální texty, fotky pokud možno ne z fotobanky, videa, možná propojit svůj web s dalším systémem. A freelancer má z principu problém s vlastní zastupitelností, v čemž se skrývá hlavní riziko - váš projekt se může snadno ocitnout na druhé koleji.

3) Odevzdáte se do rukou malé agentury

Agentura bude dobrá volba, protože má inhouse více specialistů - ptejte se kolik a jakých nebo se i stavte podívat, zdali mají skutečně takový tým, jak tvrdí ve své prezentaci. Zde už byste měli dostat k ruce projektového manažera, jehož role je nezastupitelná, právě on bude tím, kdo vám web reálně "dodá". Pokud bude i trochu konzultantem, tedy schopen konstruktivně oponovat vaše představy a nabízet jiné možnosti řešení, bude to výrazně veselejší. Ale i tak buďte obezřetní a trvejte na důkladné přípravě a rozpočtu, který realisticky pokrývá vše potřebné.

4) Vsadíte na profi agenturu

Je-li pro vás web je pro vás klíčovou součástí marketingu, obchodu a v dnešní době i HR, protože hledáte nové lidi, sáhněte po větší, zavedené agentuře. Vy pravděpodobně dobře víte, čeho potřebujete dosáhnout, oni budou vědět jak. Navíc disponují zázemím početného a doufejme i stabilního týmu, což je opravdu důležité.

Do stavby domu se zapojí klidně desítka profesí a podobné je to i u webu - potřeba je analytik, UX designér, grafik specializovaný na návrh webů a e-shopů, frontend i backend vývojář, copywriter, tester a také projekťák, což je někdo jako stavbyvedoucí, bez jehož zkušeností a manažerských schopností byste se výsledku nikdy nedočkali.

Cena agentury bude jistě vyšší, ale jak se říká, nikdo z nás není dost bohatý, aby kupoval levné věci (služby). U webu to platí dvojnásob, protože vám bude pomáhat vydělávat další minimálně tři, často však pět a někdy klidně i deset let. Navíc jde víc službu než o produkt - a vy se chcete mít kam dovolat, když bude v budoucnu nějaký problém.

Jak velký je váš web?

Když stavíte dům a chcete znát náklady, pro hrubý propočet je potřeba znát metry krychlové obestavěného prostoru. A samozřejmě klíčové technologie, které v domě mají fungovat - topení, chlazení, výměna vzduchu, odpady či zabezpečení.

Jaké stránky na webu očekáváte

Podobné je to s webem. Dodavatel musí vědět, kolik specifických stránek bude potřebovat. Bude to velmi pravděpodobně domovská stránka, která může být dlouhá a scrollovací a v případě menších webů může obstarat velkou část výsledků. U větších firem však lze očekávat, že se neobejdeme bez šablon pro

• přehled a detail nabízených produktů a služeb, kterých je mnohdy více typů
• stránku o nás, která se často dále štěpí na podstránky typu historie
• přehled a detail referencí
• stránku pro nové zaměstnance a k ní přehled a detail nabízených pracovních míst
• přehled a detail článku nebo aktuality
• kontaktní stránku
• specifickou "landing page", v rámci které mohu chystat speciální obsah pro kampaně a do něj zapojovat produkty či služby, které chci zvýraznit
• a obecnou textovou stránku, pomocí které zpracuji vše ostatní

Jedná se tak minimálně o deset, spíše patnáct, typů stránek. Každá má svůj layout, rozložení prvků, skládá se z různých částí. Ty se někdy opakují na více stránkách, například pás s hlavami klíčových lidí ve firmě můžeme použít na úvodní stránce, v kontaktech nebo na stránce o nás. Nicméně nakreslit by měl grafik všechny a programátor potom nakódovat a nasadit na redakční systém. Pomocí toho pak budeme mít možnost kdykoli snadno upravovat obsah webu a publikovat na něj všechny důležité informace pro klienty a novinky z firmy.

Zpátky k ceně - čím více šablon, tím více práce pro dodavatele. A to jak na straně grafika, tak na straně programátora.

Pozor na responzivní design

Desítky procent návštěv na firemních webech se odehrávají na mobilních zařízeních. Je proto nutné se zabývat tím, jak bude váš web vypadat na nich. A to nejen na vašem mobilu či tabletu manželky. Různých typů zařízení s různým rozlišením jsou v dnešní době stovky. Jedná se o kontinuum, velikost mobilu mnohdy přesahuje tablet a ten zase může být větší než leckterý malý desktop.

Grafika by proto měla být zpracována v nějakém gridu, který umožní obsah pružně zmenšovat a zalomit na užší zobrazení. Její autor by měl nastínit, jak budou vypadat některé konkrétní prvky. To vše za předpokladu, že programátor je šikovný a má s tímto zkušenosti - pak udělá většinu finální práce on spolu s testerem, který vše důkladně zkontroluje. Jinak je potřeba nechat si grafikem nakreslit pro nejtypičtější mobily a tablety úplně všechno.

Co má web ještě umět?

Poslední téma týkající se "velikosti webu" je množství funkcí, které očekáváte. Stejně jako v domě potřebujete topit a ideálně také automatizovaně větrat, u webu předpokládáte, že udělá hodně věcí za uživatele - vyfiltruje mu nabídku produktů, v mapě nabídne nejbližší pobočku, údaje vyplněné do formuláře zapíše rovnou do firemního CRM. V případě e-shopu nebo zákaznického portálu se s požadavky na funkcionality dostáváte ještě úplně jinam.

Co tedy znamená udělat nový web nebo e-shop?

Blíží se finále - co všechno se musí reálně stát, aby web vznikl, fungoval a plnil očekávání?

Výroba webu je série návazných kroků, kterými když projdete, získáte dobrý výsledek. Jsou to zejména tyto:

1) Analýza

Třikrát měř, jednou řež. Podívejte se, jací uživatelé a zejména odkud chodí na stávající web. A pozor, abyste o ně nevhodným redesignem nepřišli. Dál se zabývejte klíčovými slovy, která uživatelé při hledání vašich služeb zadávají do vyhledávačů. Mrkněte i na konkurenci.

2) Výzkum

Jak se reálně chovají lidi tam venku? Víte to vůbec nebo se jen domníváte? Uživatelský výzkum vám pomůže postavit hypotézy a opřít je o reálná data. Není snadný, ani levný. Ale rozhodně je mnohem úspornější než vytvořit web, který nebude fungovat. Dům taky nestavíte, aniž byste se bavili s těmi, kteří v něm budou bydlet.

3) Zadání

Jakou bude mít web strukturu? Jaké typy stránek na něm budou? Jaký obsah? Jak bude na stránkách rozložen? Jak budou tyto stránky mezi sebou propojeny? Co konkrétní funkcionality? Budoucí provoz webu? Zkušený dodavatel s vámi sepíše  velmi podrobné zadání , které na všechny tyto dotazy odpoví. A z něj učiní přílohu smlouvy o dílo. Protože jinak může na dílo pohlížet každý dost jinak.

4) Obsah

Je král, to víme. A dál? Na prezentačních webech je obsah opravdu stěžejní. Když není jasné, jaké sdělení na webu bude, je dost obtížné web začít vytvářet. Respektive to nedává vůbec smysl. Proto si pohlídejte, že máte v týmu někoho, kdo obsah připraví - ať už na vaší straně nebo v řadách dodavatele. A pozor, řeč není jen o textu, potřebujete také fotky, video a infografiku. Vše by mělo být dotažené a podrobně rozpracované.

5) Wireframe

Drátěný model alias prototyp webu slouží k odladění struktury, layoutu a provázanost stránek. Již velmi konkrétně ukazuje, jak bude web vypadat a fungovat. Jeho cílem není řešit grafickou podobu, ale jinak predefinuje téměř vše. Je vhodné jej naplnit už konkrétním obsahem, byť třeba jen typovým - není nutné rozepsat podrobně všechny služby či medailonky všech lidí ve firmě, stačí od každého jeden, nejlépe ten nejobsáhlejší možný.

V prototypu je prostor vše vyzkoušet, pohrát si klidně s více variantami a nebát se je otestovat na reálných lidech. Jeho výhodou je, že ho můžete velmi snadno, rychle a tudíž levně upravit. Což se o hotovém webu říct nedá. Dům si s architektem taky párkrát překreslíte, než kopnete poprvé do země.

6) Firemní design

Než začnete web kreslit, ujistěte se, že máte svoje logo opravdu v kondici, tedy jste s jeho podobou spokojení a máte ho k dispozici v křivkách. Pokud ne, je dobré to zavčas oznámit a zapracovat na modernizaci. Návazně je dobré rozpracovat celý manuál firemního designu, aby spolu veškeré výstupy ladily a bylo na první pohled rozeznatelné, že jde o vás. Jedním z výstupů je právě i web.

7) Design webových šablon

A jsme tam, kde se často začíná. Nejoblíbenější fáze klientů je grafika. Její význam je značný, avšak s ohledem na vše ostatní jednoznačně přeceňovaný. Ano, stránky musejí být krásné, kreativní, originální, nejlépe WOW, což je oblíbený termín definující klientovo očekávání. Nicméně ano, pokud máme vše ostatní v pořádku, pojďme udělat na 100 % i tohle. Dobré je myslet na různé stavy, do nichž se uživatel při používání dostane - tedy jak má vypadat vyrolované menu, tlačítko či banner po najetí myší, formulář po zadání špatných údajů a podobně.

8) Dokumentace pro vývojáře

Na začátku byla zadávací dokumentace. Teď už máme podobu webu vytvořenou, pojďme tedy popsat její přesné fungování tak, aby ji vývojáři mohli vyrobit na první dobrou a zaplatili jsme za ně co nejméně. Jelikož jejich práce bude na projektu hodně a jsou drazí, je opravdu na místě jim podklady připravit perfektně. Opět přirovnání - čím lepší dokumentace pro provedení stavby, tím méně trápení na kontrolních dnech nebo při přebírce. O časových a finančních ztrátách ani nemluvě.

9) Vývoj

Jupí, jdeme programovat! Nyní máte jako klient oddechový čas - vývoj obvykle běží bez potřeby vaší součinnosti a pokud je vše dobře připraveno, měl by proběhnout zcela hladce. Součástí je realizace atraktivního frontendu, tedy části, kterou vidí uživatel, a také důkladného backendu, tedy podvozku, na němž to celé stojí. Součástí backendu je obvykle redakční či publikační systém (tzv. CMS - content management system), v němž spravujete obsah webu, přidáváte nové stránky a vůbec jako editor vytváříte jeho finální podobu.

Nezapomínejme ani na integraci, třebaže v prezentačních webech nejsou to hlavní (na rozdíl od e-shopů či zákaznických portálů). Ale chcete-li mít do webu napojené mikroslužby třetích stran, analytiku nebo nehodláte ztrácet čas přepisem poptávek z formulářů do CRM či podnikového systému, udělejte tohle rovnou součástí dodávky.

10) Vystavení webu

Web se většinou vyvíjí lokálně, tedy na strojích dodavatele, k nimž nemáte přístup. Ve správný moment je však potřeba jej vystavit na testovací server, na němž je možné plnit obsah a testovat. Testovací server by měl být oddělen od produkčního prostředí, v němž web běží naostro pro běžné uživatele. Zkoušení novinek a ladění nových funkcí vždy dělejte v odděleném testovacím rozhraní.

11) SEO

Práce na SEO webu nikdy nekončí. Ovšem stavíte-li nový web, můžete spoustu věcí připravit a vychytat tak, abyste se k nim pak nemuseli znovu vracet a zbytečně tím ztrácet čas i peníze. Číslem jedna je správná struktura a obsah webu včetně titulků a metapopisků stránek či obrázků. Pohlídejte si také dobré přesměrování, kanonizaci URL adres a další technické aspekty tzv. onpage SEO - tedy té části, kterou můžete ovlivnit webem. Máte-li v ní vše v pořádku, můžete se už soustředit spíše na budování zpětných odkazů.

12) Testování

Už zase? Ano. Testovat je potřeba průběžně pořád, avšak nejvíc před chystaným spuštěním. U prezentačních webů jde zejména o testování zobrazení na všech různých platformách, zařízeních, prohlížečích a operačních systémech. Manuální testy jsou základ, pomoci ale mohou různé externí nástroje a také automatické testy, které pak můžete používat i v budoucnu - pohlídáte si tak třeba dostupnost webu či funkčnost formuláře.

13) Příprava ke spuštění

Přesměrování jsme už řešili, zbývá nastavit správně analytiku, robots.txt, sitemapu a samozřejmě domény, na kterých má být web dostupný. A pak už zbývá otevřít láhev šampaňského :)

Tak kolik to tedy bude stát?

Máme-li s dodavatelem upřesněné všechny aktivity, které jsou ke vzniku kvalitního webu zapotřebí, můžeme po něm chtít přesnou cenu, a to ideálně na korunu a nepřekročitelnou. Když máme dobré zadání, není absolutně důvod pro nějaké vícepráce, třebaže jsou v tomto oboru podobně jako ve stavebnictví častou součástí.

Pozor na blackbox

Dodavatel by pak měl díky podrobnému zadání přesně určit, kolik času na jednotlivé aktivity potřebuje. Čím více tohle pro vás v rozpočtu rozpadne na malé položky, tím více lze věřit, že opravdu ví, o čem je řeč. Naopak čím větší celky, tím větší blackbox a tím pádem významná obava, že se jedná o nespolehlivý rozpočet.

Jednotlivé položky by měly mít přiřazenou konkrétní cenu. Ideálně konstruovanou jako hodinová pracnost krát hodinová sazba. Některé funkcionality může mít dodavatel nachystané už jako hotový modul, který vám jen zapojí. Pak jim nemusí přiřazovat hodinovou pracnost, ale uvede konkrétní cenu. Reálně však tento scénář častý není - u webů vytvářených na míru je i u těchto předchystaných věcí potřeba něco donastavit tak, aby to zapadlo do konkrétního designu.

Hodinová sazba — údaj k ničemu?

K takto podrobné kalkulaci by měl dodavatel přiložit i ceník hodinových sazeb pro případné budoucí práce. Jak je uvedeno výše, při kvalitním zadání není důvod pro vícepráce, ale pokud budete chtít třeba v budoucnu něco upravit či rozšířit, je dobré vědět, jaké ceny u jednotlivých profesí můžete očekávat.

Bez znalosti konkrétního zadání je hodinová sazba sama o sobě ukazatel prakticky k ničemu. Zatímco jedna agentura ji bude mít nízkou, ale do projektu napočítá hodně hodin, jiná může mít přístup opačný. Vždy je tedy potřeba pídit se po celkové ceně a tu mít podepřenou opravdu velmi podrobným zadáním. Jak se k němu dopracovat, když nejste v oboru kovaní? Ideálně se s dodavatelem pobavit o vstupní studii , v rámci níž byste zadání dali společně dohromady.

Další aspekty úspěšné realizace webu, za které se platí

Máme podrobné zadání i přesnou cenu. To ale ke štěstí stále nestačí. Pohlídejte si, abyste měli také:

1) Harmonogram

Ať už se bude web dodávat agilně nebo klasickým waterfallem, bez časové osy těžko pohlídáte, že vše běží podle plánu. A důležitý není jen termín dokončení, zajímejte se o průběžné milníky, v nichž byste měli dostat průběžné výstupy. Vše pak hlídejte ideálně na týdenní bázi formou pravidelných schůzek či callů. Zkrátka kontrolních dnů jako při stavbě domu.

2) Tým na straně klienta a spolupráce

Web je společnou akcí dodavatele a zákazníka. Očekáváte-li, že dodavatel zafunguje jako automat na kávu, ze kterého po vhození částky vypadne hotový produkt, zaděláváte si na potíže. Dodavatel, zvláště ten zkušený, je sice profíkem v oboru, to však neznamená, že bez spolupráce s vámi může vyrobit web plnící vaše očekávání a řešící potřeby vašich zákazníků. Nebo dům taky hodíte na architekta se stavební firmou a na několik měsíců je necháte, ať dělají, co umí?

Dobrá rada tedy zní: definujte si u sebe, kdo všechno bude do webu mluvit, jaká bude jeho role a jak bude zapojen do spolupráce s dodavatelem.

3) Součinnost, role a odpovědnosti

Spolupráci je dobré si podrobně upřesnit. Dodavatel by měl říct, jakou součinnost a kdy bude potřebovat - v jaké fázi bude potřeba konzultovat, kdy máte dát nějaké rozhodnutí, v jakém formátu a kdy máte předat podklady a informace. Společně s vámi pak dohodne, kdo konkrétně bude v projektu zapojen z jeho i vaší strany, jakou má kdo roli a za co odpovídá. Ideálně si vše sepište do tabulky včetně kontaktů.

4) Smlouva o dílo a o provozu webu

Podepište si alespoň jednoduchou smlouvu o dílo. Měly by v ní být definované obě strany a jejich zástupci jak ti statutární, tak ti zapojení v daném projektu. Dále samozřejmě celková částka a případně její postupné splátky, způsob předání a akceptace díla a samozřejmě termíny - jak ten celkový, tak ideálně průběžných milníků. Dobré je myslet na autorská práva a od věci nejsou pokuty pro obě strany - dodavatel by měl mít penále za neplnění termínů v předávání díla, zákazník zase za pozdní platby. Součástí každé seriózní smlouvy musí být v neposlední řadě i vymezení licenčních podmínek na dílo pro případ, že byste jako klient chtěli změnit dodavatele. Vyhnete se tak rozčarování z toho, že vám zaplacený web vlastně nepatří.

Akceptací díla však život webu nekončí, ale vlastně teprve začíná - a proto se zabývejte také ujednáním o provozu webu. Kde a na čem poběží, jaká bude jeho garantovaná dostupnost a také jaké podmínky dodavatel zajistí pro řešení chyb a budoucích požadavků.

5) Chuť a odvaha pracovat na věci, která intervenuje do celé firmy

Poslední, ale nejdůležitější esence úspěšné realizace webu je na první pohled obyčejná, ale reálně je opravdu tou nejvíce podstatnou: bez vnitřního odhodlání, motivace a nezbytné energie se do akce raději nepouštějte. Na druhou stranu pokud vám nechybí, máte z půlky vyhráno a celou akci si můžete užít.

Zbývá popřát šťastnou ruku při volbě dodavatele.