komentárov: 2

10 “prehistorických” chýb pri tvorbe web stránok

10 – Používanie tabuliek namiesto DIVov

Začínajúcim webdizajnérom sa môžu viac páčiť tabuľky, keď ide o rozloženie celej stránky. Stačí nastaviť počet stĺpcov a riadkov, napchať do nich obsah a voilà, máme hotový web. Aj ja som to tak robil, keď som tvoril svoju prvú stránku cez FrontPage. Našťastie som si od toho odvykol, čo sa ale o niektorých tvorcoch webov povedať nedá. Dnes už našťastie týmto neduhom trpia prevažne len amatérske stránky, napriek tomu sa ešte sem tam dá vyhrabať nejaký serióznejší firemný web využívajúci tabuľky takýmto spôsobom. Tabuľky by sa mali používať len na to, na čo sú od začiatku určené – na tabuľky. Ak chcete niekde uviesť chemické zloženie výrobku alebo telefónny zoznam, OK. Nepoužívajte ale <table> tagy na rozloženie prvkov stránky. Na tento účel sa používa  <div> a to z viacerých dôvodov:

  • Tabuľky sú pomalé, pretože bunky málokedy majú špecifikované rozmery. Prehliadač teda musí pri načítaní stránky vyrenderovať obsah každej bunky a potom mu prispôsobovať rozmery tabuľky. Nakoniec aj tak celá tabuľka ostane rozhádzaná úplne inak, ako to autor pôvodne zmýšľal.
  • Málo kontroly nad načítaním obsahu. Tabuľky sa načítajú od prvej bunky po poslednú. Ak postavíte stránku pomocou divov, máte oveľa väčšiu kontrolu nad tým, v akom poradí sa jednotlivé prvy stránky načítajú. Chcete zobraziť najprv menu? Alebo reklamu, potom obsah a menu až nakoniec? Použíte divy.
  • Tabuľky sa zle prispôsobujú rozmerom okna prehliadača. Začiatočníci často robia tú chybu, že si neuvedomujú, že ľudia často používajú iné rozlíšenie obrazovky a dokonca nemusia mať okno prehliadača roztiahnuté na celý monitor. Stránka vytvorená z tabuliek sa s týmto zle vysporiadava a jednotlivé časti, ktoré do seba u autora pekne zapadali, sú zrazu porozhadzované po celej obrazovke.

9 – Používanie rámov

Tag <frame> dnes už patrí do starého železa a to z dvoch dôvodov. Za prvé, ľudia radšej skrolujú celou stránkou, ako len jej jednou časťou. Pôsobí to menej chaoticky a navyše ak je stránka zle postavená a treba skrolovať viacerými časťami jednej stránky, je to o nervy. Druhým dôvodom je, že ak už niekto trvá na použití takéhoto spôsobu zobrazovania webu, dá sa to šikovne a elegantne riešiť opäť cez divy a CSS (position:fixed).Niektoré prehliadače majú dokonca problémy so zobrazovaním rámov.

Jednak je chaos v tom, že jedna stránka obsahujúca 3 rámy je poskladaná zo 4 súborov. Každý rám má pritom svoju vlastnú url adresu, čo je dosť mätúce. Ďalším problémom je tlačítko Späť u rôznych prehliadačov. To sa chová nepredvídateľne a užívatelia sú potom popletení z toho, ako “funguje”. Niekedy sa totiž vrátite o celú stránku naspäť, inokedy sa zase zmení obsah len jedného rámu.

8 – Vodorovné posúvanie

Posúvanie stránok vertikálne je založené na prirodzenom smere čítania textov, teda zhora dolu. Už samotná nutnosť posúvať obsah stránky vertikálne väčšinu užívateľov odrádza a len málo ľudí študuje stránky aj za ich zlomom (časť stránky, ktorá je po načítaní mimo obrazovky a treba sa na ňu “presunúť”). Nutnosť skrolovať stránku ešte aj vodorovne je už naozaj nepríjemná. Horizontálne skrolovacie koliečko má na myši naozaj len málokto a aj s ním je prezeranie takejto stránky otravné. Mňa osobne najviac rozčuľuje, keď sa dá stránka posúvať vodorovne len o pár pixelov. Aký to má význam? Ten malý kúsok aj tak neobsahuje nič zaujímavé. Celé to skôr značí len o tom, že autor bol nešikovný alebo lenivý.

Existujú ale aj svetlé výminky, ktoré využívajú horizontálne posúvanie ako umelecký prvok. Proti tomu nič nemám, ak je do toho dobre integrované ovládanie koliečkom myši. Hlavne nech sa odomňa nevyžaduje, aby som posúval stránku všetkými smermi. Vďaka bohu za dvojrozmerný internet.

Táto stránka je žiarivým príkladom toho, že výnimka potvrdzuje pravidlo.

7 – Predvádzanie sa technológiami

