11 Közös webes tervezési hiba (Blunders)

Vannak tonna honlapok az interneten, és több száz vagy valószínűleg több ezer születik napközben. Itt van egy nagyon érdekes dolog, hogy gondolkodjunk - Melyek a jó weboldalak elemei?

A weboldal építése ijesztő lehet, de az igazi kihívás abban áll, hogy használhatóvá válik. A probléma az, hogy a legtöbb webes tervező elfelejtette, hogy a webhelyet nem önmagukra hozták létre, hanem a felhasználók igényeinek megoldására. A kreativitás prioritásai a gyakorlatiasság és a használhatóság szempontjából.

Ebben a cikkben szeretnénk kiemelni 11 webes tervezési hiba, amit a webfejlesztők és a tervezők teszik és néhány javaslat arra, hogy ezeket a hibákat könnyen el lehessen kerülni.

1. Hol található a Keresés mező?

Az internet olyan, mint egy információ archívuma. Legyen szó akár vállalati webhelyről, akár csak egy blogról, a keresőmező elengedhetetlen. Lehet, hogy a látogató keres valamit, ami rejtett a weboldalon, a keresőmezővel, valószínűleg a látogatók megkapják, amit akarnak.

Javaslatok:Google Egyéni keresés egy tiszta, egyszerű és hatékony módja az indulásnak. Lehetővé teszi, hogy a látogatók hatékonyan kereshessenek webhelyén. Csak másolja a HTML kódot a kezelőpanelről, és illessze be a webhelyére és voilÃ? Â?.

Íme egy egyszerű űrlapkód, amely a Google keresőmotorját is megjeleníti a webhelyén is. Mindössze annyit kell tennie, hogy megváltoztathatja a webhely nevét a webhely nevére. Plusz, módosíthatja a benyújtási értéket bármi, amit szeretne.

Több: A Szent keresőmező tervezése: példák és legjobb gyakorlat- Ez a cikk a keresőmező tervezésének irányelveit tartalmazza.

2. Gyenge olvashatóság és olvashatóság.

Ez a web design alapvető eleme. Természetesen a jó kezelőfelület kialakítása megragadja a felhasználók figyelmét, de a felhasználóknak olvasniuk kell a szöveget, hogy megértsék a kívánt információt. Néhány webhely a legkülönfélébb betűtípusokat és -méreteket használja, amelyek a fájdalmat olvasják.

Javaslatok:Szerencsére egyszerű módszerek állnak rendelkezésre a felhasználók olvasási élményeinek javítása érdekében.

1. Hasonlítsa össze a legtöbb nagyobb helyszín színsémáját, és vegye figyelembe, hogy a színek hogyan javítják az olvashatóságot. Egy jó hely a különböző színsémák kipróbálására Adobe Kuler.
2. Használj Sans serif betűtípust mivel lehetővé teszi a könnyű olvasást az interneten.

Több: Itt van egy jó cikk, amely további tippeket ad az olvashatóság javításához - Olvashatóság - a weboldalak könnyen olvashatóvá tétele.

3. Szervezetlen tartalomelrendezés.

A webhely tartalma a forgalmat irányítja. A tartalom strukturálása az, ami sikeressé vagy kudarcossá teszi. A felhasználók nem olvassák el, hacsak nem feltétlenül szükségesek, de átkutatják az információkat és kiválaszthatnak egy érdekes pontot egy weboldalon. Egyes tervezők csak szövegblokkot helyeznek a weboldalra, és teljesen elhanyagolják a címsorokat, alfejezeteket, golyókat, kulcsszavakat, bekezdéseket stb..

Minden weboldalhoz megfelelő oldalcímet használjon, hogy a felhasználók pontosan tudják, hol vannak. Egyes tervezők még el is felejtik elnevezni a weboldalt.

Összességében a legrosszabb ebben a kategóriában pontatlan, elérhetetlen, jelentéktelen vagy elavult tartalmat fog hozni a webhelyén. A tartalomnak meg kell egyeznie a weboldal általános témájával, és hasznosnak kell lennie. Ha egy oldal építés alatt áll, miért zavarja fel? Ha egy tervezőnek valóban kell, akkor csak ideiglenes, és 3 hét nem tekinthető ideiglenesnek.

Javaslatok: Szervezzen tartalmat a webhelyén HTML és CSS használatával az oldalak tervezése során.

1. Hozzon létre elegendő teret a szöveg és a képek között a margók használatával.
2. Frissítés és következetesség. A frissítés célja nem csak új tartalmak hozzáadása, hanem a múltbeli hibák észlelése és javítása. Jakob Nielsen javasolja, hogy béreljen egy háló “kertész”.

