webdizájn

5'

Weboldal felújítás: Hogyan hat a vevőkre egy elavult dizájn?

Bezerédy Bence / 2/15/2020

Miért kerül sokba, ha túlságosan eljár egy weboldal felett az idő?

Az első benyomások 94%-a a dizájnnal kapcsolatos. Épp ezért nem meglepő, hogy sok megkeresést kapunk olyan ügyfelektől, akik ahogy a weboldaluk kinézete felett eljár az idő, úgy a számok és eredmények romlását is tapasztalják.

A tárgyi eszközökhöz hasonlóan egy weboldal is amortizálódik. Egy 10 éve menőnek számító kinézet ma már újratervezésért könyörög – és mindaddig, amíg ez nem történik meg, súlyos pénzekbe kerül az elvesztett ügyfelek miatt.

Ez a cikk azért született, hogy segítséget nyújtsunk azoknak a vállalkozóknak, akik hasonló cipőben járnak.

A fogyasztók 75%-a bevallottan ítélkezik a vállalatok hitelességéről a weboldal dizájnja alapján. Ezt egyébként holdudvar hatásnak hívjuk. A holdudvar hatás azt jelenti, hogy egy tulajdonság alapján alkotunk egy átfogó ítéletet egy személyről, vagy dologról. Pl.:

szép weboldal → biztos jobb a szolgáltatás, kedves pincérek → biztos finomabbak a fogások

Alapvetően két lehetőség van, ha egy weboldal felett eljárt az idő. Ha még vannak menthető elemei, van egy arculata az adott márkának, esetleg a logikai felépítése is megfelelő, akkor elég lehet a külső megjelenését frissíteni. Abban az esetben, ha a weboldal struktúrája sem felel meg a ma követelményeinek, és teljességgel használhatatlanok a vizuális elemek, egy teljesen új weboldalra van szükségünk (ezt angolul redesignnak hívják).

Nézzünk pár példát, hogy milyen ma már elavultnak számító megoldások és elemek azok, amik piros zászlókat lengetnek (néhány esetben szirénával kiegészítve) a potenciális vevők arcába.

1. Elavult dizájnelemek

Hogy mitől jó egy weboldal használhatóság és felhasználóbarátság szempontjából, az leginkább az emberektől és pszichológiai tényezőktől függ: például hogy olvasunk, hogy döntünk, hogy keressük az információt, mit veszünk észre, vagy épp mit nem. Ezek a dolgok nagyon lassan változnak, hiszen ehhez az embereknek kell változniuk. Nem így van ez a vizuális elemekkel… Webdizájn trendek, stílusok jönnek-mennek, és ami menő volt 2015-ben az ma már nem annyira. Ki emlékszik még az iOS 6 dizájnjára, vagy mondjuk az Instagram régi logójára?

Az iOS 6 és az iOS 13 dizájnja.
Az iOS 6 és az iOS 13 dizájnja.

Képzeljük el, hol járna az Apple, ha ma is a csillogós, árnyékos, tükröződős dizájnt használná… Hogy venné fel a versenyt a többi modern kinézetű operációs rendszerrel? Te melyik oldalon foglalnál szívesebben szállást? A Szállás.hu 2011-es, vagy a mai oldalán?

A Szállás.hu 2011-es dizánja.
A Szállás.hu 2011-es dizánja.

A Szállás.hu új dizájnja.
A Szállás.hu új dizájnja.

Az Apple és a Szállás.hu példáiból jól látszanak azok az elemek és megoldások, amik ma már azonnali időutazást biztosítanak az előző tizedfordulóra:

  • indokolatlan, ósdi hatású textúra a háttérben
  • csillogás, tükröződés (az iOS 6-ban mindenhol)
  • unott színátmenetek, valami elfuserált színből fehérbe (Szállás.hu fejléce, vagy az egyetemisták által imádott Neptun rendszer)
  • nem széltől szélig érő, hanem keretes dizájn (Szállás.hu)

