Co proces tvorby webu zahrnuje?
- Research
- Návrh a design webu
- Tvorbu obsahu
- Schválení designu klientem
- Předání práce s designérem
- Kódování
- Předání demoverze a zapracování případných připomínek
- Optimalizaci
- Spuštění webu
- Tvorbu jazykových mutací
1. Research
Každému správnému projektu, se kterým to myslíte vážně, předchází research. Ten má u nás v případě webu několik částí. Zkoumáme trh, na němž se klient pohybuje, provedeme analýzu konkurence, v rámci online marketingu děláme keyword research a další. Disponuje-li klient nějakou aktuální verzí webu, sledujeme jeho statistiky a chování uživatelů nebo provádíme jinou aktivní formu testování.
Výstupem průzkumu je pak přesné zadání, sitemapa (struktura webu), userflow (to, jak očekáváme, že se bude uživatel na webu pohybovat) a další parametry toho, co musí web splňovat. Společně s klientem často přijdeme na věci, které nikoho před začátkem práce nenapadly.
2. Návrh a design webu
Grafická podoba webu je téma na samostatný článek a jistě brzy vznikne. I samotný webdesign se dá rozdělit na více částí. Designér vždy na základě průzkumu začíná pracovat na uživatelském rozhraní (UI) webu. U větších projektů začínáme wireframem – tedy, jak rádi říkáme, černobílými obdélníčky, které znázorňují rozložení (layout) a celkový koncept webu. Dále pak pokračujeme designem, respektive tou částí designu, kterou klienti vnímají nejvíce, a tou je samotným vzhled webových stránek. Vycházíme z brandbooku zákazníka, nicméně máme za sebou i projekty, kde jsme začínali zcela od nuly.
Výstupem designu je pak většinou celý web ve formátu JPEG nebo prototyp v InVision (viz níže). Ale jak jsem zmiňoval, je to polovina celého projektu a zpravidla stovky hodin práce, tedy určitě téma na samostatný článek.
3. Tvorba obsahu
Tvorba obsahu velmi záleží na povaze a velikosti projektu. Na obsah se snažíme myslet už od první fáze projektu. S textovým (copywriting), ale i multimediálním obsahem klientovi vždy rádi pomůžeme nebo jeho tvorbu zajistíme zcela. Obsah často vychází z komplexnější marketingové strategie. Čím dříve obsahem disponujeme, tím lépe pro projekt. Dáváme také doporučení na tvorbu obsahu, který bude vznikat až po spuštění webu. Typicky třeba blogové články.
4. Schválení designu klientem
Jakmile je design hotov, předáváme jej klientovi. K tomu používáme aplikaci InVision, v níž je vidět celý design tak, jak uvidí hotový web samotní uživatelé. Dále je klient schopen přidávat komentáře, na které můžeme reagovat, a jeho připomínky zapracovávat. Web často také prototypujeme, aby klient mohl design používat jako reálný web. Může se jím proklikávat a testovat jej. U větších projektů používáme tento nástroj také na testování v rámci vývoje produktu už ve fázi wireframů.
Je důležité, aby veškeré změny týkající se vzhledu webu byly zapracovány ještě před začátkem samotného kódování. Změnit design je mnohem jednodušší než změny v kódu. Někdy i na první pohled banální změna (klient často vidí vše jako banální zásah) může znamenat mnoho hodin práce a rozpad původního konceptu kódu. Proto je právě schválení designu klíčové.
5. Předání práce s designérem
Proces předání designu do developmentu je velmi důležitý. Jakékoli nedorozumění mezi designérem a developerem nás v budoucnu může stát drahocenný čas při změnách v kódu. Proto v Justmighty této části věnujeme velkou pozornost. Je nutné, aby si designér a developer sedli a vysvětlili si veškeré prvky, které se na webu objeví. Součástí předání je i vysvětlení všech funkcionalit a jejich chování. Dále je pak zásadní i responzivita, zejména nestandardních prvků na webu. Je důležité, aby developer přesně věděl, jak to designér myslel, a poté s tím pracoval. Vzhled webu na mobilních zařízeních je nutno zohlednit už při designu a návrhu kódu jako takového.
Developer potřebuje znát i veškeré technické parametry webu. K tomu používáme aplikaci Zeplin, která celý proces ulehčuje. Designér tedy nahraje design do Zeplinu a vývojář veškeré parametry designu vidí v aplikaci. Pokud dojde zpětně ke změně v designu, nahráváme tyto změny opět do souborů v Zeplinu. Máme tak vždy jistotu, že developer pracuje na aktuální verzi. Jakmile je vše jasné, přijde na řadu samotná tvorba webu.
6. Kódování
Aby mohl vývojář navrhnout nejefektivnější řešení, musí o webu vědět vše ještě před tím než na něm začne pracovat. Mezi tyto informace patří veškeré interaktivní prvky webu, responzivita, ale i to, které části budou statické a kde si chce klient obsah upravovat v administraci. Kódování můžeme rozdělit na dvě části. Nejdříve se dělá verze pro PC, potom následuje responzivní část pro mobilní zařízení (jsou ale i případy, kdy děláme tzv. mobile first a tam je postup obrácený).
Samozřejmostí je u našich webů příprava na SEO a online marketing. Každý náš web splňuje veškeré on-page požadavky. Poté, co se dokončí kódování, přichází na řadu testování na různých prohlížečích a zařízeních, abychom si byli jisti, že vše funguje, jak má.
7. Předání demoverze a zapracování případných připomínek
Jakmile web dokončíme, odprezentujeme jej klientovi. Nejlépe se prezentuje na živém webu, kde je možné si vše vyzkoušet. Proto nejdříve dodáváme plně funkční demo verzi, která je 1:1 shodná s webem, který budeme spouštět. Klient si může vše projít a dát nám feedback. Když už je web hotový, dají se v něm dělat jen drobné úpravy. Většina připomínek se týká úpravy formulací některých vět či doplnění informací. Jakmile si řekneme finální ano, můžeme začít s přípravou webu na spuštění.
8. Optimalizace
Optimalizace je nezbytná. Správnou optimalizací násobně zrychlíte načítaní webu a snížíte jeho celkovou velikost. Nejvíce se to projeví u obrázků. Není třeba, aby se načítaly stejné obrázky pro monitory s vysokým rozlišením a pro mobilní telefony a tablety s nižším rozlišením displeje. Optimalizací docílíme toho, že web bude potřebovat co nejméně dat při zachování stejné kvality na všech zařízeních. To ocení zejména uživatelé mobilních zařízení, kteří nepoznají rozdíl v kvalitě, ale v množství čerpání dat na mobilní síti určitě ano. Optimalizaci připravujeme i pro obsah, který se na web bude přidávat později (např. fotky k blogovým článkům).
9. Spuštění webu
Při spuštění webu je důležité, aby byl spuštěn na dostatečně kvalitním hostingu. Je škoda, aby web, kterému se dostalo tolik péče, brzdil špatný hosting. Proto klientům nabízíme tři balíčky hostingů, aby si každý mohl vybrat podle svých preferencí a potřeb. Většinu webů spouštíme na našich pronajatých serverech, jsme tak schopni garantovat kvalitu služeb. Naše servery také můžeme přizpůsobit různým situacím. Když se bude spouštět online kampaň a čekáme větší návštěvnost webu, jsme si jisti, že jsou na to servery připraveny. Web ještě před spuštěním zabezpečíme proti různým útokům včetně spamu, aby nedošlo k žádným nepříjemnostem.
Vše připraveno? Spouštíme, ale co by se ještě hodilo?
10. Jazykové mutace
Potřebujete web, který bude prodávat po celém světě? Žádný problém. Naše weby jsou i na tuto možnost připravené a mohou mít nespočet různých jazykových mutací. Co si pod tím představit? Jedná se o přesnou kopii webu v jiném jazyce. Klienti často vyžadují i odlišné weby pro různé mutace. Například na anglické verzi webu nějaké doplňující informace pro zahraniční návštěvníky. Pokud se má mutace v něčem lišit od původního webu, je nutné, aby se s tím počítalo už při návrhu designu. Jakmile na to web není připraven, je to, jako by se začínalo od nuly. U totožných webů stačí pouze nahrát přeložené texty a web v jiném jazyce je během několika dní připraven na spuštění.
Web jsme spustili, mouchy vychytali a zajistili jsme jeho kvalitní provoz. Přesto vše teprve začíná – web je živý organismus, o který je třeba se starat neustále. Vždy je co zdokonalovat.
Tvorba webu je v Justmighty denním chlebem. V dalších článcích vám přiblížíme jednotlivé body procesu tvorby detailněji.
Také byste chtěli web, který má všechny tyto vlastnosti? Rádi vám s ním pomůžeme.
