Egy gyakran id\u00e9zett vizsg\u00e1lat szerint az emberek kevesebb mint 2 tizedm\u00e1sodperc alatt k\u00e9pesek v\u00e9lem\u00e9nyt kialak\u00edtani a weboldaladr\u00f3l. A vizu\u00e1lis kontextus seg\u00edt nekik meg\u00e9rteni, hogy mir\u0151l sz\u00f3l a weboldal, kialak\u00edtani egy benyom\u00e1st, hogy ez\u00e1ltal tov\u00e1bb maradjanak az oldalon. A l\u00e1tv\u00e1nyelemek er\u0151teljes hat\u00e1suk r\u00e9v\u00e9n sokkal gyorsabban k\u00e9pesek \u00e1tadni egy \u00fczenetet, mint a sz\u00f6veges tartalmak.<\/strong><\/p>\n

\u00cdrott sz\u00f6vegek eset\u00e9ben a kontextus hi\u00e1nya neh\u00e9zz\u00e9 teszi az olvas\u00f3k sz\u00e1m\u00e1ra, hogy meg\u00e9rts\u00e9k, mir\u0151l akarja meggy\u0151zni \u0151ket egy sz\u00f6veg \u00edr\u00f3ja. Ez a webdesignban is gyakran megt\u00f6rt\u00e9nik. Ez\u00e9rt van sz\u00fcks\u00e9ge a webodalaknak arra, hogy megteremtsenek egy vizu\u00e1lis kontextust, egy \u00f6sszef\u00fcgg\u00e9st, mely kommunik\u00e1lni tudja az adott c\u00e9g h\u00e1tt\u00e9rtud\u00e1s\u00e1t \u00e9s t\u00f6rt\u00e9net\u00e9t.<\/p>\n

Mi is az a vizu\u00e1lis kontextus?<\/h2>\n

A vizu\u00e1lis kontextus kifejez\u00e9s a tartalom vizu\u00e1lis megjelen\u00e9s\u00e9re utal, mely jav\u00edtja weboldal \u00fczenet\u00e9nek befogadhat\u00f3s\u00e1g\u00e1t. Teh\u00e1t p\u00e9ld\u00e1ul egy \u00e9p\u00edt\u00e9sz weboldala eset\u00e9ben a weboldal tartalmaz egy portfoli\u00f3t a sikeres projektekr\u0151l. Itt teljes m\u00e9rt\u00e9kben a l\u00e1togat\u00f3 d\u00f6nt\u00e9se, hogy a portfoli\u00f3t v\u00e9gign\u00e9zi-e vagy sem. Ugyanakkor az egyes elemek megjelen\u00e9se \u00e1ltal megteremtett vizu\u00e1lis kontextus – melynek r\u00e9sz\u00e9t k\u00e9pezik az illusztr\u00e1ci\u00f3k, a sz\u00ednek, a whitspace – mindenk\u00e9ppen inform\u00e1ci\u00f3val l\u00e1tja el a felhaszn\u00e1l\u00f3t az \u00e9p\u00edt\u00e9sz tud\u00e1s\u00e1r\u00f3l, tapasztalat\u00e1r\u00f3l.<\/p>\n

Egy m\u00e1sik p\u00e9lda egy rep\u00fcl\u0151g\u00e9peket tervez\u0151 c\u00e9g, melynek weboldal\u00e1n megjelen\u0151 rep\u00fcl\u0151g\u00e9pekr\u0151l k\u00e9sz\u00fclt fot\u00f3k egyb\u0151l vil\u00e1goss\u00e1 teszik szerep\u00e9t a rep\u00fcl\u0151g\u00e9p-iparban. A l\u00e1togat\u00f3nak ehhez nem is kell elolvasnia a c\u00edmsort, csak r\u00e1pillantania a k\u00e9pekre. De k\u00e9pzeld el ugyanezt a weboldalt a rep\u00fcl\u0151g\u00e9pekr\u0151l k\u00e9sz\u00fclt k\u00e9pek n\u00e9lk\u00fcl! J\u00f3val nehezebb lenne megfejteni, mir\u0151l is van sz\u00f3. Az adott c\u00e9g\u00a0m\u00e9rn\u00f6ki megold\u00e1sok sz\u00e9les sk\u00e1l\u00e1j\u00e1t k\u00edn\u00e1lja, de els\u0151sorban a rep\u00fcl\u0151g\u00e9p-iparban akt\u00edvak, melyet azt\u00e1n vil\u00e1gosan meg is mutatnak a weboldalukon.<\/p>\n

www.mercaerospace.co.uk<\/p><\/div>\n

Mi\u00e9rt fontos a vizu\u00e1lis kontextus?<\/h2>\n

Az els\u0151 benyom\u00e1s miatt<\/h3>\n