2. Átláthatatlan a hajtás felett

A hajtás felett a weboldal azon része, ami a böngészőben görgetés nélkül látszik. A szakkifejezés az újságoktól ered, ahol a hajtás feletti rész jelenti az első oldal felső részét. Ide kerülnek a legfontosabb hírek, az újság logója, ár, dátum, stb.

A párhuzam az elavult weboldalak esetében nem is olyan meglepő, hiszen sokan közülük pont úgy néznek ki mint egy újság: hatalmas fejléc, esetleg súlyosabb esetben képekkel, túl sok menüponttal, bal oldali menüvel, középen rengeteg szöveggel, amit senki nem olvas el, illetve jobb oldali menüvel, ami szintén nem érdekel senkit (az emberek megtanulják figyelmen kívül hagyni a hirdetéseket, és az olyan helyeket, ahol általában hirdetések vannak, mint a jobb oldali rész).

Ez egyszerűen túl sok teher egy weboldalt böngésző felhasználó agyának, nem látható át villámgyorsan, nem tudja pontosan mi a célja az oldalnak és ezt általában a vissza gombbal szokás megoldani.

Egy jó hajtás feletti rész nagyon tömören és lényegre törően mutatja be, hogy mit nyújt a weboldal, és hogyan. A Slack oldalára tévedve, egy mondat alatt megtudjuk, hogy a szoftver helyettesíti az emailt. Nincs mellébeszélés, bemutatkozás (x éve vagyunk a piacon) és felesleges elemek.

A Slack oldala jó példa, hiszen villámgyorsan megérthető, mi az amit kínálnak.
A Slack oldala jó példa, hiszen villámgyorsan megérthető, mi az amit kínálnak.

3. Elavult képek

Elavult, és/vagy gagyi képek Pixeles képek? Ide-oda bevágott, szedett-vedett méretű és arányú képek? 2000-res éveket üvöltő csillogós, 3D képek? Kicsi képek, amit alig látni, és a felhasználó nem érti miért van ott? Modern, de megjátszós, beállított hatást sugalló stock fotók? Talán ezek a weboldalon található képekkel kapcsolatban elkövethető visszaélések szintjei, csökkenő sorrendben. Kár is ragozni.

4. Nem reszponzív webdizájn

A nem reszponzív webfejlesztés eredménye, hogy nem reagál a képernyőméret változásaira a weboldal megjelenése; tehát mondjuk mobilon is asztali verziót kapunk. A számok ebben az esetben is beszédesek: a felnőttek 85%-a szerint egy cég weboldalának ugyanolyan jól, ha nem jobban kell működnie egy mobileszközön, mint asztali formátumban.

5. Nem biztonságos kapcsolat (nem HTTPS)

A Google már 2016 óta bünteti a nem biztonságos weboldalakat. Az SSL tanúsítvány hiánya az egyik legalapvetőbb hiányosság, ami inkább régi és elhanyagolt oldalaknál jelentkezik.

Miért fontos ez az egész?

Fentebb már említettük, hogy a felhasználók háromnegyede bevallottan ítélkezik a weboldal függvényében. Ehhez még hozzájön, hogy az internetezők 38%-a abbahagyja a böngészést az olyan oldalon, aminek a dizájnját nem találja vonzónak. Szerintem ha ez a két szám nem győzött meg ennek a fontosságáról, akkor igazából semmi nem fog.

Ha a saját weboldaladra ismertél valamelyik pontban, vagy bármi kérdésed van, keress minket bátran! :)

Források: sweor.com, waybackmachine.org, szallas.hu, pocket-lint.com, slack.com

Ha érdekesnek találod, oszd meg a cikket bátran!

Töltsd le ingyenes online marketing anyagunk!

Hasznos eszközök, amikkel felpörgetheted online jelenléted

Ezzel elfogadod adatkezelési feltételeinket.