19. 12. 2006 v sekci webdesign:

Disciplíny webdesignu

Webdesign není programování. Ale na druhou stranu to není ani jenom design. Z čeho se tedy vlastně skládá?

Po dočtení všech komentářů jistého Freeze, který si s zirafkou povídal o webdesignu pod článkem Design Meltdown v rámech jsem se rozhodl napsat o jednotlivých disciplínách webdesignu tak, jak je vidím já. Mám nutkavou potřebu sjednotit si pojmy.

Webdesign se skládá z těchto hlavních disciplín – Použitelnost, Design, Přístupnost, Copywriting a SEO. Všimněte si, že do něj vůbec nezahrnuju programování (ať už na straně uživatele, nebo serveru).

Jako základní disciplínu webdesignu nepočítám ani HTML kód, protože kód je použitá technologie, kterou dosahujeme on-page SEO faktorů, přístupnosti a celistvého zobrazení webu v prohlížečích. Na druhou stranu – web bez (X)HTML není web. Stejně tak webdesign jako takový nezahrnuje SEM (marketing ve vyhledávačích).

Použitelnost a design

Použitelnost je nadtřídou designu. Použitelnost zajišťuje, že se uživatelé na webu zorientují a jsou schopni se jednoduše a intuitivně dostat ke svému cíli (pokud tedy na webu je – a to by měli z použitelného webu vyčíst velmi velmi rychle). Design je pak už jenom bonus k použitelnosti, který se pokouší propojit funkční a estetickou složku webu (tedy jak tvrdí wikipedie).

Dobrý design je vždy použitelný. Na druhou stranu – použitelný web může sestrojit i zručný koder a přitom o designu nemusí vědět ani ťuk. Design ani použitelnost (ve své podstatě) nezávisí na použité technologii – dobrý design může být ve flashi, rámech, tabulkách, validním HTML, nevalidním XHTML a přitom může být ve všech případech skvěle použitelný (tedy – pokud už si ho zobrazíte). Designérovi je v podstatě jedno, jestli to nakódujete tak nebo tak (pokud se mu web nerozpadne v jeho oblíbeném browseru), výstupem práce designéra je sada obrázků.

Přístupnost

Co ovšem velmi souvisí s použitou technologií je přístupnost. Přístupnost zaručuje, že web uživatel uvidí (uslyší) nezávisle na použité technologii. Web bude úplně jiný v linxu, IE5 či poslední Opeře, ale uživatel dostane šanci se na něj alespoň v nějaké formě podívat.

Web nemusí být validní ani well-formed, aby byl přístupný. Web nemusí být navržen designérem, aby byl přístupný. Web může být chaotický a nepoužitelný – i když se na něj člověk dostane, tak na něm stejně nic nenajde – ale přesto může být skvěle přístupný.

SEO

Optimalizace pro vyhledávače. Dobře udělaný web je přístupný a použitelný, ale také dbá hned od začátku na vyhledávače. Vyhledávače přinášejí webu návštěvníky, dobře vytvořený web dělá z návštěvníků zákazníky a zákazníci nás živí. Bez zákazníků by web v nynější podobě neexistoval a všichni bychom byli na univerzitách (jako vědci), nebo na dlažbě.

SEO má dvě poddisciplíny – onpage (ty si nakódujete a napíšete sami) a offpage (ty si povyměňujete, poregistrujete, pooptimalizujete a pozaplatíte taky sami, ale pokud je váš web skutečně dobrý, tak vám s nimi mohou pomoci i vaši návštěvníci) faktory.

Copywriting

Aneb psaní textů pro web. Bez dobrých textů je web nepoužitelný a špatně optimalizovatelný pro vyhledávače. Copywriting se prolíná všemi disciplínami a do jisté míry je důležitější než ostatní. Forma sice prodává, ale bez skvělého obsahu není CO prodávat.

Kde je ten kód?

Kód je někde mezi tím vším. Jednak přímo souvisí s přístupností a SEO – bez dobrého kódu se k Vám prostě postižení uživatelé (komfortně) nepodívají a zároveň zajišťuje, aby byl web velmi podobný v jednotlivých prohlížečích (což už zase maličko zabíhá do designu a použitelnosti).

