„Dobrý den, potřebujeme webové stránky. Jste schopen je dodat? A kdy to může být hotové?“ To je mi trochu povědomý text. Přesně takový začátek blog postu jako bych už někde…
Ano. Před rokem jsem napsal článek pro laiky o tom, jak se dělá web.
Že se nepeče tři hodiny jako husa. Že je to docela hokna, postavit nový web.
V textu jsem rozebral první tři kroky – s tím, že zbývající čtyři brzy dopíšu. Ale druhý díl jsem dokončil až teď. Proč?
Protože mi mezitím pořád někdo psal, že potřebuje web!
A kdy to prý může být hotové. Uááá…
Základním omylem je pořád to samé: personifikace vybraného freelancera do všespásné role webdesignéra.
Jako bych já jako copywriter mohl postavit web. Jako by vámi oslovený programátor mohl postavit celý web. Jako by jeden grafik sám mohl…
Pardon, ale to vám ho dřív postaví mrtvá prostitutka.
A nebude to web.
Jak se dělá web(designér)
Ujasněme si jeden termín.
Slovo „webdesignér“ obsahuje tolik oblastí dohromady, že by se jednomu akorát rozskočila lebka, kdyby to měl všechno dělat sám.
Dobrý webdesignér ví od všeho trochu, dokáže dát dohromady plán, vytipovat správné lidi, je machr na prototypování, umí eliminovat zbytečné chyby a odborně hlídá všechny dílčí etapy projektu. Aby do sebe vše zapadlo.
Trochu připomíná pozici stavbyvedoucího. Když stavíte dům, tak si to bez něj moc nelajznete.
(Aspoň v to doufám.)
Ale asi už stavbyvedoucího nebudete nutit, aby dělal na baráku rozvody (to necháte elektrikářům a instalatérům) nebo si hrál se střechou (to bude dělat šikovný tesař a klempíř).
Stejně jako instalatérovi – jakkoli špičkovému – nesvěříte dozor nad celou stavbou.
Odbornou práci mají dělat odborníci. Svůj k svému. Richtig?
Dnes vám opět ušetřím hodně času, peněz a nervů.
7 P – Profesionálně prověřená pravidla pro pořádnou podnikovou prezentaci
Z první lekce víte, že web vzniká v těchto 7 základních krocích:
POZICE – branding
PRŮZKUM – analýzy
PERSONY – scénáře
PROTOTYP – návrh
PODOBA – grafika
PSANÍ – copywriting
PROVĚRKA – testování
První tři kroky máme za sebou. Dnes dokončíme zbytek.
Už vidím, jak se programátoři chytají za procesor: „A kdo ten web fakticky asi postaví na nohy, có, ty chytrej?“
To je přesně to osmé „P“, které najdete za sedmým krokem. Proč to uklízím takhle na tajnačku až dolů… to se tam dočtete.
A to bych nebyl já, kdybych nepřidal nějaký bonus navíc – hledejte na konci článku.
Jo, začíná to taky na „pé“.
(Panebože, není to nic propojeného s post mortem prostitutkami, přísahám.)
Připraveni?
Play.
4. KROK – PROTOTYP: (Ne)slušné návrhy webu
Abyste mohli v ČR navrhovat domy, potřebujete mít fakultu architektury (a pak autorizaci).
Abyste mohli v ČR navrhovat weby, potřebujete vysokorychlostní internet (a trochu drzosti).
Proto pozor, pokud vám v poště přistane grafický návrh vašeho nového webu bez toho, že by někdo udělal nutné úvodní kroky 1–3.
Tohle prostě nejde nijak občurat. Jinak střílíte slepými na neexistující terč.
Musíte udělat domácí úkoly: co jste (POZICE), proč/jak/kde/čím to chcete/můžete/máte/měli byste prodat (PRŮZKUM) a hlavně komu přesně (PERSONY).
Jakmile tato data máte, tak… né! Ještě žádná grafika! Co máte pořád všichni s tou grafikou, lidi.
Jakmile tato data máte, tak to znamená, že se nebojíte pro nový web pustit nějakou kačku.
To je dobře. Moc dobře. Protože teď musíte pustit další hrachy – za návrh webu:
Jaká bude struktura a obsah?
Jak budou stránky logicky provázané?
Jaké prvky na nich přesně budou – a proč?
U jednodušších stránek může mít návrh statickou podobu wireframu – drátěného modelu. Ten vypadá třeba takto.
Pokud ale máte rozsáhlejší web se složitější strukturou, tak vřele doporučuji prototyp – interaktivní maketu webu s funkčním prolinkováním. Tu je modelový cvičný příklad od Jakuba Rokyty.
Pro cokoli jako e-shop je prototyp zřejmě povinností.
Ale co tady budu lézt do UX zelí někomu, kdo už to všechno přesně popsal.
Sledujte: Jana Řezáče
Doporučená literatura k tématu: Časopisy ABC (ročníky 1983–1988)
5. KROK – PODOBA: Grafik, nebo designér?
Jedeme dál. Máte v ruce wireframe či prototyp. Bomba.
Teď na tom může začít vyšívat grafik. Tedy designér. Ideálně designér se specializací na webový design, že.
Proč to slovíčkaření? Protože si to potřebujeme rozlišit.
Grafik navrhuje tiskoviny, sází brožury, maluje ikonky… Prostě dělá grafiku. To je v naprostém pořádku. (Práci spousty grafiků jen tiše obdivuji.)
Vy ale hledáte webového designéra. Člověka, který posledních pět či deset let nedělal nic moc jiného, než se zdokonaloval v grafickém návrhu webu.
Proto je v tom tak dobrý. A proto jeho design bude fungovat lépe než ten od grafika. To není otázka „líbí/nelíbí“. To je otázka systematické praxe.
Jak pro potřeby vašeho webu rozpoznat grafika od designéra? Zkusil bych malý test:
Zadejte jim zakázku – že potřebujete grafiku nového webu.
Kdo odpoví ceníkem a termínem dodání, to je grafik.
Kdo na vás bude mít tisíc dotazů, to je designér.
Ať tak či onak, bacha na jednu věc: webová grafika tu není od toho, aby zázračnými barvičkami doháněla chybějící výstupy z předchozích kroků (analýzy, persony…).
Ona na tu práci musí navazovat – a vytvořit funkční design, díky kterému zákazník na vašem webu hladce vklouzne přesně tam, kam má. Ideálně do košíku.
Rozumíme si? To jsem rád.
Sledujte: Adama Hrubého – a speciálně tuto jeho přednášku (vím, má to 40 minut).
Doporučená literatura k tématu: Sněhurka a sedm trpaslíků (hlavně ta pasáž se zrcadlem)
6. KROK – PSANÍ: Copywriting is everything
Šok! Psaní textů že následuje až po grafice?
To je věčné téma. Co bylo dříve: vejce, nebo slepice? Co bylo při výrobě webu jako první: texty, nebo grafika?
Svedl jsem s různými grafiky několik památných bitev. (Zajímavé je, že s designéry ani jednu.)
Věc se má totiž tak. Buď jde o profesionálně vedený projekt, a pak nemám problém napsat texty i předem, do přehledně připraveného prototypu – protože je naplánováno jeho testování.
Ale přiznejme si, často to takto nechodí. A osoba webdesignéra v projektu citelně chybí.
Nechtěně ji supluje většinou grafik, ten je z toho nasupený (vůbec se mu nedivím), nerad dělá propracované wireframy (to naprosto chápu), takže chce ode mě „už ty hotové texty pro grafiku“…
A to je šach mat. Typická Hlava XXII.
No ne, řekněte mi: Jak si mám z prstu vycucat texty, když neznám funkcionalitu prvků na stránce, pro kterou mají ty texty sloužit?
Je nesmysl psát copy, když nevíte CO–KDE–JAK–PROČ má přesně být. Pak je z toho kočkopes. A zbytečné vícepráce. Fuj fuj fuj.
Ještě vám poradím, jak vyberete toho správného copywritera pro svůj projekt:
Oslovte ho se svým tématem. Zajímá ho?
Pokud ne, raději oslovte někoho jiného.
Nikdy s ním nesmlouvejte o ceně.
Jo a návod, jak napsat texty pro web, jsem už napsal. Stáhněte si ho zdarma.
Sledujte: Nebe nad sebou a zákazníky v obchodě.
Doporučená literatura k tématu: Malý princ (Antoine de Saint-Exupéry)
7. KROK – PROVĚRKA: Testováno na lidech
Pro koho děláte svůj web? Pro sebe? Špatně!
Vyhoďte si z hlavy tu nebezpečnou myšlenku, že by web měl sloužit hlavně vám.
Vám ať slouží třeba prodejní sklad, služební auto nebo firemní intranet. Tam si to prostředí vymazlete, jak chcete.
Ale web je brána pro ostatní – aby se k vašemu byznysu vůbec dostali.
A jak zjistíte, že to na ně funguje? No přece tak, že jim ten web ukážete!
Testování mám symbolicky až v tomto (před)posledním kroku, ale to vůbec neznamená, že s ověřováním udělané práce máte čekat až na hotovou beta verzi webu.
To by mohl být taky hodně drahý průser. A platit ho pak budete vy.
2 základní rady pro testování:
TESTUJTE KDYKOLI – tedy kdykoli vás to posune správným směrem. Potřebujete rozsoudit nějaké dilema? Tak ho otestujte. I malý test je dobrý test. V jakékoli fázi. Do hlavy zákazníkům nevidíte, dokud je fakt neuvidíte, jak na co reagují.
TESTUJTE OPAKOVANĚ – tedy opakovaně v různých krocích. Můžete si například otestovat úvodní koncept, pak třeba použitelnost v prototypu, poté emoční styl webu s grafikou, následně funkčnost ostrého webu po spuštění… atd.
Prostě: Čím dřív zjistíte chyby/omyly/výsledky, tím levněji se dá všechno upravit.
Ale prosím vás, je to přece můj web a vlastnímu byznysu rozumím nejvíc já sám, že jo?
No tak když myslíte, strécu…
Správně provedené testování, do kterého se teď zdráháte investovat těch pár tisíc, může v budoucnu ušetřit statisíce i miliony – které vám jinak postupně protečou v nefungujícím webu/e-shopu.
Schválně, otestujte to.
Sledujte: Lukáše Marvana
Doporučená literatura k tématu: Honzíkova cesta (Bohumil Říha)
--------------------------------------------
8. KROK – PROGRAMOVÁNÍ: dEXEmpo PHPlex
Jsem rád, že si pamatuju kód ke své platební kartě.
Další kódy už jsou na mě moc.
Programování/kódování dávám v článku takto bokem, protože:
Tomu rozumím asi jako koza petrželi.
Je to tak specifická technická věc, že se s ní laik–zadavatel webu nechce (a podle mě ani nemusí) víc seznamovat.
Možná nejsem jediný, pro koho jsou zkratky jako C++, PHP či SQL jen těžko srozumitelným mikrosvětem uzavřeným do sebe.
Mikrosvětem, který denně všichni ochotně používáme… ale prostě mu nerozumíme. Ani za mák.
Je to paradox našeho makrokosmu? Jasně. A velký. Ale takhle to prostě je.
Pokud jste náhodou programátoři a chcete to změnit, sepište PRO LAIKY nějaký svižný, čtivý, vtipný a praktický úvod do programování, že ho pochopím i já. Rád si počtu, ostatní určitě též – a vy budete za evangelické hrdiny svého oboru. High five!
Do té doby se my laici spolehneme na to, že budeme vědět, za kým zajít, aby se nám postavil na nohy ten web.
Já mám třeba skvělou zkušenost s flegmatickým kodérem Jakubem Skalou a bohémským programátorem Honzou Pospíšilem.
Pro rozsahem složitější věci zkuste Superkodéry (kódování šablon) nebo Proof & Reason (vývoj webu).
BONUS – PROMO: Plnou nádrž reklamy, prosím
Tak. Máte postavený web. Včera jste ho spustili. Šampaňské, chlebíčky, potlesk. Hurááá.
Následuje prostor na jednu z nejčastějších chyb. Která to je?
Když se dokončí web a vy složíte ruce do klína.
A za chvíli je zase sprásknete nad hlavou: Šmarjá, jak to, že o tom webu nikdo neví?!
Spuštěním stránek to celé pro vás teprve začíná.
Web je totiž jako auto. Můžete mít nadupané Lambo… ale bez natankování vám pojede leda tak z kopce.
Palivem pro váš web není nafta ani benzín, ale mnohem výbušnější směs: online marketing.
Pokud rádi dáte na doporučení, tak tady jsou ta moje osobní:
SEO: Pavel Ungr
PPC: Proficio
Facebook reklama: David Lörincz
Sociální sítě: Adam Zbiejczuk
E-mailing: Roman Lelek
A to je dnes ode mě z dějiště webového šampionátu všechno – předávám slovo zpátky do studia vašeho vlastního webu.
Enter.
Share Tweet Share
Please enable JavaScript to view the comments powered by Disqus.
Disqus
