Weboldal design. Hogyan készül egy honlap főoldali látványterve.

A weboldal design készítés egy többlépcsős folyamat, mely a drótvázak, látványtervek mellett a kutatást, tervezést is magában foglalja. Érdemes szem előtt tartani, hogy a weboldal a potenciális ügyfeleknek készül, ezért a designnak is az ő igényeiket kell kielégítenie.

Manapság a legtöbb weboldal design valamilyen sablonra építve készül, nem véletlen tehát, hogy rengeteg a megszólalásig egyforma honlap.

Én most azt fogom bemutatni, hogy milyen lépések mentén készül egy weboldal főoldalának (kezdőlap) designja nem sablonra építve.

A weboldal design előkészületei

Mielőtt egy darab vonalat is megrajzolnánk, előbb kutatást végzünk. Erre azért van szükség mert tudnunk kell, hogy:

• kiknek fog szólni a weboldalad (célközönség)
• milyen termékeket, szolgáltatásokat értékesítesz
• mik a vállalkozásod főbb jellemzői
• mik az aktuális webdesign trendek

Ezekből az információkból kell kiindulni, mert ezek elengedhetetlenek, ha profi webdesignról van szó.

Tudni érdemes, hogy egy weboldal design sosem végleges. A felhasználói visszajelzések és analitikai adatok alapján folyamatosan finomítani, csiszolni kell (UX). Feltéve, ha jó eredményeket akarunk elérni hosszú távon.

Ha az infók megvannak, indulhat a tervezés.

A weboldal főoldalának design tervezése

Először felmérjük, hogy melyek lesznek a weboldal legfontosabb aloldalai, – tipikusan ezek jelennek meg a felső menüsorban is – majd ezek alapján a főoldal szerkezetét úgy alakítjuk ki, hogy minden ilyen aloldal szerepet kapjon benne.

Ne feledjük, hogy a weboldalnak javarészt nem rólunk, vagy a vállalkozásunkról kell szólnia. A célközönségünk hatékony kiszolgálására kell tenni a fő hangsúlyt.

Nézzünk egy élő példát.

A menü elemei Szolgáltatások, Rólunk, Portfólió, Blog, Kapcsolat. Ezekből az alábbiakat fogjuk használni a főoldal felépítéséhez:

• Szolgáltatások
• Rólunk
• Blog
• Portfólió

A rendelkezésre álló információk alapján további figyelemfelkeltő, cselekvésre ösztönző, illetve bizalomkeltő elemeket építünk a főoldal tartalmába. Összességében tehát ezek a blokkok lesznek a weboldal főoldali design részei:

• hajtás feletti rész a legfontosabb marketing üzenettel és egy-két cselekvésre ösztönző gombbal (hero section)
• kiemelt szolgáltatások rövid leírással
• miért mi? + CTA gomb
• rólunk mondták [bizalomkeltés]
• legutóbbi cikkeink [edukáció és termékkiemelés]
• portfólió
• cselekvésre ösztönző blokk (esetleg hírlevél feliratkozással, vagy másodlagos ajánlattal)
• lábléc a leghasznosabb linkekkel

Most, hogy már tudjuk, mi kerüljön a főoldali designba, jöhet a következő lépés.

A weboldal főoldalának drótváza

Az első vonal megrajzolása ebben a szakaszban történik. A második lépésben összeállított tervet vizualizálni kell. A drótváz igazából annyit szemléltet, hogy milyen elemek, hol és hogyan fognak elhelyezkedni a weboldal tartalmában.

Itt még nem használunk sem színeket, sem képeket. Pusztán annyi történik, hogy elkészítjük a weboldal főoldalának vázát a meglévő információk alapján.

Az említett példánkra a drótváz valami ilyesmi lesz:

A drótváz elkészítéséhes Figma-t használtunk.

Drótvázból weboldal design

Miután a drótvázban minden a helyére került, mindenki elfogadta és jóváhagyta, elkezdődhet a weboldal design felépítése.

Természetesen a végleges verzió sosem az, amit legelső körben készítünk. Finomhangolásra mindig van lehetőség, esetenként akár több körben is.

Ebben a lépésben kulcsfontosságú, hogy minden anyag és információ rendelkezésre álljon. Az előkészületi fázisban erről gondoskodtunk, szóval van miből dolgozni.

Nézzük, hogy kel életre a weboldal design.

Nos, ezzel a főoldali látványterv elkészült. Egy letisztult, jól átlátható oldal, amely pontosan azokat az elemeket tartalmazza, melyek segítik a navigációt és cselekvésre ösztönzik a látogatókat.

Gyakran felmerülő kérdések weboldal design kapcsán

Szükséges-e minden weboldalhoz különálló designterv készítése?

Manapság nagyon sok weboldal készül pusztán sablonból, vagy annak ilyen-olyan átalakításával. Egy szép téma, ha megfelelően illeszkedik cégünk arculatához és a célközönségünk is kedveli, akkor jóval olcsóbb választás, mint a külön tervezett, egyedi weboldal design.

Ne feledjük azonban, hogy egy prémium minőségben előállított honlap design, messze felülmúlja egy sablon képességeit.

Mikor elengedhetetlen a különálló weboldal design?

Amikor a sablonos megoldások már nem nyújtanak megfelelő minőséget és szeretnénk, hogy minden szempontból egyedi weboldalunk legyen, akkor érdemes egy profi grafikussal elkészíttetni a designterveket.

Meglepően nagy különbség lesz egy sablon és egy minőségi, egyedi weboldal design közt.

Honnan tudhatod, hogy a te weboldalad designja jó-e?

Az analitikai mutatók elég jó képet tudnak adni arról is, ha egy weboldal design nem megfelelő. Éppen ezért érdemes a Google Analytics-et bekötni.

A látogatók visszajelzései is sokat elmondanak egy honlap kinézetéről és használhatóságáról. Érdemes figyelni ezekre, hiszen a weboldalunk fő célja, hogy kiszolgálja a célközönséget.

Mennyibe kerül a weboldal design?

Azt kell mondanom, hogy ez rengeteg mindentől függ.

Nem mindegy, hány aloldalra szükséges egyedi design terveket készíteni. Az is domináns, hogy milyen mértékben kellenek egyedi grafikai elemek. Van-e igény céges logó tervezésre? Hány módosítási körre van lehetőség?

És persze az sem mindegy, hogy kivel készítteted a designt, mert ugye egy tapasztalt grafikus drágábban dolgozik, mint egy kezdő.

Köszönöm, hogy végigolvastad és remélem találtál pár értékes infót.

Olvasd el ezt a cikkünket is, ha további hasznos információkra lenne szükséged weboldal készítés kapcsán.