11 bežné chyby webového dizajnu (chyby)

Existuje veľa stránok na internete a stovky alebo pravdepodobne tisíce sú vytvorené cez deň. Tu je veľmi zaujímavá vec premýšľať - Aké sú prvky dobrého webu?

Budovanie webových stránok môže byť skľučujúce, ale skutočná výzva spočíva v tom, že je použiteľná. Problémom je, že väčšina webových dizajnérov zabudla, že webové stránky neboli vytvorené pre seba, ale aby vyriešili potreby používateľov. Dávajú kreativitu prednosť pred praktickosťou a použiteľnosťou.

V tomto článku by sme chceli zdôrazniť 11 web design chyby, ktoré web vývojári a dizajnéri robiť a niekoľko návrhov, ako možno tieto chyby ľahko vyhnúť.

1. Kde je pole Vyhľadávanie?

Web je ako archív informácií. Bez ohľadu na to, či ide o firemnú webovú lokalitu alebo o blog, je kľúčové vyhľadávacie pole. Návštevník by mohol hľadať niečo, čo je v rámci webových stránok skryté, s vyhľadávacím poľom je pravdepodobné, že návštevníci dostanú to, čo chcú.

Návrhy:Vlastné vyhľadávanie Google je úhľadný, jednoduchý a efektívny spôsob, ako začať. Umožňuje návštevníkom efektívne vyhľadávať vaše stránky. Stačí skopírovať kód HTML z ovládacieho panela a prilepiť ho na vašu webovú lokalitu a voilà ?? º Ã'Â, máte funkciu vyhľadávania priamo na vašich webových stránkach.

Tu je jednoduchý kód formulára na zobrazenie vyhľadávacieho nástroja Google na vašich stránkach. Jediné, čo musíte urobiť, je zmeniť názov webovej lokality na meno vašej webovej lokality. Okrem toho môžete upraviť hodnotu odoslania na všetko, čo sa vám páči.

viac: Navrhovanie svätého vyhľadávacieho poľa: Príklady a najlepšia prax- Tento článok podrobne opisuje pokyny pre návrh vyhľadávacieho poľa.

2. Zlá čitateľnosť a čitateľnosť.

Je to dôležitý prvok webového dizajnu. Samozrejme, že dobrý dizajn rozhrania uchopí pozornosť používateľov, ale používatelia musia čítať text, aby mohli pochopiť informácie, ktoré si želajú. Niektoré webové stránky používajú tie bizarné štýly a veľkosti písma, ktoré robia čítanie bolesti.

Návrhy:Našťastie existujú jednoduché spôsoby, ako môžete urobiť, aby ste zlepšili čitateľskú skúsenosť používateľov na vašich webových stránkach.

1. Porovnať farebné schémy väčšiny významných lokalít a všimnite si, ako farby zlepšujú čitateľnosť. Dobré miesto na vyskúšanie rôznych farebných schém je Adobe Kuler.
2. Použite a Bez písma bez písmen pretože umožňuje ľahké čítanie na webe.

viac: Tu je dobrý článok, ktorý vám poskytne viac tipov na zlepšenie čitateľnosti - Čitateľnosť - Jednoduché čítanie webových stránok.

3. Neorganizované rozloženie obsahu.

Obsah webových stránok je to, čo prináša návštevnosť. Ako je štruktúrovaný obsah, je to, čo urobí úspech alebo zlyhanie. Používatelia nečítajú, ak to nie je absolútne nevyhnutné, ale prehľadávajú informácie a vyberajú body záujmu na webovej stránke. Niektorí dizajnéri práve vložili blok textu na webovú stránku a úplne zanedbali názvy, podkapitoly, guľky, kľúčové slová, odseky atď..

Použite príslušný názov stránky pre každú webovú stránku, aby používatelia presne vedeli, kde sa nachádzajú. Niektorí dizajnéri dokonca zabudli pomenovať webovú stránku.

Celkovo najhoršie v tejto kategórii bude mať na vašich webových stránkach nepresný, nedostupný, nevýznamný alebo zastaraný obsah. Obsah sa musí zhodovať s celkovou témou webovej stránky a byť užitočný. Ak je stránka vo výstavbe, prečo ju obťažujete? Ak dizajnér naozaj musí, je to len dočasné a 3 týždne už nebudú považované za dočasné.

Návrhy: Usporiadať obsah na vašich webových stránkach pomocou HTML a CSS by sa mali používať pri vytváraní návrhu vašich stránok.

1. Vytvorte dostatok medzery medzi textom a obrázkami pomocou okrajov.
2. Aktualizujte a buďte dôslední. Účelom aktualizácie nie je len pridávanie nového obsahu, ale aj skreslenie a náprava minulých chýb. Jakob Nielsen navrhuje, aby ste si najali web “záhradník”.

Rozpočet na prenájom webového záhradníka ako súčasť vášho tímu. Potrebujete niekoho, aby zakorenil burinu a presadil kvety, keď sa webové stránky menia, ale väčšina ľudí by skôr trávila čas vytváraním nového obsahu ako údržbou. V praxi je údržba lacným spôsobom, ako zlepšiť obsah vašich webových stránok, pretože veľa starých stránok si zachováva ich relevantnosť a malo by byť prepojené na nové stránky. Samozrejme, že niektoré stránky sa po dátume exspirácie úplne odstránia zo servera - Jakob Nielsen

4. Zlá navigácia.

Navigácia v rámci webových stránok by mala byť bezproblémová. Používatelia by si mali byť schopní ľahko nájsť cestu. Hoci neexistuje žiadny štandard pre navigáciu v rámci webových stránok, najmä teraz, keď sa objavujú nové technológie vývoja webu, je nevyhnutné pochopiť, že navigácia musí byť intuitívna a konzistentná.

Ak sa text používa ako navigácia, mal by byť stručný. Vizuálne metafory by sa nemali znovu objavovať. Ak sa používajú hypertextové odkazy, mali by sa vyčnievať z textu textu. Mŕtve odkazy by nemali mať miesto na žiadnej webovej stránke. To zvyšuje zmätok používateľov a čas stráca. A ten, ktorý je ešte horší, má odkaz na domovskej stránke, ktorá odkazuje na domovskú stránku.

Návrhy:

1. Uľahčite navigáciu pomocou popisov textu pre všetky odkazy. Zadajte text pre obrázky. Použite alternatívne techniky opisu textu pre odkazy vo formáte Flash alebo Javascript.
2. Usporiadajte a usporiadajte navigáciu v tandeme s témou webovej stránky. Osobné webové stránky si môžu dovoliť byť kreatívnejšie, ale prístupné, ale firemné webové stránky si vyžadujú väčšiu efektívnosť a prehľadnosť.

Pamätajte si, že ak používatelia nemôžu nájsť to, čo chcú, za menej ako 3 kliknutia, väčšina z nich okamžite opustí.

viac: Implementácia efektívnej navigácie na webe - Tento článok poskytuje viac informácií o implementácii efektívnej navigácie pre vaše webové stránky.

5. Nekonzistentný dizajn rozhrania.

Nadmerná kreativita môže byť práve taká. Nadmerné! Niektorí dizajnéri ju pri vytváraní webových stránok vytvárajú na inej úrovni tým, že vytvárajú rôzne vzory pre každú webovú stránku v rámci webovej stránky. To v žiadnom prípade nie je pre užívateľa mätúce. A úplne nepríjemné. Nezáleží na tom, akú výnimočnú a atraktívnu webovú stránku, ak celkový vzhľad nie je konzistentný, používatelia sa na ňu nemôžu vzťahovať a cítia sa menej ovládaní. Tak, keď opustia, hneď ako prídu.

Návrhy:

1. Použite štandardnú konzistentnú šablónu pre každú stránku s odkazmi na hlavné časti stránky.
2. Kľúčové slovo je jednoduché. Vytvorte esteticky jednoduché vzory a používatelia sa na vaše webové stránky nikdy nezmätia.

6. Nepriateľské rozlíšenie obrazovky.

Som si istý, že sme navštívili webové stránky, kde musíte horizontálne posúvať. To je absolútne ne-no v modernej web dizajnu. Dobrý dizajnér bude vyvíjať webové stránky, ktoré sa hodia na väčšinu veľkostí obrazovky. Aktuálne optimalizované rozloženie stránok v súčasnosti je 1024 x 768 pixelov.

Návrhy:Je ťažké a takmer nemožné uspokojiť dizajn tak, aby vyhovoval každému rozlíšeniu, najmä keď návštevníci teraz surfujú z mobilných telefónov a netbookov, ale môžeme získať hrubú predstavu o tom, aké sú všeobecne použité rozlíšenia obrazovky týmito spôsobmi:

• Skontrolujte svoje štatistiky - Analytické služby, ako je služba Google Analytics, poskytujú informácie o tom, aké rozlíšenie monitorov používajú. Toto sú užitočné informácie, ktoré by ste mali vedieť pred začatím ďalšieho prebudovania.
• Štatistiky prehliadača Školy W3 - Školy W3 poskytujú jasné zoznamy najobľúbenejších prehliadačov používaných netizens a triediť ich podľa popularity. Existujú aj ďalšie zaujímavé a dôležité štatistiky.

7. Komplikované registračné formuláre.