Ak predpokladáte, že väčšina vašich návštevníkov sú počítačoví machri, ktorých životné hodnoty sú dodržiavanie internetových štandardov a noriem, tak určite nesmiete zabudnúť na svoju stránku pridať logá o XHTML Strict validite a o kompatibilite s ďalšími normami. Ak ale robíte stránky napríklad pre nejaký hotel, návštevníkov budú zaujímať hlavne fotky a informácie o ubytovaní. Či stránka spĺňa nejaké normy bude každému ukradnuté, zbytočne to len odpútava pozornosť a o ubytovacích službách to neprezradí ani ň. Väčšina ľudí aj tak ani len netuší, čo to HTML je.

Taktiež sa nesnažte do stránok napchať všetky možné technológie a vymoženosti len preto, aby ste sa potom mohli predviesť. Základom každého webu by mali byť veci, ktoré sú časom overené, sú všetkým známe a spoľahlivo fungujú. Postaviť celú stránku na úchvatných animáciách pomocou JavaScriptov (a ešte sa tým všade chváliť) je zbytočné, ak má užívateľ v prehliadači Javu vypnutú.

Prepĺňanie stránok technológiami je skôr egoizmus autora, ktorý si chce dokazovať, že vie niečo viac, ako ostatní. Vtip je v tom, že ostatní to vedia tiež a navyše vedia, prečo to tak nerobiť. Najlepšie stránky sú jednoduché, efektívne, atraktívne a zaujímavé obsahom, nie formou.

6 – Dlhé stránky

Dnešné trendy síce nasvedčujú tomu, že stále viac a viac ľudí je ochotných skrolovať stránky, aby odhalili viac. Napriek tomu ale ešte stále ide o menšinu a viac ako polovica ľudí sa neobťažuje posúvať stránku, aby si prezrela zvyšok obsahu. Ak sa potrebujete preklikať cez 10 webov, aby ste našli jednu informáciu, na každej stránke strávite len pár sekúnd a nebudete ju študovať dopodrobna. Najdôležitejšie informácie by preto mali byť vždy čo najvyššie, aby ste tak uľahčili život svojim návštevníkom a zároveň docielite, že sa dostanú k vášmu obsahu, ktorý hľadajú. Webstránky totiž ľudia nečítajú, ale skenujú. To znamená, že v rýchlosti očami preletia cez obrazovku, aby odhalili základné stavebné prvky webu. Okrem tých, ktorí vidia internet prvý krát v živote už nikto nečíta všetok text na obrazovke. Každý vidí len tu logo, tam menu, v strede obsah a dole prehlásenie o ochrane údajov. Pri takomto bleskovom prezeraní webu je potreba skrolovania otravná a zbytočne zdržuje.

5 – Používanie tlačítka reset pre vynulovanie formuláru

Web má byť  v prvom rade orientovaný na užívateľa. Vy sa ho snažíte svojimi stránkami zaujať a nalákať. Musí sa preto na vašom webe cítiť pohodlne a príjemne. Ľudia za počítačom sú veľmi leniví a ľahko ich odradí, ak majú kliknúť čo i len o jeden krát viac, ako je potrebné. Nedajbože od nich chcete, aby vypĺňali nejaký formulár. To si vyžaduje čas a trpezlivosť, pozorne naťukať všetky požadované údaje. Prečo by som teda ako dizajnér mal ponúkať možnosť kompletne vymazať všetky vyplnené políčka formuláru? Pokiaľ sa nejedná o nejaký špeciálny prípad, kedy treba jeden a ten istý formulár vypĺnať stále dokola, je možnosť vyresetovať ho úplne zbytočná. Dokonca by som povedal, že až nebezpečná. Ako som spomenul, ľudia nečítajú text, len skenujú očami základné prvky. Pod formulárom vidia tlačítko a automaticky si domyslia, že je to gombík na odoslanie zadaných údajov. Tento proces sa deje podvedome v zlomku sekundy. Návštevník na tlačítko klikne a až potom si všimne, že celý formulár sa vynuloval a že tlačítko Submit sa v skutočnosti nachádza až pod zlomom stránky. Mne by sa teda nechcelo celý formulár vypĺňať znova a asi by som sa na to vykašľal…alebo si aspoň dobre zanadával.

4 – Stránky optimalizované pre konkrétny prehliadač

Často vidím na nejakej stránke napísane “Optimalizované pre Internet Explorer 6.0 a vyššie”. Čo to má akože znamenať? Že mám svoju Operu alebo Google Chrome zahodiť do smetí? Ja chcem ale používať ten browser, ktorý sa mne páči. Prečo by mi mal niekto podsúvať nejaký iný? Alebo sa mýlim a v skutočnosti to znamená, že browser nemusím meniť, ale prídem o niektoré výhody, ktoré stránka ponúka pod Internet Explorerom? Aj keď to už síce znie lepšie, stále ide len o menšie zlo.

Stránky majú byť robené tak, aby sa zobrazovali správne vo všetkých prehliadačoch, čo je síce dnes dosť zložité. Existujú síce rôzne normy a miera ich dodržiavania sa postupom času zvyšuje, stále ale rôzne prehliadače zobrazujú niektoré stránky odlišne. Navyše optimalizácia má byť samozrejmosťou a nie niečím, čím sa treba chváliť.

3 – Vytvorenie celej stránky vo Flashi

