2013. február 5.

Szerző:
B. Szabó Edina

Látványos webdizájn – a bemutatás művészete

Csaknem húsz évvel ezelőtt, 1995 körül, amikor a dupla egérkattintást sokan még csak hobbiból tanultuk, felröppent egy nyílt, publikus háló­zati rendszer használatának üzleti lehetősége. Az internet és az azon tárolt oldalak még csupán távoli, misztikus eszköznek tűntek, sőt még eszköznek sem, inkább egy különleges, kevesek által értett és uralt világ csodájának.


Ahogy emlékszem, nem is volt akkora a lelkesedés, amikor egy új vállalkozás honlapjának elkészítéséről volt szó. Az ikonok kézzel rajzolt ábrákként szerepeltek – érdekes, hogy a kézi rajz a weben ismét egyre népszerűbbé válik –, a menüsor egy-egy statikus oldaltartalommal már több volt, mint elegendő, és az egyéb megjelenített linkek mennyisége alapvetően meghatározta az oldalak minősítését, vagyis használati értékét.
Az egyetemi vagy hivatali honlapok mellett nem volt egyszerű az üzleti oldalak bevezetése, a nyomtatott és elektronikus médiában szereplő reklámok kiválóan működtek, azaz megfelelő felületet biztosítottak a cégek számára. PR szempontból – e terület szintén gyerekcipőben járt még itthon – egyfajta felsőbbrendűséget jelentett a honlap birtoklása, technikai szempontból még mindig nem volt létszükséglet számító­gép vagy számítógéprendszerek alkalmazása, a háztartásokban pedig még kevésbé.

A terület aztán robbanásszerű növekedést produkált, és – néhány hullámvölgytől eltekintve – azóta is folyamatosan gyarapodik. Ma már egyáltalán nem kérdés, hogy megfelelő IT háttér, gondosan tervezett és megvalósított rendszer nélkül a cégek élete nehe­zebb, és az sem, hogy a vállalati honlapok az információs rendszer alapvető elemei. A honlapok okoseszközökön működtethető mutációi napjainkban válnak egyre inkább megkerülhetetlenné.

Érdekes, hogy a honlapkészítés jól bevált módszere nem változott az idők során. Ezzel együtt vagy inkább ennek köszönhetően számos új munkaterület alakult ki: adatbázis-építő, alkalmazásfejlesztő, online kommunikációs szakember, webmarketing-szakértő, webdizájner, honlapépítő (sitebuilder), közösségi kommunikátor és még hosszan sorolhatnánk. E területek összehangolt munkájára van szükség ahhoz, hogy jól működő, releváns tartalommal bíró és sikeres online kommunikációt mutasson vállalkozásunk. Mint szakmai „vesszőparipáról”, a vállalaton belüli területek és a honlap készítése során velük kapcsolatba kerülők együttműködéséről többször írtunk már, de vannak kérdések, amelyeken mindig átsiklottunk.

Miért úgy néz ki egy honlap, ahogy kinéz? Mi határozza meg a reklámok, bannerek elhelyezését? Mi határozza meg egyáltalán ezek szükségességét vagy a laikus szemmel sokszor nehezen megkülönböztethető, jól olvasható betűtípusok kiválasztását, a formák összhangját, az igények összehangolásának fontosságát?

A válasz nem is annyira egyértelmű, mint amilyennek tűnik. Természetesen a grafikus segít a vizuális megjelenés tervezésében és megvalósításában. Csakhogy ebben az esetben a grafikusnak tudnia kell digitális felületen gondolkozni, ismernie kell az egyes mutációkon – tabletek, okostelefonok, közösségi felületek – való megjelenések részleteit. És az is fontos, hogy lehetőleg lásson előre, ne kelljen rövid időn belül újratervezni a honlapot, továbbá képes legyen átgondolni ugyanezeket a megjelenéseket nyomdai minőségben is! Tehát névjegytől a saját mobilalkalmazásig értsen mindenhez! Ideális esetben a profi dizájnerek ergonómiában gondolkodnak – amelynek megvannak a maga szabályai –, tudásuk komplexitása adja egyediségüket, a velük való kommunikációban pedig segítségünkre lehetnek azok az előrejelzések, amelyek a valóban viharosan fejlődő web területén felvázolják az eljövendő trendeket.

