A weboldal design elkészítése – a hiedelmekkel ellentétben – nem azzal kezdődik, hogy a grafikus leül a géphez és rittyent valami szépet. A főoldali grafika megtervezése különösen nagy odafigyelést igényel.

Teljesen mások az elvárások a weboldal kinézetét tekintve, mint pár évvel ezelőtt voltak.

Hiába szép egy honlap, ha nem tud eladni, nem hoz minőségi ügyfeleket cégednek. Rengeteg esetben, egy letisztult, megfelelően felépített weboldal, sokkal jobban teljesít, mint az, amelyiknél a hangsúlyt a csicsára helyezték.

Megmutatom, hogy milyen lépésekből áll weboldalad főoldali látványtervének megtervezése és elkészítése.

A weboldal design készítés első lépése a kutatás

Mielőtt egy darab vonalat is megrajzolnánk, előtte tudnunk kell, hogy:

  • mi a weboldalad célja
  • milyen szolgáltatást/terméket szeretnél értékesíteni
  • milyen funkciókat szeretnél a weboldalra
  • kik a célközönséged
  • vannak-e már referenciái, értékelései cégednek

A tervezés során, figyelembe kell venni azt a tényt is, hogy a honlapodra érkező látogatók vásárlási potenciálja merőben eltérő lehet.

Vannak, akik épp információgyűjtő módban böngészik az oldalad. Ők még csak keresgélik a megfelelő megoldást a problémájukra. Nekik valószínűleg csak később fogsz tudni eladni bármit is.

Aztán ott vannak azok, akik kifejezett vásárlási szándékkal érkeznek, de még keresgélik a számukra legjobb ajánlatot. Közülük egyesek a legolcsóbbat, mások a legmegbízhatóbbat keresik.

A lényeg, hogy a weboldalad főoldalán landoló látogatók azt érezzék, megtalálták, amit kerestek és interakcióba lépjenek.

A második lépés a tervezés

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.

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

A menü elemei Főoldal, Rólunk, Szolgáltatások, Blog, Kapcsolat, Portfólió. 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:

  • Felső banner, a cég profiljába illő képpel, a legfontosabb marketing üzenettel és egy cselekvésre ösztönző gombbal
  • Szolgáltatások
  • Miért mi? + CTA gomb
  • Rólunk mondták
  • Legutóbbi cikkeink
  • Portfólió
  • Cselekvésre ösztönző blokk (esetleg hírlevél feliratkozással, vagy másodlagos ajánlattal)
  • Footer a leghasznosabb linkekkel

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

Weboldal projekt felmérés

Weboldal tervezés stratégiával


Többet adunk, mint gondolnád és mindezt a lehető legjobb áron.

ERŐS WEBOLDALT SZERETNÉK

A weboldal főoldalának drótváza (wireframe)

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, csak annyi történik, hogy elkészítjük a weboldal főoldalának vázát.

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

Ingyen weboldal design wireframe

A drotváz és a mockup elkészítéséhes is Figma-t használunk.

Drótvázból weboldal design

Miután a drótvázban minden a helyére került, mindenki elfogadta és jóváhagyta, elkészítjük a főoldali designt.

Azért is nagyon fontosak az előzetes konzultációk a weboldalad kapcsán, mert ebben a fázisban már azokat az elemeket (képek, betűtípus, logó, stb.) is használjuk, melyeket rendelkezésünkre bocsátottál előzőleg.

Természetesen a végleges weboldal design sosem az, ami a legelső körben elkészül, ezért is van lehetőség többkörös módosításra.

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

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.

A Te új weboldalad látványtervét is ugyanezen folyamat mentén készítjük!

Weboldal projekt felmérés

Weboldal tervezés stratégiával


Többet adunk, mint gondolnád és mindezt a lehető legjobb áron.

ERŐS WEBOLDALT SZERETNÉK

Tetszett a cikk? Kösz, ha megosztod:

Megosztás

További weboldal készítés cikkek

«

»