Stránka vytvorená kompletne vo Flashi je skôr dielom počítačového grafika ako niekoho, kto sa rozumie do tvorby web stránok na komplexnejšej úrovni. Najprv nekonečný loading sprevádzaný nejakou zvučkou alebo animáciou, potom rôzne efekty, animácie a videjká, ktoré len zdržujú a zbytočne frustrujú užívateľov. Vo filme by to možno vyzeralo pekne, ale v skutočnom svete už nie.

Ďalším problémom je to, že Google a aj ostatné vyhľadávače Flashu nerozumejú a nevedia rozpoznať jeho obsah. V dôsledku toho potom utrpí návštevnosť.

Flash technológia sa používa na rôzne miniaplikácie zahrnuté do stránok (kalkulačka na prepočet kurzov, interaktívny kalendár, multimediálny prehrávač a pod.). Vyvtoriť celú stránku vo Flashi je ale neefektívne a aj keď to možno vyzerá na prvý pohľad super a robí to skvelý prvý dojem, v konečnom dôsledku bude takáto stránka pre návštevníkov stále viac frustrujúca z viacerých dôvodov:

  • Flash vyžaduje výkonný počítač. Mobily zložitejšie animácie takmer nezvládajú.
  • Ovládacie prvky sú často neštandardné a človeku nejaký čas trvá, kým sa v takom prostredí zorientuje.
  • Stránka vo Flashi zožerie viac kilobytov ako štandardná.
  • Je potrebné urobiť dodatočnú non-Flash verziu webu, čo je robota navyše.

2 – Veľa pohyblivých a animovaných prvkov

Všetkého veľa škodí. Ktosi raz zistil, že GIFy môžu byť aj animované a v zápale entuziazmu ich do svojho webu napchal toľko, koľko sa ich tam len vošlo. Potom niekto iný objavil Flash.

Animácie a rôzne iné pohyblivé efekty by sa na stránke mali používať naozaj len sporadicky. Pôsobí to veľmi rušivo a ak má človek čítať dlhší text, pričom mu neustále bliká do očí nejaký banner, je to dosť otravné. Používajte animácie, ak chcete zobraziť svoju reklamu na cudzej stránke. Vtedy vás nemusí zaujímať, že odpútate pozornosť návštevníkov danej stránky, ak ich tak prilákate na tú vašu. Je to možno sebecké, ale pokiaľ ide o peniaze, je to celkom logické a robia to tak všetci. Nepoužívajte ale animácie na vlastnej stránke na odpútanie pozornosti od jej hlavného obsahu.

1 – Uvítacie stránky

Už aj začínajúci web dizajnéri vedia, že uvítacie stránky (a nedajbože ešte aj Flash videá) sú zbytočné, otravné a nepraktické. Bohužiaľ je ale veľa klientov, ktorí si toto neuvedomujú, a keďže sa im takéto intrá páčia, budú po vás chcieť, aby ste im ich vytvorili.

V prípade reálnej “kamennej” stavby je použitie akéhosi vstupného koridoru logické. Človek si vytvára dôležitý prvý dojem pri vstupe do budovy, kde ho vítajú exotické materiály, prepracovaná architektúra a sexi recepčná s veľkým poprsím. To je ale realita a vo virtuálnom svete to funguje trochu inak. Človek hľadá informácie. Nepotrebuje byť ohúrený. Vždy je lepšie mať jednoduchú, ale praktickú stránku, ako takú, ktorá je graficky vypiplaná do najmenších detailov, ale neponúka žiadne relevantné informácie. Toto je problém uvítacích stránok – sú síce pekné, ale sú oničom.

Ak by môj klient trval na uvítacej stránke, tak by som do nej zakomponoval aspoň nejaké základné funkcie, ako napríklad navigáciu a vyhľadávanie. Obyčajné tlačidlo “Vstúpte” nestačí, skôr je tam na obtiaž. Človek sa z neho nič nedozvie, ale musí kliknúť o jeden krát viac, než je nevyhnutné. A na internete je konkurencia len jeden klik ďaleko, takže bacha na to.



good ale ta trojka je blbost a este co si tam pisal o jave tak dnes to uz nema povolene maximalne jedno percento browserov tak nevidim problem pri ja ve ale chvalit sa tym je fakt blbost take veci nech si napise do blogu nee?? 😀

peki - 31.8.2009 o 12:36

Odpovedať

Mas pravdu, musim suhlasit so vsetkym. Ale tie chyby su naozaj “prehistoricke” a kazdy normalny webdesigner ich pozna. Neviem si predstavit ze by niekto robil web s tabulkovym designom alebo by dokonca pouzival ramce. Takisto len dieta by mohlo dostat napad zaplavit svoju stranku animovanymi gif-ami.

allan764 - 8.9.2009 o 15:42

Odpovedať

Pridať komentár

Diskusia je striktne moderovaná. Píšte len k veci a podľa možností inteligentne. Ak chcete kritizovať, buďťe konštruktívni. Komentáre typu "lol", flamewar, vulgarizmy a off-topic sem nepatria a budú zmazané.

Tvoje meno:

Sem napíš niečo inteligentné: