Hova helyezd a logót a weboldalon, balra vagy középre?

Nem mindegy? Kérdezhetnéd joggal, pedig hidd el nem, ugyanis sokat számít a logó elhelyezése. Mindannyian ismerjük a logók fontosságát, hiszen a logó jelképezi a vállalkozás márkáját és ez a legjobb módja annak, hogy az emberek felismerjenek. A másik fontos szempont pedig, hogy az oldal használhatósága miatt sem mindegy hová kerül a logó.
Munka egy laptopon

Kezdd azzal, hogy gondolj néhány olyan webhelyre, amelyet minden nap felkeresel, mint például a Netflix, a Facebook, a YouTube, vagy akár a bankod és nézd meg hogyan valósul meg ezeken az oldalakon a logó elhelyezése. Ezeknél a weboldalaknál a logót leggyakrabban a bal felső sarokban találod meg. Ez egyébként nem csak a márka azonosítására szolgál, hanem egy visszamutató linkként is működik a webhely nyitó oldalára.

Míg a bal felső sarok szinte már szabvánnyá vált, valószínűleg két másik helyen is láttál már logókat egy cég webhelyén. Ezek középen, és igaz sokkal ritkábban, de a jobb felső sarokban is előfordulnak néha.

Ha egy weboldal mobilos megjelenését nézzük, akkor azonban már sokkal gyakoribb a középre helyezett logó. Akkor most melyik a jó megoldás és mikor hová helyezzük a logókat? Ezt fogjuk most megvizsgálni.

Miért a bal felső sarok a leggyakoribb a logók esetében?

Ha szigorúan az UX tervezési logika alapján nézzük, akkor ennek két oka van:

  1. A legtöbben balról jobbra és fentről lefelé haladva olvasunk, ezért természetes reakció, hogy először a bal felső sarokban keressük a logót.
  2. A webdizájn korábbi éveiben a logók mindig a bal oldalon és felül voltak, így ezt már megszoktuk. Emiatt a „biztosan így van” feltételezés erősen működik bennünk.

Vegyük ehhez hozzá, hogy a webdesign elsődleges szerepe szerint sokkal inkább a UX-ről (felhasználói élmény) kell hogy szóljon, mintsem hogy valami mennyire jól néz ki. Emiatt a logóknak két fontos szerepét kell hangsúlyoznunk.

Elsősorban tájékoztatja a felhasználót arról, hogy éppen hol jár és melyik oldalon van. A másik pedig az, hogy a kattintható logók segítségével könnyen visszatérhetünk a főoldalra, bárhol is legyünk éppen a webhelyen. Ez egyébként azért is szükséges funkció, mert egyre több weboldalon nincs már kezdőoldal link.

A Netflix nyitóolda, ahol a logó bal oldalon van

Nielsen Norman Group készített egy felmérést, amiben a logók elhelyezését vizsgálták. Ebben több szempontból is megnézték a bal kontra közép és a bal kontra jobb logó elhelyezéseket.

Bal oldali logó kontra középre igazított

A teszt során megnézték a navigáció használatát és a kezdőoldalra történő visszatérést. Ezen kívül elvégeztek egy másik tesztet is, amely során a logó elhelyezése alapján kellett felidézni a márkához kapcsolódó dolgokat.

Ebben a vizsgálatban a következő lett az eredmény:

  • A balra igazított logók megkönnyítik a navigációt. A felhasználók mindössze 4%-a nem tudott egyetlen kattintással visszatérni a kezdőoldalra. Amikor azonban a logót középre helyezték, akkor ez már a felhasználók 24%-ának nem sikerült.
  • A márka felidézését nem befolyásolja, hogy a logó a bal oldalon vagy középen van. Annak ellenére, hogy a felhasználóknak ugyanazt a logót különböző helyeken mutatták meg, a márkaismertség szempontjából ez nem hozott nagy eltéréseket.
diagram1
A balra igazított logók megkönnyítik a navigációt. 

Bal kontra jobb oldali logó

A bal kontra jobb vizsgálat során az NNGroup 128 felhasználó válaszát tesztelte és figyelte meg. 

