Egy weboldalt meg kell tervezni. Úgy mint egy házat. Ha ezt nem teszed meg, akkor létrejön valami, ami ugyan kinéz valahogy, de egyáltalán nem biztos, hogy tesz bármi érdemlegeset számodra vagy épp a látogatód számára.
E cikk tartalma:
1. pillér: A cél vezérelje a tervet

Ha egy házat építtetsz, először is meg kell vizsgálnod, milyen célt kell, hogy szolgáljon, kinek az igényeit kell kielégítse. Egy idős házaspárét? Felejtsd el a emeletet. Egy nagyobbacska családét? Ekkor jó, ha van benne két fürdőszoba és sok-sok hálószoba
Ugyanígy egy weboldalnál is az első eldöntendő kérdés az, hogy ki számára – azaz milyen célcsoportnak – készüljön a weboldal és mit szeretnénk, hogy ők a weboldalon megtegyenek.
Például, ha azt mondom, hogy nyugdíjasoknak akarok eladni számítógép-kezelési kurzust, akkor valószínűleg olyan oldalt kell terveznem, amely:
- Rém egyszerű. Lehetőleg ne kelljen benne sok felé kattintgatni, legjobb lesz, ha az egész tartalom egy oldalon jelenik meg.
- Kerüli az apró betűs részeket. A célcsoportom sok tagja ugyanis már nem lát tökéletesen. Ha kis betűkkel írok, akkor egyszerűen nem tudja elolvasni az ajánlatomat – legyen az bármily kedvező is számára.
- A hagyományos fizetési módokra hagyatkozik. Ne akarjunk PayPal-t kezeltetni egy 70 éves idős úrral, mert nem biztos, hogy tudni fogja* – mi pedig így elesünk egy rakás jelentkezőtől. Inkább ajánljunk fel készpénzes és pl. kártyás fizetést.
- Rendkívül intuitív, designjában kontrasztos. Szintén a rosszabb látás miatt, valamint azért, mert olyan embereknek szól, akik nincsenek túl mélyen benne a honlapok használatában.
* Ellenben ez lehet maga a tanfolyam egyik eleme, hogy ennek a kezelését megtanítsuk neki 🙂
A cél, amelyet a weboldalunknak szolgálnia kell, ez alapján egy egyetlen mondatban összefoglalható állítás kell, hogy legyen – amely nagyon egyszerűen arról szól, hogy kinek mit kell megtennie a honlapon.
Például:
- Az első gyermeküket váró kismamák regisztráljanak
- Egyéni vállalkozók iratkozzanak fel a levelezőlistánkra
- Egyedülálló nők csatlakozzanak a Facebook csoportunkhoz
- Focirajongók vegyék meg a könyvet, stb.
Ha ez megvan, sokkal könnyebben tudjuk majd kialakítani a weboldalunk szerkezetét, könnyebben tudjuk eldönteni, hogy milyen tartalom kerüljön fel rá és mi az, aminek nem is olyan fontos, hogy ott legyen az oldalon. Ez a hatékony weboldal tervezés első lépése.
2. pillér: Az oldal szerkezete
Miután megvan az, hogy hová szeretnénk eljuttatni a látogatónkat, el kell készítenünk a weboldal szerkezetét. Ez lesz a tulajdonképpeni tervrajzunk. Az, amely alapján a designer ki tudja dolgozni a végső kinézetet, a szövegíró meg tudja írni a tartalmakat, a programozó pedig (a felhasználói útvonalak ismeretével együtt) ki tudja alakítani a technikailag legmegfelelőbb megoldásokat.
Az oldal szerkezetét legcélszerűbb valamilyen wireframing (drótváz) szoftverrel elkészítenünk. Egy ilyen wireframe kb. így néz ki:

Ugye mennyire hasonlít ez egy papír alapon felvázolt oldalra? A hasonlóság nem meglepő, hiszen az ilyen tervek – amíg nem léteztek a megfelelő célszoftverek – papíron készültek.
Viszont amióta vannak már olyan programok, mint pl. a Balsamiq, azóta az életünk könnyebbé vált, hiszen az olyan botkezű rajzolók, mint én magam is esztétikus honlapterveket tudnak készíteni. Másrészt pedig egy elektronikus vázlat mindig sokkal könnyebben módosítható, mint egy papíron rajzolt verzió. A sokszorosításról nem is beszélve!
Amikor ezt a szerkezetet készítjük, mindenképp figyeljünk arra oda, hogy nem minden látogatónk jártas abban a témában, amelyről mi szólunk. Így érdemes először a teljesen laikusokhoz szólnunk, akiket lépésről lépésre kell fokozatosan érdeklődővé, majd vásárlóvá változtatnunk.
3. pillér: Mérhető felhasználói útvonalak
Miután megvagyunk a vázlatokkal, írjuk le, hogy az oldalunkon / oldalainkon milyen útvonalat kellene a felhasználóinknak bejárniuk. Ez – bár egyértelműnek tűnhet számunkra – a látogatónk számára nem biztos, hogy az.
Ezt könnyen letesztelhetjük, ha a célcsoportunk egy-egy tagját odaültetjük a vázlatunk (vagy mondjuk egy abból készült kattintható prototípus) elé, és megkérjük, hogy nézzen rá az oldalra. Aztán nézzük végig, mit csinálna az oldalon. Egyáltalán nem biztos, hogy azt az útvonalat járja be, amit mi elvárunk tőle.
Ezért érdemes előre betervezni minden komolyabb eshetőséget:
- Mi van, ha a felhasználó itt nem ide, hanem amoda kattint?
- Mi van, ha végigolvassa az oldalt, de nem teljesíti a célt?
- Mi van, ha nem találja a lényeget?
- Mi van, ha el akarja hagyni az oldalt idő előtt?
Bármilyen elakadási / lemorzsolódási eshetőségre fel kell készülnünk és készíteni egy forgatókönyvet rá, hogy az adott esetben hogyan fogjuk a felhasználónkat visszaterelgetni a helyes útra a weboldal célja felé.

Hosszú távon pedig úgy tudjuk kideríteni, hogy hol vannak ezek az elakadási pontok, ha mindent mérünk… De erről majd egy későbbi cikkben írok.