Mýtus: Dobrý web má validní kód

Validátor není modla, ale berlička. Berlička pro kodera, který hledá na svém webu chyby, které způsobují špatné vykreslování v některém z prohlížečů – vždy je jednodušší ladit validní kód, než nevalidní, protože nevalidita může tyto chyby přímo způsobovat. Tak si nehrajte na profíky jen proto, že máte validní web.

Ale web ještě nemůže existovat bez..

Analýzy, která dá celému webu směr. Bez důkladné analýzy nikdy nebude skvělého webu (protože bude možná o něčem úplně jiném, než by měl), skvělého obsahu ani zákazníků. Nebo je to všechno úplně jinak?

Komentáře

1. frko
19. 12. 06, 12.29

Amen!
A občas to všetko musí zvládnuť jeden človek.
čo neprospieva ani webu ani človeku ani klientovi.
No čo už keď klient nechápe že za 6900Sk štyria nevyžijeme.

19. 12. 06, 12.39

Já bych ještě explicitně zmínil informační architekturu. Má velkou souvislost se vším ostatním (přístupnost, použitelnost, SEO), ale jedná se vlastněo samostatnou návrhovou (designovou) disciplínu.

19. 12. 06, 12.58

Také jsem o tom všem přemýšel. Nakonec ze mě vypadlo toto schéma http://www.adaptic.cz/znalosti/ (doufám, že ten odkaz nevadí, je to k tématu). A to je to vše ještě velice zjednodušené.

19. 12. 06, 13.23

Vesměs souhlas, použitelnost by se dala brát jakožto podtřída designu. Zkrátka pro mě kvalitní design = výborná grafika + snadná použitelnost.

5. kahi
19. 12. 06, 13.31

Podle mého skromného názoru není možné popsat tvorbu webu výčtem disciplín, a pokud ano, pak velice zjednodušeně a v konečném důsledku nedostatečně. Nedávno jsem někde viděl diagram, který se pokusil popsat vztahy disciplín grafickou formou a… přišel mi mnohem více vypovídající, než, sorry, tvůj článek. (…) Neříkám, že bych to napsal lépe, ale spíš bych si vzal vzal menší sousto, jednu disciplínu, třeba ten design href=„http://kahi.cz/blog/na-dyzajn-se-zapomina“ rel=„nofollow“>http://kahi.cz/blog/na-dyzajn-se-zapomina …

19. 12. 06, 14.13

K tomu validnímu kódu bych ještě přidal poznámku „nehrajte si na profíky jen proto, že ignorujete validátor a pomlouváte w3c“ – tak mi to totiž občas přijde v diskusi jakpsatweb.

7. dgx
19. 12. 06, 14.46

Velmi pěkně sepsáno!

Odstranit zcela programování je trošku ošidné, protože JavaScriptové vychytávky zlepšující použitelnost souvisí výhradně s webdesignem, tedy jak jsi jej definoval, a nikoliv z vývojem webových aplikací.

19. 12. 06, 17.31

Filosofe, diky za tento clanek. Myslim, ze bude hojne odkazovany (-;

9. Zdeněk Košťál
19. 12. 06, 17.51

No já vidím web jako změť disciplín, které jsou vzájemně propojené, navazují na sebe, když jedna chybí, snižuje to použitelnost webu (použitelnost podle mě není jen rozvržení prvků na stránce, ale celkový dojem z používání a komfortu). Velice pěkný článek, i když každý to vidí asi trochu jinak a ne se všemi body úplně souhlasí, ale opravdu pěkně shrnuté… tohle dát přečíst klientovi… aby si uvědomil že není sranda dělat web za pár korun, pokud to chce navíc kvalitně… díky

10. mZk
19. 12. 06, 18.10

Pěknej přehled, vesměs souhlasím až na to seo. Onpage a offpage. To bych řekl, že je trochu jinak, ale nevím přesně jak :)