A webtervezés mára önálló iparággá nőtte ki magát, és olyan gazdasági környezetben, ahol a nyomtatott vagy elektronikus médiamegjelenés bizonyos szempontból egyre kevésbé hatékony, a honlapok és a hozzájuk kapcsolt egyéb felületek a vállalati kommunikáció kiemelt részét képezik. Amellett, hogy semmi sem pótolja például egy rádióriport jelentőségét, el kell fogadnunk, hogy egy jól felépített okosalkalmazás több felhasználót, vásárlót érhet el.
Ám az olyan területen, ahol akár egy szempillantás alatt változhat minden, és ami pillanatok alatt változik is akár technológia, akár virtuális szempontból, felesleges jóslásokba bocsátkozni a tökéletes megoldásról. Viszont betekintést nyerhetünk azokba az előrejelzésekbe, amelyek a várhatóan meghatározó elemeket, divathullámokat összegyűjtik, szakmai szempontból rangsorolják.

A méret a lényeg?

Minden bizonnyal, legalábbis az alkalmazott eszközök képernyőinek szempontjából. Az egyre-másra megjelenő mobileszközök képernyőmérete alapvetően meghatározza a honlapok kialakításának többrétegűségét, hiszen ami az asztali monitoron remekül mutat, valószínűleg szétesik vagy kezelhetetlen egy okostelefonon vagy tableten. Az ügyfélelérés szempontjából tökéletes méret létre­hozása nem ördöngösség, ellenben alapjaiban megváltoztatja az új honlapok tervezését, illetve a már működő honlapok továbbgondolását. A mobilapplikációk lényege – a minél több felhasználó elérése – megfelelő megjelenéssel kombinált üzleti célokat feltételez. A „hogyan” kérdése jelenti az igazi kihívást: miként tehető élvezetes felhasználói élménnyé, könnyen használhatóvá, kis eszközkapacitást igénylővé a weboldal vagy a webshop?

Szakértők egybehangzó véleménye szerint 2013 egyértelműen a Responsive Web Design (RWD), vagyis az érzékeny, rugalmas webdizájn éve lesz. Az elmúlt években megsokszorozódó mobileszközök szinte kötelezővé teszik a megfelelően alkalmazkodó online felületek létrehozását. Ez a technika lehetővé teszi azt, hogy a web­oldalak kompatibilisek legyenek szinte bármilyen eszközzel. Valóban bármilyennel, az okostelefonoktól a tableteken át a televízióig, az Android felülettől a Blackberry telefonokig. Ahhoz, hogy a weblapok „elférjenek” minden készüléken, az új oldalakat célszerű eleve így elkészíteni.

Trendkövető responsive honlap – vndesign.hu

A már működő és sikeres oldalak ilyen irányú fejlesztésének két módja ismert. Az egyik lehet egy teljesen különálló, mobil­eszközökre optimalizált oldal készítése. Ebben az esetben külön link jelzi az oldalon a mobilfelület elérhetőségét. A másik a saját mobilalkalmazás készítése – ez azonban kifejezetten költséges lehet, és biztosan nem minden felhasználó számára elérhető. A kettő közül természetesen mindig az adott szükségletek felmérését követően érdemes választani, de nem árt figyelembe venni, hogy utóbbi változatok esetében (mivel mindegyik pluszfelület) óhatatlanul megnövekszik a ráfordítandó energia. Ezért érdemes lehet alapjaiban újragondolni a már működő weboldalt, vagyis akár új, harmadik módként, a régitől független responsive felületet létrehozni. Ezeknek az érzékeny, rugalmasan reagáló weboldalaknak is megvannak az előnyei és a hátrányai.

Tagadhatatlan előny a felhasználói élmény minőségi javulása, hiszen a weboldal saját eszközökhöz való láthatatlan alkalmazkodása éppen a mobilböngészést, a „mindenkor” elérést teszi lehetővé. Így az ügyfél, vásárló, olvasó folyamatos kapcsolatot tarthat fenn a honlappal. Amellett, hogy ez is kiválóan beilleszthető a statisztikakészítő eszközök közé, a használt közösségeléréseket is egy lapra tereli.
Mivel pedig az egyes megszokott böngészőket is optimalizálják az egyes mobileszközökre, az átjárás egyre könnyebb és gördülékenyebb lesz. Ezekbe belegondolva érthető, hogy az egy lapra tereléssel megszűnik – legalábbis jelentősen csökken – az átirányítások hordozta veszély, a célzott felhasználó elérése pedig jóval hatékonyabbá válhat.

