„A jó kialakítás boldoggá teszi a felhasználót, a gyártót feketében, az esztétát pedig sértetlenül. '
- Raymond Loewy
Weboldal-elrendezés
Az internetes böngészés és szörfözés napjaink elválaszthatatlan részévé vált. Minden nap n számú webhelyet böngészünk, hogy vásároljon, kereshessen, feltárjon és vásároljon szolgáltatásokat, vagy csak a Google-on. Csak néhány webhelyen állunk le, vagy többször is meg akarjuk látogatni azokat.
Mások nem tűnik túl vonzónak. Nos, egy adott weboldal többszöri meglátogatásának egyik fő oka a weboldal kialakításának elrendezése. Noha ez egy nehéz egyensúly a jól megtervezett és korszerűsített funkcionális weboldal elérése érdekében, megéri az erőfeszítéseket az ügyfelek tapasztalatainak javítása érdekében.
Bebizonyosodott, hogy a weboldal feltételezett megbízhatóságát befolyásoló elem nem a bevitt tartalom, hanem a kialakítás. A tökéletesen megtervezett weboldalnak nem kell sok erőfeszítést tennie más szempontból, hogy a látogatót weboldalán tartsa. Az UX és az UI tervezése együttesen képezi a weblap teljes elrendezését és funkcionalitását.
A tökéletes weboldal-elrendezés elkészítésének mestere a McDonald's. Szó szerint mindent a megfelelő helyre tettek, még a savanyúságot is. Tehát azt is szeretné meghozni, ami olyan jó vagy még jobb, mint a McDonald's.
A weboldal tervezésének 10 legfontosabb lépése
Ma többet fog tudni a weboldal tervezésének 10 legfontosabb lépéséről az alábbiakban:
- Rendeljen professzionálisan kialakított logót, amely megfelelően kapcsolódik a kezdőlaphoz
- Használjon intuitív navigációt
- Kerülje a rendetlenséget, és hagyjon szabad helyet a látogatók számára
- Stratégiai módon használhatja a Színeket és a képeket az érzékeny webre
- Válasszon olyan webes érzékeny betűkészleteket, amelyek az eszközökön és a böngészőkön könnyen olvashatók.
- Minden oldalt céloldalként kell megtervezni
- Mindig hozzon létre érzékeny kialakítást, amely minden eszközhöz adaptív lehet
- Használjon HTML5-et Flash helyett
- A Küldés vagy a Küldés gomboknak vonzónak kell lenniük
- Ne felejtsd el kipróbálni a tervedet
Az élet beszélgető. A weboldal kialakításának ugyanúgy kell lennie. Az interneten valakivel beszélget, akivel valószínűleg soha nem találkozott, ezért fontos, hogy világos és pontos legyen. Így a weboldal-tervezés és a tartalomszervezés jól felépített struktúrája együtt jár a jó beszélgetéssel.
- CHIKEZIE EJIASI
(Egy tweet a Twittertől)
-
Rendeljen professzionálisan kialakított logót, amely megfelelően kapcsolódik a kezdőlaphoz
A webhelytervező társaság elsőként azonosítja a logóját. A professzionálisan kialakított logóval rendelkező weboldal inkább vonzó az ügyfelek számára, mint egy feltűnő logó. A logó formálja a márka identitását egy cég vagy egy weboldal számára.
Mindig érdemes figyelmeztetnie arra, hogy nagy felbontású weblaptervezési képeket használjon a logóhoz. a weboldal kialakításának képeket mindig a weboldal bal felső sarkában kell feltüntetni. Ne feledje továbbá azt a régi jó hüvelykujjszabályt is, amely szerint a webhely összes logóját össze kell kapcsolnia a kezdőoldallal, hogy az ügyfelek könnyen meglátogathassák a weboldal tervezésével kapcsolatos navigációt.
-
Weboldal tervezés navigáció
Gondolkozott már azon azon azon, hogy miért ugorsz el oly sok weboldalról, és csak egyre vagy kettőre tartasz ragaszkodni? Ennek oka az, hogy az ügyfelek nem bánják a komplex weboldal kitalálását. Ehelyett kilépnek az oldalról, és tovább lépnek a következőre.
Ez az oka annak, hogy az intuitív navigáció olyan fontos. Az elsődleges weboldal-navigációs beállításokat általában a vízszintes menüsorban kell elhelyezni a tetején, a másodlagos navigációs sávok alatt vagy az oldal bal szélén.
Ügyeljen arra is, hogy a linkek csak olyan helyekre kerüljenek, amelyek nem vonják el az ügyfelek figyelmét a cselekvésre ösztönző felhívástól vagy a legfontosabb információtól.
-
Kerülje a rendetlenséget, és adjon légzési teret az ügyfelek számára
A túl sok grafika használata vagy az oldalak túlterhelése hajlamosak a rendetlenségek kialakulására. A weboldal kialakításának képei a fontos megértési közegek, de a képek vizuális túlterhelése megállítja az információ feldolgozását az agyban.
Az ügyfelek összezavaródnak, ha túl sok weboldal-tervezési elrendezéssel szembesülnek. A céloldalak rendetlenségének minimalizálása érdekében korlátozza a fejlécben és a láblécben található hivatkozások és lehetőségek számát. Az oldalak korszerűsítésének másik módja az, hogy a bekezdések rövidek maradnak.
A rövid a legfeljebb öt-hat sort jelent, mivel az ügyfelek hajlamosak elveszíteni érdeklődését egy nagyon hosszú szöveg megtekintése iránt. Van egy másik hüvelykujjszabály a jó weboldal-elrendezéshez, azaz hogy némi légzési teret biztosítson az ügyfelek számára.
Ezt a helyet úgy lehet létrehozni, hogy elegendő hely van a bekezdések és a weboldal-tervezési képek között, hogy a néző lélegezzen, és felvegye az Ön webhelyének több funkcióját és ajánlatát. Mivel az érzékeny web minden nap versenyképesebbé válik, kevesebbnek számítanak most.
A fehér tér ellenőrzött felhasználása az elrendezés során megtartja a felhasználók figyelmét a tartalomra, és növeli a felhasználói élményt. Az ellenőrzött felhasználói adatfolyam növeli a weboldal visszatérését.
-
Használja a színeket és képeket stratégiailag az érzékeny webhez
Egy modern, rendetlenség és elegáns weboldal bemutatásához próbáljon meg többnyire semleges színpalettát használni. A heves verseny miatt a címsorok és a kulcsfontosságú grafikák kis színes vonalvezetésével a látogatók megtapasztalhatják weboldaladat, és odafigyelhetnek a legfontosabb részletekre. Mindig használjon olyan színpalettát, amely kiegészíti a logóját, és összhangban kell lennie más marketing biztosítékokkal.
Próbáljon befektetni a fényképezésbe vagy a professzionális stock képek vásárlásába, mert a weboldal látogatói egy szempillantás alatt szippantják az általános képeket. A weboldal kialakításának képei általános benyomást keltenek vállalkozásáról.
A professzionális stock képek vagy a jó fényképezés felhívja a figyelmet a tartalomra, és azonnal érzelmi kapcsolatot teremt. Csak egy példa idézésére - ha fel szeretné hívni a látogató figyelmét egy adott információra vagy cselekvésre ösztönözni, akkor használjon egy emberi arcot, aki az adott irányba néz, vagy egy ujjal mutat rá.
Csak azért, mert az ember hajlamos arra, hogy ugyanabba az irányba nézzen, ahova a másik ember néz. Mind a színeket, mind a weboldal-kialakítás képeit úgy kell megválasztani, hogy azok illeszkedjenek az összes érzékeny webhöz - mobil, táblagépek, laptop stb.
Ajánlott tanfolyamok
- HTML és HTML5 program
- Szoftvertesztelés tanúsító képzése
- Online tanfolyam a Drupal 7-en
- Drupal 7 programozási tanfolyamok
-
Válassza a Webra reagáló betűkészleteket
Az internet reagálásával reagálni kell arra, hogy minden böngészőhöz megfelelő betűtípust válasszon, legyen az laptop, táblagép vagy mobiltelefon.
Ha nagy méretű betűtípust választ, akkor valószínű, hogy jól olvasnak laptopon, de nem fogják jól megjeleníteni azt, ha egy mobiltelefon elveszíti érzetét és megjelenését. Mindig válasszon olyan betűtípust, amely könnyen olvasható, legalább 11pt mérettel.
Webes betűkészletek kiválasztásakor ne használjon többet mint 2 betűcsaládot a gyors betöltési idő biztosítása érdekében. Rögzített szélességű kialakításhoz használjon olyan betűtípust, amely sorban legfeljebb 15-20 szót enged, és folyékony kivitelben olyan betűtípust használjon, amely lehetővé teszi 15-20 szót 1000 képpont szélességben.
-
Minden oldalt céloldalként kell megtervezni
A webdesigner általában úgy tervezi meg webhelyét, hogy feltételezi, hogy egy látogató belép a honlapon, majd továbblép a kezdőoldalra. De a tény kicsit más. A látogatók többsége a legtöbb weboldalon a Kezdőlapon kívül helyezkedik el.
Tehát a legfontosabb ötlet az, hogy az összes fő információt a nyitóoldalakon és a weboldal kialakításának elrendezésén oly módon tárolják, hogy a látogatónak ne kelljen fontos információkat keresnie.
-
Mindig hozzon létre adaptív, minden eszközre adaptív kialakítást
Ebben a forgalmas világban, amikor nincs ideje még a megfelelő étkezésre, miért kell különálló oldalt terveznie minden eszköz számára. Takarítson meg időt és energiát azáltal, hogy megtervezi az érzékeny webhelyet, amely a használt eszköznek megfelelően alkalmazkodik a böngésző méretéhez.
Egy érzékeny webhely általában hosszú ideig tartja a látogató figyelmét, növelve ezzel az átváltási arányok valószínűségét.
-
Használjon HTML5-et Flash helyett
A Flash elavulttá válik, és véget ér az Apple és az Adobe közötti folyamatban lévő vitával. Szóval, tervezők! Gyere ki a szalaghirdetésből, és próbálj ki több webes és felhasználóbarát lehetőséget.
A HTML5 egyre népszerűbb a keresőmotor számára barátságos szövegével és egyszerű működésével a mobil operációs rendszerekben, plug-in nélkül, a Flash-szel ellentétben.
-
A Küldés vagy a Küldés gomboknak vonzónak kell lenniük
A webes űrlap alján található 'Elküldés' vagy 'Küldés' gomb a weboldal műveleti elemének legfontosabb hívása. De ez is a legrosszabb rész, ezért a tervezőknek el kell készíteniük az űrlap benyújtásának gombjait, így a kedves látogatók nem tudnak segíteni maguknak, ha rákattintanak.
Csak rá kell kattintaniuk. Ezek a cselekvésre ösztönző gombok sok szempontból érdekesek lehetnek, például amikor a látogató az egérrel mozgatja a cselekvésre ösztönző gombot, akkor annak meg kell változtatnia a színét, a színátmenetet, az átlátszóságot vagy a betűkészlet kezelését, hogy másodpercek töredékében felhívja a figyelmét.
De ügyeljen arra is, hogy bármi túlzás túl rossz. Mindaddig el kell csökkenteni, amíg vonzónak tűnik, különben fordított hatással lehet.
-
Ne felejtsd el kipróbálni a dizájnját
A tervezési döntés csak egy hipotézis. Te vagy a legjobb ember annak eldöntésére, hogy mi néz ki jól az Ön weboldalán. A weboldal optimalizálása a cselekvésre ösztönző gombok eltérő elhelyezésének kipróbálásával vagy különböző színárnyalatok használatával nagy hatással lehet a weboldalra. Felhasználói tesztelés. Az A / B tesztelés és elemzés segíthet a weboldal improvizálásában.
És a valódi improvizáció emberekből származik. Vegyék visszajelzéseiket és hajtsák végre mindaddig, amíg jól néz ki. Csak arra, hogy idézzünk egy példát a formatervezés tesztelésének fontosságára - a Microsoft egyszer egy további kék árnyalat tesztelésével és bevezetésével további 80 millió dolláros bevételt szerzett. Tehát soha nem tudhatod, mikor tervezhet hatalmas profitot.
Ezek a kis kérdések ennyire jelentéktelennek és nyilvánvalónak tűnhetnek, de gyakran visszatükröződnek a weboldal élő verzióján. Addigra a vállalkozás a potenciális jövedelmének csak kis százalékát veszítette el kilátásaitól.
A mai napon elérhető számos platformon nem nagy feladat a „WOW” pillanatok előállítása a weboldal UX és UI tervei alapján. Csak kevés elkötelezett erőfeszítés és egy kis kreativitás igényel, hogy az összes látogató WOW-t mondjon, miután a weboldalára került.
Tehát a weboldal tervezésének tökéletes módja a Gondolkodás. Rethink. Tanul. Tanulj újra. Soha ne használja ugyanazt a koncepciót. Ismerje meg vevői igényeit, majd… .indítsa el a tervezést.
A tervezési gyakorlat megváltoztatása óriási hatással lehet az elkötelezettségére és az átváltási arányokra, ha olyan intuitív felhasználói élményt hoz létre, amely felfedi professzionalitását, miközben látványos módon eljuttatja azt, amit az emberek akarnak és igényelnek.
Kapcsolódó cikkek:-
Ez egy útmutató a Weboldal tervezés elrendezéséhez. Itt megvitattuk a weboldal tervezésének 10 legfontosabb lépését. Megtekintheti a következő cikkeket is:
- 10 hatékony módszer az Adobe InDesign felhasználókhoz
- 8 Hasznos útmutató a HTML5 vs Flash verziójához
- 5 hatékony módszer a weboldal szerves forgalmának növelésére
- Hogyan hozhatunk létre tiszta webhely-elrendezést a Photoshopban
- A webhelyen található néhány hiba felsorolása, és hogyan lehet őket kijavítani
- 5 Webhely-beállítási hibák, amelyekről tisztában kell lennie
- Mit érdemel Drupal vagy Joomla?
- Drupal 7 vs Drupal