Színek használata a weben

  • Rung András
  • 2009. ápr. 22.
  • 2 hozzászólás
  • 2 perc

Arra gondoltam, hogy a könyvünkből egy két dolgot érdekességképp közzé teszek. Ezek az irányelvek, amelyeket 2003-ban megfogalmaztunk a színek használatával kapcsolatban. A konkrét színekkel kapcsolatos megállapítások lehet, hogy már változtak, de szerintem a 3-5 pont még mindig nagyon helyén van, mivel nagyon általános vizuális igazságokat fogalmaz meg, amelyeket az ókortól hat az emberre. A kutatás legérdekesebb része az volt, hogy nagyon alapvető vizuális törvények, amelyeket még Arnheim fogalmazott meg szépen a weben is érvényesek.

1. Honlapunk megtervezésében kiemelten fontos szerepet kell szánni a színnek, mert a tartalmi preferenciákhoz hasonlóan nagy befolyással rendelkezik. Általában legkedveltebb a narancs, kék és a fehér háttér, kerüljük a lila és a szürke hátteret, azonban megállapítható, hogy az egyes színek kiválasztásában mindig több szempont mérlegelése után döntsünk.

Az olvashatóság megítélésében jelentősen belejátszanak szubjektív tényezők: felhasználóink hajlamosak egy nehezebben olvasható szöveget is elfogadni, ha az egyébként színpreferenciáiknak megfelelő.

2. Nők és férfiak színpreferenciájában nagy különbségek vannak, ami azonban a korral együtt, illetve a tartalom függvényében folyamatosan változik. Általában férfias témáknál ajánlott a narancs, kék vagy zöld háttér, nőies témáknál ajánlott a kék, piros vagy a fehér háttér. Semleges témákban inkább a férfias témáknál megszokott színek az elfogadhatóbbak.

3. Azonos színű objektumokkal könnyedén vezethetjük a felhasználó tekintetét, különösen, ha ezek közel vannak egymáshoz. Ez az eszköz különösen alkalmas arra, hogy fontosabb navigációs pontokat kiemeljünk, illetve egymástól fizikailag távolabb eső elemeket vizuálisan összekapcsoljunk, amivel megkönnyíthetjük a felhasználók számára az eligazodást.

4. Több azonos színű objektum ronthatja a felhasználói tekintetvezető hatást, vagyis csínján kell bánni vizuális eszközeinkkel.

5. A keresett objektumhoz ne helyezzünk közel azonos színű egyéb objektumot, mert rontják annak megtalálási idejét.


A SZERZŐRŐL

Rung András 2002 óta foglalkozik UX-szel. Az innovációt és az üzleti fókuszt mindig szem előtt tartja. Az első magyar webergonómiai könyv a Felhasználóbarát honlapok társszerzője. Cikkei a nemzetközileg is jelentős Smashing magazinban is megjelentek.

  1. gina.slegl Válasz
    Kifejtenéd ezt a postot egy kicsit bővebben?

    Az hogy azt mondod hogy a legkedveltebb a narancs, kék és fehér háttér egy kicsit nagy fogalom kör. Mert hogy az #ffa200 is meg az #e5b535 is narancs viszont pl #f8edcf inkább halványsárga (ha már ilyen nagyobb halmazokról beszélünk). Namost, ha én csinálok egy weboldalt #ffa200 háttérszínel és arra ráírok valamit, akkor olyan szentségelést kapok hogy csak na. Meg a másik, hogy kerüljük a szürke hátteret. Ezt mivel indokolnád? Csak mert szerintem a hazai oldalak 90%-án tuti hogy így vagy úgy de megjelenik a szürke bármilyen árnyalatán szöveg.

    Olvasgatom már egy ideje a blogod, csak az az alapvető problémám hogy szerintem nem túl gyakorlatias dolgok merülnek fel. Kicsit olyan érzésem van néha amikor olvasom ezeket az írásokat, hogy ez elméletben mind szép, de mikor konkrét esetekről beszélünk akkor azért nehéz megkapaszkodni ezáltal. Nem azzal van a gondom, hogy nem hiszem el vagy nem tartom hitelesnek ezeket, nyilván minden megmagyarázható valamivel, de amikor oda kerül a sor hogy le kell ülni és megrajzolni egy webdesignt, ami nyilván nem csak a webergonómián múlik, hanem figyelembe kell venni tartalmi, arculati, marketing, sales elvárásokat, akkor azért ez máris nem olyan egyszerű. Mert pl hiába szeretnék én kék narancsa vagy fehér hátterű szöveget, ha amúgy az arculat pirosból és feketéből áll :)
  2. Rung András Válasz
    @gina.slegl:
    természetesen, ha van egy fix arculatod, akkor azzal sok mindent nem tudsz csinálni, nyilván a színt akkor tudok választani, ha van játékterem. Hogy miért ezek a színek azt így 5 sorban nehéz megmagyarázni. Ha érdekel az indoklás adj egy mail címet és elküldöm. A színek egyébként ezek voltak:
    piros (ffd0d0), sárga (ffffa1), illetve kevert elsődleges színek: lila (ffa1ff), zöld (d0ffd0), narancs (fff060), valamint a szürke (dadbda) és végül a fehér (ffffff). Mint láthatod fehérrel törtük őket, hogy egyforma fényerejűek legyen ez az olvashatósági összehasonlíthatóság miatt volt.

    Azzal viszont nem értek egyet, hogy gyakorlati életben nem lehetne ezeket kiválóan használni. Ha megnézed ennek a blognak kb. 50% konkrét elemzés ahol aprólékosan belemegyek, hogy mi jó, mit kéne másképp csinálni. Az általános elveket se olyan nehéz lefordítani konkrét tervezésre:

    4.-es pontra megnézed a t-mobile.hu oldalát. Markánsan alkalmazzák a magentát kiemelésekre, hogy odavonzzák a tekinteted. De mivel túl sok ilyen kiemelés van, ezért már nem igazán alkalmasak a tekintet hatékony vezetésére. Ezzel szemben a bbc.co.uk mértéktartó vörös kezelése sokkal értelmesebb. Szóval szerintem az elméletben nagyon szép felvetések a gyakorlatban is nagyon jó alkalmazhatók, ha megvan az adott gyakorlati probléma, akkor meg tudom mondani, ha mit kell rá alkalmazni. Az esetek többségében persze. Ez se mindenható tudomány.

Szólj hozzá

 
Kérjük, írja be nevét!
Kérjük, írja be email hozzászólását!