S hogy a hátrányokról is ejtsünk néhány szót: a reagáló web­oldalak keresőszavait nem egyszerű meghatározni, mert a mobilfelhasználók – érdekes módon – más kulcsszavakat használnak, mint a hagyományos számítógépes kereséskor. Így, ha az érzékeny web­oldal tartalma kizárólag mobiltartalom-szolgáltató, az hatással lesz akár a Google-ban elfoglalt helyére is. Igaz, a Google már törekszik ezeknek az oldalaknak a népszerűsítésére.

Természetesen nem minden honlap mellé szükséges azonnal társítani a mobileszközökre alkalmazható megoldást, újabbak tervezésekor, különösen egy-egy kampány vagy esemény információs oldalának létrehozásakor viszont mindenképpen érdemes megfontolni. Az internet a szó szoros értelmében életünk részévé vált, az egyre nagyobb számú eszközök pedig – kisebb-nagyobb monitorok, e-olvasók és tabletek, okos- és egyéb mobiltelefonok, laptopok – megszokottá teszik az internetfelhasználás különböző formáit.
Nem kérdés, hogy a mobileszközök térnyeréséből adódóan a méretérzékeny honlap az egyik legmegfelelőbb eszköz a felhasználók minél szélesebb körének megtartásához.

Új vizuális eszközök, technológiai megoldások

A weboldalak fejlesztésének, építésének szerves részét képezi a látványtervezés. Sok múlik azon, hogy a látogató első pillantásra mit és milyen minőségű információt fogad be egy-egy oldalról. Az érzékeny, minden eszközhöz alkalmazkodó weboldalak egyik sarkalatos pontja az, hogy a fejlesztés során sikerül-e megfelelni a technikai elvárásoknak. A WordPress például egyre népszerűbb, mert – felismerve az igényt – mind több olyan felhasználható megoldást, csomagot kínál, amely ötvözi a jó elrendezésű, jól reagáló honlapigényeket a legújabb vizuális elvárásokkal.

A jövőben a mozgalmasabb mediális tartalom mellett nagy hangsúlyt fektetnek a szöveges tartalmak megfelelő tálalására. A stílus, a megjelenés visszanyeri kiemelt szerepét, az elérhető eszközök tárháza pedig egyre bővül. A hang- és videomegjelenések kiemelkedő fontossága mellett – a digitális tipográfia fejlődésének köszönhetően – a megjelenő szövegek stílusa a webtervezés szerves részévé válik.

Az egyedi tervezésű betűk révén tökéletesen egyedivé lehet varázsolni az oldalakat, sőt a márkatervezéshez szorosan kapcsolódva egy-egy jól megválasztott stílus akár végig is kísérheti, támogathatja, erősítheti márkánk megjelenését, piaci kommunikációját. Bátran lecserélhetjük a megszokott Times New Roman, Calibri vagy Arial betűtípusokat – amennyiben érvényesítjük a kevesebb több elvét, vagyis az egyedi szövegtípust nem zúdítjuk normál tartalomszövegként a látogatókra…

A vázlattól az egyedi tervezésű betűkészletig – typographyserved.com

A már említett, kézzel rajzolt, skicces dizájn már most hihetetlenül népszerű, hiszen tagadhatatlanul varázsa van annak, ha digitális felületre viszünk manuális ábrázolást. Ilyenkor természetesen nem a honlapon belül állítjuk be a kézzel rajzolt betűtípust vagy menüpontot a „kézzel ábrázolás” érdekében, hanem az egyes elemeket képként mentjük el. A dizájnon belül a tipográfia egyébként is az egyik legérzékenyebb műfaj.

A kézi rajz és tipográfia a nyomda fénykorát idézi újra, amikor még a betűknek és a rajzoknak is volt értékük. Mindemellett a kézzel rajzolt ábráknak presztízsük van, hiszen viszonylag rövid tanulás után Photoshopban bárki tud például alakzatokat létrehozni, a valódi kézi ábrázolás azonban egyedi felhasználói élményt ad. Érdemes tehát ezt is figyelembe venni.