11. Tony
19. 12. 06, 18.25

Off-page faktory:
Kdyby měl člověk u výborného webu vyčkávat až se zpětné odkazy vytvoří samy, tak ho konkurence dávno porazí. Já jsem samobudování zpětných odkazů dávno zatratil.

12. Maňas
19. 12. 06, 21.22

K designu a použitelnosti bych rád doplnil tyto podle mého názoru výstižná a moudrá slova:

>Když navrhujete design dveří, u kterých je klika jenom dva centimetry nad zemí, brzy zjistíte, že váš design nefunguje. když navrhnete křeslo, které bude vyrobeno z křehkého skla, také brzy zjistíte, že váš design prostě nefuguje.
>
>Design je vytváření něčeho, co má smysl. Dveře nám umožní vcházet nebo vycházet z místnosti. Auto je něco, co můžete řídit, a křeslo je něco, na čem můžete sedět. Vše vzniká za přesným účelem použití a je vytvářeno pro uživatele s cílem poskytnout mu co největší uživatelský komfort. To, že se na křesle dá sedět, splňuje jeho základní funkčnost. To, jak vypadá, jeké je na dotyk, jak pohodlně se v něm sedí, to vytváří pocity, které se spojují s daným designem.
>:Robert Mindžák, Dokonalý web design

Plno designérů tvoří podle toho co vidí, ale princip, že web je pro uživatele, zůstává v pozadí.

PS: S Texy! nejsem moc kamarád, doufám, že se to zobrazí správně ;)

13. Bee_male
21. 12. 06, 15.07

Bezva článek s mnoha odpovídajícími příměry, asi pošlu odkaz některým „designérům“, kterým musím neustále dokola vysvětlovat, že navrhovaný web nedělají pro sebe ani jiné „takydesignéry“, ale především pro zákazníka a uživatele jeho webu …

14. --==[FReeZ]==--
21. 12. 06, 15.37

Bohuzel nemohu zcela souhlasit, clanek mi prijde az prilis subjektivne zabarveny. Bude potreba napriklad vytvorit novy CMS, jehoz cilem je uspokovojat co nejvyssi mnozstvi zakazek na webdesign.

V tomto pripade se provede analyza. V podstate vyzkum prokaze, ze nejdulezitejsi jsou features, maximalni funkcnost, stabilita a podpora templates. Prirovnavam to k zakladnimu kameni pri stavbe mnohapatrove budovy, ktera musi vydrzet pohromade co nejvice let. Vse vyse uvedene je kod, jenz napisi programatori. Ti by meli udelat maximum proto, aby dodrzeli standardy, pokud se na ne vykaslou, kdo se v tom po nich vyzna? Veskere upravy vcetne bug fixingu si vyzadaji zbytecne mnoho casu – financi.

U one man show neni nic neobvykleho prehlizeni vsech doporuceni, nicmene u vetsich projektu bych to nikomu provadet neradil. Zakladni pozadavek je mit v kodu cisto. Cilem je vybudovat stabilni, plne funkcni rozhranni, ktere bude co nejvice univerzalni, snadno rozsiritelne a spravovatelne. Cilem neni vytvorit jednorazove reseni, ktere bude obcas za pekneho pocasi „nejak“ fungovat.

System by mel podporovat templates, aby kazdy grafik smel nasadit svuj nadherny vzhled a zaroven kazdy copywriter bude mit moznost napsat sve kvalitni texty. Budou to vsak programatori a analytici, kteri se postaraji o system, to oni pridavaji vse podstatne pro pozdejsi praci grafiku, koderu, copywriteru, do jiste miry i SEO expertu.

Pokud uz webdesigner ma svuj framework, zabyva se vyhradne pouzitelnosti, vzhledem, texty a SEO, jak jiz ostatne bylo zmineno v clanku, ale neprehlizejme vsechnu tu praci analytiku/koderu/programatoru, ktera vsemu komfortu pokazde predchazela. Kod neni nepodstatne „neco“ mezi tim vsim, kod je to nejpodstatnejsi, na cem se zaklada veskera pozdejsi prace ostatnich vyvojaru.

