O klientovi
Pískovna Pohořelice se specializuje na výrobu a prodej materiálů, které se používají především ve stavebnictví. Najdete u nich cokoliv od zásypového materiálu, zátěžového štěrku přes materiál na beton nebo maltu až po písky či štěrky na omítání, výstavbu chodníků, cest, silnic, dálnic apod. Vedle toho rádi pomohou s přistavěním, naložením i odvezením materiálu do kontejnerů na jejich dvou provozovnách nedaleko Přibic a v Hustopečích a navíc vám zajistí přepravu po republice i mimo ni.
Více o klientovi na www.piskovnapohorelice.cz
Zadání klienta
Hlavním cílem bylo především sloučit dva původní weby, které již zaostávaly v několika směrech. Docházelo ke zbytečné duplicitě obsahu, když se v podstatě jednalo o jednu firmu se dvěma provozovnami v Přibicích a Hustopečích. Grafika, vzhled, barevnost i rozmístění prvků nebylo konzistentní, působilo zastarale a nemoderně. To mělo vliv na menší efektivitu a funkčnost obou webů.
Nový web je měl proto spojit do jedněch stránek, jednoho vizuálního stylu, který bude moderní, přehledný, efektivní, zároveň živý a kreativní a bude klást důraz na konverznost. Důležitým faktorem bylo také zahrnout techničtější, stavební styl (s ohledem na obory činnosti), který bude na první pohled napovídat, co vlastně firma dělá a s čím může zákazníkům pomoct.
Výsledné řešení
Při tvorbě nového webu jsme si nejprve s klientem vyjasnili veškeré podrobnosti tak, abychom byli schopni udělat web kompletně na míru podle všech jeho přání. Následně jsme zpracovali novou strukturu webu a vytvořili grafické návrhy na domovskou stránku i podstránky. Práci jsme pak předali kodérovi, který grafiku nařezal, implementoval na redakční systém Comerta a připravil webové stránky na aplikaci modulů. Dále jsme doplnili moduly na míru, jako např. katalog s výpisem a detaily produktů. Na samotný závěr jsme všechno překontrolovali, doladili poslední detaily a konečně spustili.
Přípravná fáze, struktura a grafika nového webu
V prvních krocích je důležité dostat se s klientem na stejnou vlnu. Proto jsme nechali majitele Pískovny Pohořelice vyplnit pár jednoduchých dotazníků, na základě kterých pak v prvních fázích vycházíme. Ptali jsme se třeba na:
- co se jim na stávajícím webu nelíbí;
- weby, které se jim líbí a ze kterých by rádi brali inspiraci;
- co pro ně je a není důležité (z pohledu webu, požadavků, publikovaných informací, barev, designu apod.);
- cíle, kterých chtějí s novým webem dosáhnout;
- konkurenční výhody;
- jakým způsobem chtějí být kontaktováni.
Jakmile jsme zjistili všechny tyto potřebné náležitosti, pustili jsme se do prvních náčrtů. Podrobně jsme rozepsali požadavky klienta, cílovou skupinu nebo jaké produkty a služby prodávají. Dále jsme si rozvrhli strukturu webu (wireframe), navigační menu a až 7 typologických stránek (např. homepage, výpis, produkt nebo kontakty) i s předpokládaným obsahem a rozmístěním jednotlivých prvků. Na základě takto sepsané specifikace jsme vytvořili komplexní zadání pro grafika.
Grafik následně zpracoval grafický návrh na míru pro homepage, podle které se pak určuje ráz celého webu. Jakmile ho jednatelé společnosti Pískovna Pohořelice odsouhlasili bez výhrad, grafik doplnil i ostatní typové stránky, čímž jsme ukončili jednu z částí tvorby nového webu. V grafickém návrhu jsme kombinovali barvy z logo manuálu s akcentem na písečnou žluto-hnědo-zlatou. Kladli jsme důraz především na moderní a čistý vzhled, přehledné a funkční uživatelské rozhraní a co největší jednoduchost při poptání materiálů a služeb.
Nakódování grafiky, programování modulů
V další fázi se předávají dostupné materiály a podklady kodérovi, který grafiku nastuduje, zpracuje a nařeže tak, aby se dala aplikovat na nyní již reálně vznikající webové stránky. Nejprve jsme proto implementovali náš redakční systém Comerto. V rámci něho jsme pak nakódovali postupně všechny stránky. Dáváme při tom pozor nejen na validitu, ale také na čistotu kódu.
Graficky připravené webovky v tento moment trochu připomínají šablonu, do které je ještě potřeba vložit klíčové informace. K tomu nám mnohdy slouží moduly na míru, které naplníme obsahem od klienta. Pro Pískovnu Pohořelice jsme jich naprogramovali rovnou několik, např. pro výpisy a detaily produktů či poboček. Díky modulům se třeba produktový katalog může na pár kliknutí zobrazovat na vícero stránkách.
Dokončení detailů
Celý web se poté musí ještě několikrát překontrolovat z pohledu uživatelů, kodérů či SEO specialistů:
- Vyzkoušeli jsme funkčnost webu, celý si ho znovu a znovu proklikali a zjistili, co funguje a co nefunguje a tyto nedostatky z hlediska UX a UI doladili. Typicky jsou to prvky, které se jeví jako tlačítka, ale nic nedělají, nebo seřazení informací podle důležitosti.
- Kodér se podíval na techničtější aspekty, jako je validita kódu, minifikace obrázků, zajištění responzivity na různých zařízeních a prohlížečích a nastavení redirectů a errorů 404.
- Z pohledu SEO jsme zajistili, aby byly webové stránky indexovatelné roboty webových vyhledávačů a abychom nenechali žádné aktivní tzv. broken linky (odkazy vedoucí na 404). Aktivovali a implementovali jsme analytické nástroje (Google Analytics, Google Search Console, Seznam Webmaster Tools) a nastavili v nich odpovídající cíle.
Klientovi jsme tak na závěr předali kompletně nový web se vším všudy a v novém hávu. Podařilo se nám sloučit obsah dvou webů do jednoho. Akcentovali jsme zaměření na stavebniny. Zároveň vypadají webovky moderně a čistě. Uživatelům umožňují na pár kliků poptat libovolný materiál v jakémkoliv množství, porovnat cenu v Pohořelicích a Hustopečích a případně si požádat o další doplňující služby. A v dnešní době standardem už je dobrá optimalizace k procházení na počítači i telefonu.
Rozdíly po a před
Hodnocení klientem
Podobné reference
Tvorba e-shopu na míru pro Prefa Brno
Nový prezentační web zaměřený na design a čisté provedení
Redesign webu hotelu Continental