A Baurete betűkészlet – behance.net

A könnyű navigálást biztosító gombok egyszerűnek tűnő területe is változik, várhatóan a nagyobb gombok lesznek nyerők. A képernyők méretének csökkentése ugyanis nem jelentheti a funkciók elérésének nehezebbé válását. Ez előrevetíti az egyes gombok tervezésének szükségességét is. Ha már adott egy új felület az érintőképernyőn, használjuk ki az oldal stílusának egyedivé tételére! Ez némi többletterhet ró a tervezőkre, mert a grafikus felületű gomboknak szintén könnyen letölthetővé kell válniuk, vagyis nem növelhetik az egyes oldalak letöltési idejét. Mindenesetre a fejlődés mai üteme mellett hosszú távon ez nem jelenthet problémát.

Ugyanígy adja magát például a görgetés mikéntje is. A jelenleg elérhető weboldalakon függőlegesen és vízszintesen is haladhatunk az oldalon belül. Más kérdés, hogy ez mennyire felhasználóbarát, de nyilván ezen a területen is az oldal célja határozza meg az elsődleges irányt. Ami még friss, de máris rendkívül szimpatikus jelenség, a függőleges görgetésnek az a módja, amikor a főmenü követi a felhasználó mozgását az oldalon.

A hatékony és kényelmes keresés az oldalakon belül így válik még inkább felhasználó­baráttá, a rugalmasan reagáló honlapok esetében pedig kifejezetten előny egy követő fejléc segítségével megkönnyíteni a keresést az okostelefonon, mert így nem kell a visszautat keresni, az állandóan elérhető menüsorral mindig pontosan tudjuk, hol járunk, illetve a honlapon belül könnyen ugorhatunk egyik oldalról a másikra. A fejléc menü mellett akár a közösségi funkciógombok vagy éppen a bevásárlókosár folyamatos elérése, láthatósága is fontos lehet.

A görgetés egy korábban már alkalmazott, manapság új technológiai megoldásokat használó változata a parallax görgetés. Ez a játékoknál már működött, a játékpálya követése, „körülnézés”, oldalváltás görgőgombbal, de várhatóan egyre nagyobb teret hódít a weboldalak tervezésénél. Látványos, már-már 3D-s hatást lehet vele elérni, de kiváló eszköz akkor is, ha egyszerűen valami izgalmasat szeretnénk kínálni, vagy új irányból mutatnánk be termékünket, szolgáltatásunkat.

Példa a kézzel rajzolt grafikai elemekre és a parallax görgetésre – head2heart.us

A vállalati kommunikációval és marketingtörekvésekkel együtt pedig igazán korszakalkotó online bemutatkozást tesz lehetővé. Mint minden trendi és „ütős” vizuális hatású megoldásnál, az alkotóelemek kiválasztásánál mindenképpen törekedni kell az egyensúlyra, hogy elkerüljük a harsányságot és a zsúfoltságot.

Miért fontos a minőségi webdizájn?

A márkaépítés döntő eleme az első benyomás. Weboldalukkal a vállalkozások akár néhány másodperc alatt is képesek megfogni a látogatót. Minden vállalkozásnak fontos, hogy olyan képet közvetítsen magáról, amellyel a márkahűséget erősíti, és új ügyfeleket, vásárlókat, felhasználókat célozhat meg és vonzhat magához.

Kreatív megoldás a ruhák bemuta­tására: görgetésre a modell „átöltözik” – krystalrae.com

Az online stratégia kialakításánál elengedhetetlen, hogy olyan szakembert válasszunk weboldalunk tervezésére, aki egyaránt nagy hangsúlyt fektet a legújabb irányzatok és technológiák figyelemmel követésére és alkalmazására, és képes szem előtt tartani a márka üzleti pozíciójának erősítését is. A webtervezők tehát kipróbálhatják magukat az online elérést biztosító minden eszközön, a vállalatok vezetői pedig velük összhangban és együttműködve megvalósíthatják legmerészebb álmukat is az egyedi márkák megjelenítése terén.•


 
Archívum
 2011  2012  2013  2014  2015  2016  2017  2018  2019  2020  2021  2022  2023  2024
Címkék

Innotéka