15. David
21. 12. 06, 22.09

[14] Článek byl o disciplínách webdesignu. Uvědomte si, že budování CMS, programování a kódování není součástí webdesignu. A pokud to není součástí webdesignu, pak není přehlížením, že dané profese nejsou zahrnuty v tomto článku.

Myslím, že by si Honza měl (což už jsem mu ostatně psal) ujasnit smysl slova design a termínu webdesign (který je jeho podmnožinou). Není to „vzhled“ (v tomto smyslu ho zdá se používá)!

Jestli zařadit Javascript a HTML je otázka. Osobně si myslím, že ne. Designer je od toho aby danou funkčnost vymyslel a ne naprogramoval.

16. --==[FReeZ]==--
25. 12. 06, 16.05

[15] WebDesign == tvorba webu. WebDesigner == clovek, ktery tvori web. Odkdy neni programovani a kodovani soucasti tvorby webu?

Funkcnost by mel vymyslet analytik. Slovo designer vede ke zbytecnym omylum, mnohem vhodnejsi je pouzivat spravny pojem grafik / graficka.

17. dgx
26. 12. 06, 19.39

> Mýtus: Dobrý web má validní kód

To není mýtus, hele href=„http://validator.w3.org/check?uri=www.dobryweb.cz“ rel=„nofollow“>http://validator.w3.org/check?uri=www.dobryweb.cz

18. David
27. 12. 06, 10.53

[16] Tvorba webu nerovna se webdesign. Kde jste se neco takoveho docetli? Uvedte mi zdroj. Pokud mozno neco jineho nez Wikipedii.

Odpustte, ale jestli povazujte za spravny pojem grafik/graficka, tak tady jenom ztracim cas. Grafik je clovek, ktery se venuje grafice (napr. linoryt, drevoryt apod.) nikoli grafickemu designu (navrh tiskovin, webu apod.).

29. 12. 06, 07.46

Na každý z těhle kroků by měl být specialista a ne aby jeden člověk dělal všechno.. Dobrý web by měl být vytvořen týmovou spoluprácí..

btw: co se týče validnosti, tak v některých případech to ani nejde, aby byl validní

20. --==[FReeZ]==--
31. 12. 06, 00.32

dle meho nazoru se grafik venuje grafice, pod kterou spada graficky design webu stejne, jako graficky design cehokoli jineho. Je mi lito, pokud Vy pracujete s takovymi grafiky, kteri nedesignuji, ale pouze kopiruji praci jinych grafiku.

21. --==[FReeZ]==--
31. 12. 06, 00.40

mimochodem Webdesign == Tvorba webu viz http://www.google.com/search?…

31. 12. 06, 20.17

[18] – nu, jak to říct.. jsme převážně praktici, nikoliv teoretici.. my tvoříme weby, tedy se věnujeme programování, analýzám, copywritingu, kódování a designování.. tj. webdesignu (ať už si tam někdo zahrne to, nebo ono).

Důležité jsou výsledky, nikoliv slova. Je mi šumák, jestli je např. Pavel Kout kreativní grafik nebo kreativní designér (či kreativní webdesignér).. důležité je, že vytváří skvělé weby.

23. David
01. 01. 07, 19.22

[20] Upozorňoval jsem na to, že termíny grafik/grafika jsou poněkud nepřesné. Podívejte se na definici slov na Wikipedii nebo raději do nějaké tištěné encyklopedie. Grafika se zabývá tiskovými technikami. Ale narazil jsem také na širší definici slova grafik, která zahrnuje i grafického úpravce. Právě kvůli této nepřesnosti se od názvu „grafik“ postupně přešlo k názvu „grafický designer“, který přesněji vystihuje „intelektuální“ složku popisované práce. Sám si zvolte jaký termín Vám více sedne.

Místo „správný pojem“ jsem měl tedy lépe napsat „přesnější pojem“. Omlouvám se.

[21] Proč je tedy mezi termíny „webdesign“ a „tvorba webu“ většinou čárka?