Költségvetés egy webkertész bérbeadására a csapat részeként. Szüksége van valakire, hogy kivágja a gyomokat, és újratelepítse a virágokat, ahogy a honlap megváltozik, de a legtöbb ember inkább az új tartalommal töltené időt, mint a karbantartást. A gyakorlatban a karbantartás olcsó módja a webhely tartalmának növelésének, mivel sok régi oldal megtartja relevanciáját, és az új oldalakhoz kell kapcsolódnia. Természetesen néhány oldal jobb, ha a lejárati dátum után teljesen eltávolítják a szervert - Jakob Nielsen

4. Rossz navigáció.

A webhelyen belüli navigációnak zökkenőmentesnek kell lennie. A felhasználóknak könnyen meg kell találniuk az utat. Bár nincs szabvány a webhelyen belüli navigációra, különösen most, hogy egyre több új webfejlesztési technológia jön létre, elengedhetetlen, hogy megértsük, hogy a navigációnak intuitívnak és következetesnek kell lennie.

Ha a szöveget navigációként használják, akkor tömörnek kell lennie. A vizuális metaforákat nem szabad újra feltalálni. Ha hiperhivatkozásokat használnak, akkor ki kell állniuk a szöveg testéből. A holt kapcsolatoknak semmilyen weboldala sincs. Ez növeli a felhasználói zavart és időt pazarol. És ami még ennél is rosszabb, az a honlapon található link, amely a honlapra hivatkozik.

Javaslatok:

1. Az összes hivatkozás szöveges leírása segítségével hajtsa végre a navigációt. Adjon alt szövegeket a képekhez. Használjon alternatív szövegleírási technikákat a Flash vagy a Javascript linkekhez.
2. Szervezze és strukturálja navigációját a weboldal témájával együtt. A személyes weboldalak megengedhetik magukat, hogy még kreatívabbak legyenek, de hozzáférhetőek, de egy üzleti weboldal nagyobb hatékonyságot és tisztaságot igényel.

Ne feledje, hogy ha a felhasználók kevesebb, mint 3 kattintással nem találják meg, amit akarnak, a legtöbb azonnal elhagyja.

Több: Hatékony weboldal navigáció megvalósítása - Ez a cikk nagyobb betekintést nyújt a webhelyére vonatkozó hatékony navigáció megvalósításához.

5. Az inkonzisztens interfésztervezés.

A túlzott kreativitás éppen ilyen lehet. Túlzott! Egyes tervezők a webhely létrehozásakor egy másik szintre vitték őket, mivel a webhelyen belül minden weblaphoz különböző terveket készítenek. Ez semmiképpen nem zavarja a felhasználót. És teljesen bosszantó. Nem számít, mennyire kiemelkedő és vonzó a weboldal, ha az általános megjelenés és érzés nem következetes, a felhasználók nem tudnak vele kapcsolatban állni, és kevésbé érezhetik magukat. Így, amint megérkeztek, elhagyják.

Javaslatok:

1. Használjon szabványos következetes sablont minden oldalra, amely a webhely főbb részeihez kapcsolódik.
2. A kulcsszó egyszerű. Létrehozni esztétikailag egyszerű terveket és a felhasználók soha nem fognak zavarodni a webhelyeden.

6. Barátságtalan képernyőfelbontás.

Biztos vagyok benne, hogy meglátogattuk azokat a webhelyeket, ahol vízszintesen görgetni kell. Ez a modern webdesign abszolút nincs. Egy jó tervező olyan webhelyeket fog kifejleszteni, amelyek megfelelnek a legtöbb képernyőméretnek. A webhelyek jelenlegi optimalizált elrendezése jelenleg 1024 x 768 pixel.

Javaslatok:Nehéz és szinte lehetetlen megoldani a tervezést, hogy minden felbontásnak megfeleljen, különösen akkor, ha a látogatók most mobiltelefonokról és netbookokról szörföznek, de egy durva elképzelést kaphatunk arról, hogy mik az általánosan használt képernyőfelbontások az alábbi módokon:

• Ellenőrizze statisztikáit - Az olyan analitikai szolgáltatások, mint a Google Analytics, tájékoztatást nyújtanak arról, hogy milyen monitorfelbontást használnak. Ezek hasznos információk, amelyeket a következő átalakítás megkezdése előtt tudnia kell.
• W3 iskolai böngésző statisztika - A W3 iskolák egyértelmű listákat adnak a netizens által használt legnépszerűbb böngészőkről, és a népszerűség szerint rendezik őket. Vannak más érdekes és fontos statisztikák is.

7. Bonyolult regisztrációs űrlapok.