Mint a cikk elej\u00e9n m\u00e1r jelezt\u00fck, a felhaszn\u00e1l\u00f3k a pillanat t\u00f6red\u00e9ke alatt k\u00e9pesek v\u00e9lem\u00e9nyt form\u00e1lni a weboldaladr\u00f3l. A m\u00e1rk\u00e1z\u00e1s, a k\u00e9pek, az ikonok alak\u00edtj\u00e1k ki ezt az els\u0151 benyom\u00e1st ilyen r\u00f6vid id\u0151 alatt. Ahhoz, hogy az emberek tov\u00e1bb maradjanak a weboldaladon, a vizu\u00e1lis kontextus r\u00e9v\u00e9n kell inform\u00e1lnod \u0151ket, hogy mir\u0151l sz\u00f3 a weboldalad.<\/p>\n

Seg\u00edti az inform\u00e1ci\u00f3k\u00f6zl\u00e9st<\/h3>\n

A weboldalak vizu\u00e1lis elemeinek van egy \u201c\u00e9rz\u00e9ki\u201d vonzereje a sz\u00f6veges kontextushoz k\u00e9pest. A felhaszn\u00e1l\u00f3k nagy val\u00f3sz\u00edn\u0171s\u00e9ggel \u00e9szreveszik azokat a kieg\u00e9sz\u00edt\u0151 k\u00e9peket, melyek a kontextus eg\u00e9sz\u00e9t t\u00e1mogatj\u00e1k. Sokkal ink\u00e1bb, mint hogy elolvasn\u00e1k az ugyanezen c\u00e9lb\u00f3l l\u00e9trehozott mondatokat vagy bekezd\u00e9seket. B\u00e1rmilyen j\u00f3 vagy is a t\u00f6rt\u00e9netmes\u00e9l\u00e9sben, a felhaszn\u00e1l\u00f3k els\u0151 \u00e9rzelmi v\u00e1lasz\u00e1t a vizu\u00e1lis elemek fogj\u00e1k meghat\u00e1rozni, melyek az inform\u00e1ci\u00f3k k\u00f6zl\u00e9s\u00e9ben is seg\u00edtenek.<\/p>\n

Jav\u00edtja a meg\u00e9rt\u00e9st<\/h3>\n

A vizu\u00e1lis kontextus teszi \u00e9l\u0151v\u00e9 a t\u00f6rt\u00e9netet. Ez\u00e1ltal k\u00e9pes a felhaszn\u00e1l\u00f3 meg\u00e9rteni a c\u00e9get \u00e9s annak m\u0171k\u00f6d\u00e9s\u00e9t. Az vizu\u00e1lis \u00f6sszef\u00fcgg\u00e9sek r\u00e9v\u00e9n ismeri meg a f\u0151 mondanival\u00f3t, majd ez alapj\u00e1n keresi a tov\u00e1bbi lehet\u0151s\u00e9geket, term\u00e9keket \u00e9s el\u00e9rhet\u0151 szolg\u00e1ltat\u00e1sokat. De ha egy olyan felhaszn\u00e1l\u00f3i fel\u00fcletet alkalmazol, mely nem k\u00f6veti a webdesign-konvenci\u00f3kat, akkor a vizu\u00e1lis kontextus fog seg\u00edteni a felhaszn\u00e1l\u00f3k \u00e9s term\u00e9keid k\u00f6z\u00f6tti kapcsolat megteremt\u00e9s\u00e9ben.<\/p>\n

Kialak\u00edtja az \u00e9rzelmi k\u00f6tel\u00e9keket<\/h3>\n

A vizu\u00e1lis \u00f6sszef\u00fcgg\u00e9s seg\u00edt a c\u00e9lk\u00f6z\u00f6ns\u00e9ged \u00e9rzelmeinek kiv\u00e1lt\u00e1s\u00e1ban is. Ezen az oldalon p\u00e9ld\u00e1ul sok emberi arc szerepel, aminek a megfelel\u0151 kontextus megteremt\u00e9se \u00e9s a l\u00e1togat\u00f3kkal val\u00f3 kapcsolat kialak\u00edt\u00e1sa az oka. A meleg, puha sz\u00ednek teszik a weboldalt bar\u00e1ts\u00e1goss\u00e1, a mosolyok a pozit\u00edv hozz\u00e1\u00e1ll\u00e1st \u00e9s a k\u00f6z\u00f6ss\u00e9gi \u00e9rz\u00e9st fejezik ki. A l\u00e1togat\u00f3k pillanatok alatt \u00e9rzelmi k\u00f6t\u0151d\u00e9st alak\u00edtanak ki egy ilyen oldallal.<\/p>\n