Registračné formuláre sú zložité. Koľko informácií od používateľa potrebujete? Preč sú dni, keď používateľ musel zadať milión podrobností na registráciu na vašich webových stránkach. Niektoré webové stránky robia väčšinu registračných polí povinnými a potvrdzujú polia do takej miery, že po niekoľkých pokusoch je používateľ frustrovaný. Nezabudnite, že používatelia navštívia webovú lokalitu na získanie informácií. Nie naopak.

Jednoduchá forma spoločnosti Someecard umožňuje bezbolestnú registráciu.

Návrhy:Porovnať registračné formuláre medzi komunitami na webe a pochopiť, aké základné informácie sa od používateľa vyžadujú počas procesu registrácie.

viac: 9 bežné chyby použiteľnosti vo webe - Tento príspevok na časopisu Smashing Magazine sa zaoberá hĺbkovým zhliadnutím na registračné formuláre medzi ďalšími chybami použiteľnosti.

8. Bezohľadné používanie obrázkov / animácií.

Príliš veľa obrázkov na webovej stránke je obrovské vypnutie. Obrázky môžu byť použité na zachytenie pozornosti používateľov, ale môže to byť aj rozptýlenie alebo jednoduché zhoršenie. Obrázky by sa mali používať na ilustráciu a usmerňovanie používateľa tam, kde je to vhodné.

Animácie sú úžasné a výkonné médium. Najmä pri správnom používaní. Keď je to cyklus alebo príliš veľa na webovej stránke, dostane sa na nervy užívateľov. Používatelia nemajú trpezlivosť, čas alebo zdroje, takže návrhári musia ponúknuť alternatívy alebo ešte lepšie, tlačidlo preskočiť, ak je to celá animácia stránky.

viac: Blesk: 99% Zlý - Použite správne Flash. Je to už takmer 10 rokov, čo Jakob Nielsen publikoval tento článok, ale stále je relevantný z hľadiska použiteľnosti Flash, najmä Prerušuje Základy webu kus.

9. Neporiadok stránok, viac bielych priestorov.

Príliš veľa dizajnérov zabudne Biely vesmír a jeho význam. Sú tak zatiahnuté do vlastnej tvorivej tvorivosti, že zabúdajú, že to nie je o nich. Preto sa pokúšajú napchať čo najviac na jednu stránku. Konečný výsledok? Zaneprázdnená, neporiadaná a nečitateľná stránka.

kylestanding dobre využiť bielych priestorov vo svojom dizajne.

Tu je niekoľko článkov, ktoré vám dajú dobrý nápad dôležitosť medzery v webovom dizajne:

• Porovnanie štyroch usporiadaní bielych priestorov
• Hodnota bieleho priestoru
• Biely vesmír

10. Žiadna hudba na pozadí, prosím!

Používatelia nechcú vychladnúť, hľadajú účinnosť. A áno, 99% nezáleží na hudbe na vašich webových stránkach. Niektorí dizajnéri to zhoršujú tým, že na každej webovej stránke kladú rôzne hudobné pozadia.

Návrhy:Nepoužívajte hudbu na pozadí, ale ak musíte, vytvorte rámček pre ovládacie prvky kódu a používateľa. Takto sa hudba opakuje, namiesto toho, aby sa menila vždy, keď sa na webe načíta nová stránka. A používateľ môže kedykoľvek zastaviť alebo pozastaviť.

11. Test, test a test.

To sa nedá vyzdvihnúť. Koľkokrát sme sa nachádzali na webových stránkach, ktoré možno zobraziť iba v určitom prehliadači? Weboví vývojári musia mať pri testovaní webových stránok kontrolný zoznam druhov.

• Môže sa webové stránky zobrazovať v rôznych prostrediach?
• Je konštrukčné rozloženie konzistentné vo všetkých prehliadačoch?
• Môže byť web zobrazený v rôznych nastaveniach, ako sú vypnuté obrázky, vypnutý jazyk JavaScript atď?

Návrhy:W3C ponúka nástroje na testovanie zabezpečenia kvality. Odhlásiť sa Nástroj na zabezpečenie kvality W3C a Validácia webových stránok.

záver:

Udržujte to jednoduché, hlúpe (K.I.S.S). To je spodný riadok. Ak je to jednoduché, je použiteľné. Všetko vo všetkých, skvelé webové stránky sú jednoduché a použiteľné. Urobte si domáce úlohy a je to jednoduché a prirodzené.

Aké sú vaše skúsenosti v projektoch webového dizajnu? Aké ďalšie tipy a myšlienky by ste chceli podeliť o chyby webového dizajnu?

Poznámka redaktora: Tento príspevok je napísaný používateľom Brujo Owoh pre Hongkiat.com. Brujo Owoh je multimediálny systém, ktorý sa špecializuje na webový dizajn a 2D animáciu. Má radosť z čítania beletrie, stretnutia so svojimi kamarátmi a udržiavania trendov v oblasti dizajnu na Twitteri. Navštívte blog Brujo.