A regisztrációs űrlapok trükkösek. Mennyi információt kér a felhasználótól? Elmúltak azok a napok, amikor a felhasználónak egy zillion részletet kellett megadnia, hogy regisztráljon a webhelyére. Egyes webhelyek a legtöbb regisztrációs mezőt kötelezővé teszik, és érvényesítik a mezőket olyan mértékben, ahol a felhasználó csalódott néhány próbálkozás után. Ne feledje, hogy a felhasználók meglátogatnak egy webhelyet az információk megszerzéséhez. Nem fordítva.

A Someecard egyszerű formája fájdalommentesvé teszi a regisztrációt.

Javaslatok:Hasonlítsa össze a regisztrációs űrlapokat a közösségekben az interneten, és értse meg, hogy milyen alapvető információra van szükség a felhasználó számára a regisztráció során.

Több: 9 A Web Design közös használhatósági hibái - Ez a hozzászólás a Smashing Magazine-ban részletesen megvizsgálja a regisztrációs űrlapokat az egyéb használhatósági hibák között.

8. Képek / animációk gátlástalan használata.

Túl sok kép van egy weboldalon egy hatalmas kikapcsolás. A képek felhasználhatók a felhasználók figyelmének rögzítésére, de lehet zavaró vagy csak súlyosbító. A képeket arra kell használni, hogy adott esetben illusztrálja és vezesse a felhasználót.

Az animációk félelmetesek és erős médiumok. Különösen megfelelő használat esetén. Amikor egy ciklus vagy egy túl sok a weboldalon, akkor a felhasználók idegeihez jut. A felhasználóknak nincs türelme, ideje vagy erőforrásai, így a tervezőknek alternatívákat vagy még jobb megoldásokat kell kínálniuk, az átugró gombot, ha teljes oldal animáció.

Több: Flash: 99% rossz - A Flash megfelelő használata. Már majdnem 10 év óta Jakob Nielsen közzétette ezt a cikket, de még mindig releváns a Flash használhatóság szempontjából, különösen a Megszakítja a webes alapokat darab.

9. Túlterhelt oldalak, több hely.

Túl sok tervező elfelejtette fehér űr és annak fontosságát. Annyira elnyerik a saját kreatív kreativitásukat, hogy elfelejtik, hogy nem róluk szól. Így igyekeznek annyira összecsapni, amennyit csak tudnak egyetlen oldalra. Végeredmény? A forgalmas, zsúfolt és olvashatatlan oldal.

a legteljesebb igények kielégítően kihasználják a teret a tervezésük során.

Íme néhány cikk, amellyel jó ötletet adhatsz a a webterület fontossága:

• Négy fehér tér elrendezés összehasonlítása
• A fehér tér értéke
• Fehér űr

10. Nincs háttérzene, kérem!

A felhasználók nem akarnak hűvös, hatékonyságot keresnek. És igen, 99 százaléka nem érdekli a weboldalán található zenét. Néhány tervező rosszabbá teszi a különböző háttérzene minden weboldalon történő elhelyezését.

Javaslatok:Ne használjon háttérzenét, de ha kell, hozzon létre egy keretet a kód és a felhasználói vezérlők számára. Így a zene folyamatosan folytatódik, ahelyett, hogy minden egyes új oldal betöltődik a webhelyen. A felhasználó pedig bármikor leállhat vagy szünetelhet.

11. Teszt, teszt és teszt.

Ezt nem lehet túlhangsúlyozni. Hányszor voltunk olyan weboldalakon, amelyek csak egy bizonyos böngészőben tekinthetők meg? A webfejlesztőknek ellenőrzési listát kell készíteniük a webhelyek tesztelésével.

• Lehet-e megtekinteni a webhelyet különböző környezetben?
• A tervezési elrendezés minden böngészőben következetes?
• Lehet-e megtekinteni a webhelyet különböző beállításokban, például a Képek kikapcsolása, a JavaScript kikapcsolása stb?

Javaslatok:A W3C eszközöket biztosít a minőségbiztosítás teszteléséhez. Nézze meg W3C minőségbiztosítási eszközkészlet és Weboldal érvényesítése.

Következtetés:

Legyen egyszerű, hülye (K.I.S.S). Ha ez egyszerű, akkor használható. Mindent összevetve, a nagyszerű weboldalak egyszerűek és használhatóak. Csináld a házi feladatot, és könnyű és természetes.

Mi a tapasztalata a webdesign projektekben? Milyen más tippeket és gondolatokat szeretne megosztani a webes tervezési hibákról?

A szerkesztő megjegyzése: Ezt a bejegyzést írta Brujo Owoh Hongkiat.com részére. A Brujo Owoh egy multimédiás rendszer, melyet a Web Design és a 2D Animation specializálódott. Élvezi a fikció olvasását, a társaival való lógást és a Twitteren a tervezési trendek figyelemmel kísérését. Látogassa meg Brujo blogját.