Itt ezek lettek az eredmények:

  • A balra igazított logók nagyobb márkafelidézést eredményeznek. Pontosabban, az átlagos márkafelidézés a balra igazított logók esetében 39% volt, míg a jobbra igazított csak 21%-ot ért el.
  • A balra igazított logók nagyobb valószínűséggel kapnak „egyedi” címkét.  A balra igazított logó, bár ennek az elhelyezése a hagyományos, mégis több esetben kapott „egyedi” és „stílusos”címkét, mint a jobb oldalon megjelenő logó.
Diagram 2
A balra igazított logók nagyobb márkafelismerést eredményeznek

Miért van mégis sok logó középen?

Annak ellenére, hogy mit mond a logika és a tervezési elvek, vannak olyan webhelyek, amelyek megkerülik ezeket az ajánlásokat. A mobil eszközökön ez nem gond, hiszen ebben az esetben valamelyik oldalra, – a szokás szerint vélhetően jobbra, – kerül a menü ikonja, a logó pedig középre igazodik. Nagyméretű kijelzők esetében ez a „hamburger ikonnal” történő menü megjelenítés és elrendezés azonban már nem indokolt. Ez UX szempontból sem annyira szerencsés.

pax world nyitó oldalán a logó középen van

„Miért ne tehetném?”

A tervezők egyre többször használják a középre igazítást, amire általában a legfőbb indok a szimmetrikus elrendezés. És mivel ez egyfajta vizuális egyensúlyt eredményez, könnyebb vele a vizuális hierarchia kialakítása is.

A hierarchia kialaktásáról egyébként ebben a cikkünkben olvashatsz bővebben.

Vannak helyzetek amikor a középre igazítás a nyer?

Vannak olyan esetek, amikor a középre igazított logó mégis elfogadott lehet. Történelmileg a nyomtatott újságok logóját mindíg nagy méretben és középen helyezték el. Ezt az olvasók megszokták, így az ilyen típusú elrendezést sokszor a nagyobb hírforrásokhoz társítják. Ez megint csak a „megszokás” tökéletes példája, ahol a logó középre helyezése elfogadott dolog.

A másik gyakori előfordulása pedig a művészek személyes oldalain figyelhető meg. Az ilyen oldalakon, csakúgy mint a minimalista oldalakon, a logó elhelyezésénél majdnem minden esetben a középre igazítással találkozni, mivel itt általában minden a szimmetriáról és az egyensúlyról szól.

Mi a tanulság?

A középre igazított logó a tervezés szempontjából lehet hogy kényelmes és elegáns megoldásnak tűnhet, viszont ahogy azt a kutatás is megmutatta, több pontban is rosszabbul teljesített.

A logó középre helyezése rontja az oldal használhatóságát, ez pedig problémát jelent. Talán mert a megszokás ezt eredményezi. Vagy mert a megszokott dolgoktól való kismértékű eltérés is gondolkodásra kényszeríti a felhasználókat az oldal használatát illetően. Ez pedig növeli a kognitív terhelést és ellentétben áll a webergonómia első és legfontosabb szabályával, miszerint:

Ne kelljen gondolkodni. Amikor ránézünk egy weboldalra, az legyen egyértelmű, evidens, „önmagyarázó”. Magyarul ha a felhasználónak erőfeszítést jelent egy feladat elvégzése, akkor van még mit javítani.

Az oldal navigációja mellett a másik nagyon fontos funkció egy oldalon az adott oldal azonosítása, vagy más néven a márkafelismerés. Hogy a látogató be tudja azonosítani milyen oldalon jár, mit kínál az adott oldal, illetve mivel foglalkozik. Valamint hogy emlékezzen is erre, mivel csak így lehet megfelelően tervezni és marketing célokat elérni az adott oldallal.

A tanulság tehát az, hogy ha csak nem feltétlenül szükséges, ne térj el megszokott dolgoktól. Helyezd el a logót az oldal bal felső részén, mert ez a tuti. Ha nagyon muszáj, akkor pedig tedd középre, viszont semmiképpen se jobbra, mivel ez még inkább ront a felhasználói élményen.

Kiemelt kép: Anna Shvets

Nézd meg a tanfolyamot és legyen Neked is egy jól fizető, kreatív szakmád.