\u00c9s ugyanez igaz a term\u00e9kek eset\u00e9ben is: a felhaszn\u00e1l\u00f3k ugyanilyen k\u00f6nnyen tudnak kialak\u00edtani kapcsolatot k\u00fcl\u00f6nf\u00e9le term\u00e9kekkel vagy szolg\u00e1ltat\u00e1sokkal. Meg kell teh\u00e1t teremtened azokat a vizu\u00e1lis elemeket, melyek k\u00e9pesek meg\u00e9rinteni a c\u00e9lk\u00f6z\u00f6ns\u00e9g \u00e9rz\u00e9seit.<\/p>\n

www.lendwithcare.org<\/p><\/div>\n

Mik\u00e9nt teremtheted meg a vizu\u00e1lis kontextust?<\/h2>\n

A vizu\u00e1lis kontextus kialak\u00edt\u00e1s\u00e1hoz a felhaszn\u00e1l\u00f3k meg\u00e9rt\u00e9s\u00e9re van sz\u00fcks\u00e9ged. A felhaszn\u00e1l\u00f3 perspekt\u00edv\u00e1ja f\u00fcgg a kor\u00e1t\u00f3l, a nem\u00e9t\u0151l, nemzetis\u00e9g\u00e9t\u0151l. Teh\u00e1t p\u00e9ld\u00e1ul feh\u00e9r sz\u00edneket haszn\u00e1l\u00f3i k\u00e9pek a boldogs\u00e1got jelentik egy bizonyos k\u00f6z\u00f6ss\u00e9gnek, m\u00edg egy m\u00e1sik sz\u00e1m\u00e1ra a szomor\u00fas\u00e1g jele lehet. Annak \u00e9rdek\u00e9ben, hogy a vizu\u00e1lis elemek j\u00f3l illeszkedjenek a c\u00e9gedhez, meg kell \u00e9rtened az embereket is, akiket szeretn\u00e9l el\u00e9rni, mert tudod kell, hogy milyen vizu\u00e1lis elemek mik\u00e9nt \u00e9rtelmeznek.<\/p>\n

A vizu\u00e1lis kontextus kialak\u00edt\u00e1s\u00e1nak n\u00e9h\u00e1ny \u00f6sszetev\u0151je:<\/p>\n

\n
• K\u00e9pek melyek kapcsol\u00f3dnak a c\u00e9ged term\u00e9szet\u00e9hez.<\/li>\n
• Infografik\u00e1k, melyek \u00f6sszefoglalj\u00e1k egy adott sz\u00f6veg tartalm\u00e1t k\u00f6nnyen \u00e1ttekinthet\u0151 m\u00f3don.<\/li>\n
• Nyilak, vonalak \u00e9s egy\u00e9b jelek, melyek kiemelik a sz\u00e1mokat, vagy ir\u00e1nyt mutatnak a felhaszn\u00e1l\u00f3nak.<\/li>\n
• Szavak \u00e9s mondatok kiv\u00e1laszt\u00e1sa, kiemel\u00e9se a vizu\u00e1lis kontextus gazdag\u00edt\u00e1s\u00e1ra.<\/li>\n
• T\u00f6rt\u00e9netmes\u00e9l\u00e9s kreat\u00edv grafik\u00e1k seg\u00edts\u00e9g\u00e9vel.<\/li>\n
• Figyelemfelkelt\u0151 ikonok a navig\u00e1ci\u00f3hoz.<\/li>\n<\/ul>\n

  V\u00e9g\u00fcl<\/h2>\n

  A vizu\u00e1lis kontextus teh\u00e1t seg\u00edti a felhaszn\u00e1l\u00f3kat, k\u00fcl\u00f6n\u00f6sen azokat, akik el\u0151sz\u00f6r l\u00e1togatnak el a weboldaladra. A vizu\u00e1lis kontextus r\u00e9v\u00e9n tudod gyorsan \u00e1tadni sz\u00e1mukra a weboldal jellemz\u0151it \u00e9s \u00e9rt\u00e9keit. Ez\u00e9rt fontos a k\u00e9pek, sz\u00ednek, vizu\u00e1lisan megjelen\u0151 adatok, infografik\u00e1k, vide\u00f3k, anim\u00e1ci\u00f3k, ikonoknak \u00e9s minden egy\u00e9b vizu\u00e1lis eszk\u00f6z megfelel\u0151 kombin\u00e1ci\u00f3j\u00e1nak kialak\u00edt\u00e1sa. Ezek kiv\u00e1logat\u00e1s\u00e1val \u00e9s \u00f6sszehangol\u00e1s\u00e1val teremtheted meg a mindenn\u00e9l fontosabb vizu\u00e1lis kontextust.<\/p>\n

  (A sz\u00f6veg ezen cikk<\/a> alapj\u00e1n k\u00e9sz\u00fclt.)<\/em>
  \n