Webshark Blog

A jövő sötét, a digitális felületeken mindenképpen. Nyilván érzed Te is, hogy a fehér évtizedek után egyre több esetben tudsz váltani úgynevezett “sötét módra” a különféle operációs rendszereknél és egyéb appoknál. Miért ne tennéd meg a weboldaladnál?

Már 2018-ban látható volt, hogy rohamosan terjednek a sötét hátterű design-változatok a digitális felületeken: egyre több appban lehet váltani fekete vagy sötétszürke háttérre és fehér betűkre, ahogy maguk az operációs rendszerek is ezzel kísérleteznek.

Első pillantásra talán újnak tűnik a sötét felületek térhódítása, de nem kell távolra tekinteni, hogy kiderüljön: nem most találták fel a sötét módot. Csak az elmúlt évek, évtizedek fehér világa után tűnik furcsának. De ha jobban belegondolsz, látod, azt megelőzően is fekete-fehér, illetve fekete-zöld felületek uralkodtak a monitorokon, mégpedig a fekete dominanciájával.

Most az elképesztő színeket és felbontásokat tudó kijelzők korában vajon miért indokolt a visszatérés?

Ennek egyik oka az, hogy mára elképesztő mennyiségben vesznek minket körül a kijelzők, melyeknek fehér színű sugárzása elég zavaró tud lenni, különösen az esti órákban. Márpedig ezek a kijelzők nagyrészt nem napfényes helyeken és időszakokban működnek, hanem beltérben és sötétben.

A másik ok pedig az, hogy a kijelzők evolúciója mára eljutott egy olyan pontra az OLED-nek köszönhetően, amikor a fekete valódi fekete: azaz a fény ellentéte jelenik meg ezeken a típusú kijelzőkön (ellentétben az LCD-kkel), mivel nem igényelnek háttérvilágítást. Ráadásul ez az akkumulátorokat is kíméli, hiszen míg LCD-nél folyamatosan megvilágítja a teljes kijelzőt a háttérfény, addig az OLED-nél a fekete pixelek kikapcsolt állapotot jelentenek.

Mindez pedig lehetővé teszi azt, hogy újult erővel kezdjük használni a sötét módot, illetve a weboldalunkkal, appunkkal is alkalmazkodjunk ahhoz, hogy egyre elterjedtebbek a sötét hátterű megoldások.

Azt viszont tudni kell, hogy a sötét háttereknél a design is jelentős mértékben változik, oda kell figyelni pár új dologra, különben használhatatlanná válik a weboldal. Nem elég tehát az, hogy az eddigi világos hátteret lecseréled egy feketére. Ezzel korábban már foglalkoztunk a színekről szóló bejegyzésünkben, de nézzük meg újra részletesen!

A sötét mód nem feltétlenül fekete

Az egyik legfontosabb dolog, hogy ha sötét módra váltanál az appod vagy weboldalad designjában, akkor nem egyszerűen annyit teszel, hogy lecseréled a fehéret feketére és fordítva. A dolog egy kicsit bonyolultabb. Többek között azért, mert fekete háttéren például nem lesz lehetőséged árnyékolásokat használni, vagyis a design elég flatté válik, és nem a jó értelemben. Tehát, ha sötét designt használnál, akkor azon belül sötétebb és világosabb felületekre lesz szükséged: a kiemelkedő részek világosabbak, a háttérben lévők sötétebbek lesznek. Ez a valóságot próbálja leképezni, és mindjárt megjelenik egy eszköz a hierarchia kialakítására.

A sötét háttér nem feltétlenül jelenti azt, hogy a korábbi elsődleges vagy kiemelkedő színeidet ne használhatnád, hiszen akár passzolhatnak is hozzá, különösen egy ikon esetében. Mindig figyelni kell azonban kontrasztra, vagyis annak mértékére. Ha nem elegendő a kontraszt, akkor bajosan fogja magára felhívni a figyelmet az adott elem, ami már gondot jelent a designban.

A probléma tipikusan a telített színeknél jelentkezik, melyeket nagy előszeretettel használunk gomboknál vagy egyéb figyelemfelhívő elemeknél világos háttereken. Ez azonban nem működik ugyanúgy sötét módban. A Google ilyenkor egy plusz 40 százalékos fehér layert tesz rá a színre a Material Guidelines szerint, vagyis egyszerűen egy új színt kezd használni, amikor sötét módra vált. Ez az érték egy jó kiindulópont lehet mindenki számára. Ragaszkodni persze nem muszáj hozzá, de a kontrasztot mindig figyelni kell.

A következő probléma a betűknél jelentkezik, az olvashatóságot tekintve. A megszokott színeid a megszokott betűméretben nem valószínű, hogy olvashatóak maradnak. Ebben az esetben vagy a színen kell módosítani, vagy a méreteken.

Ugyanakkor nem csak a színes betűkkel lesz gond sötét felületeken, hanem a fehérrel is. Az nem működik, hogy egy teljesen fekete háttérre ráhelyezel maximálisan fehér betűket. Ebben az esetben ugyanis elkezdenek egybefolyni a szemlélő számára a világító betűk, és olvashatatlanná válik a szöveg. Tehát ahogy egy teljesen fehér háttér sem nyerő megoldás, úgy a teljesen fehér szöveg sem fekete háttéren.

Amire még figyelj sötét módnál:

• alapvetően érdemes nagyobb betűméretet használni, mint világos témáknál,
• vedd a megszokottnál nagyobbra a white space-t, azaz a negatív teret
• tarts nagyobb távolságot az egyes betűk és a sorok között is
• a bekezdések is lehetnek rövidebbek és jobban elválasztottak, mint világos témáknál
• használj kevesebb szöveges tartalmat, mert egyébként zsúfoltnak hat majd a weboldal.

Van, amikor el kell felejteni a sötét módot!

Habár sok esetben kompenzálható a sötét háttér a megváltoztatott méretű és színű elemekkel, vannak olyan dolgok, amik nem működnek sötét háttéren. Ilyen lehet például egy szövegszerkesztő vagy akár egy fotószerkesztő felület. De lehet olyan a megjelenésed, hogy nem fér össze vele a sötét mód. Mit kell megfontolnod?

Akkor használj inkább világos témát, amikor

• sok tartalom van a felületeden
• amikor professzionális megjelenésre törekszel
• amikor egyszerű, de klasszikus megjelenést szeretnél elérni

Ugyanakkor használd bátran a feketét, ha

• ha nem a szöveggel akarsz hatni, hanem a képeid erősek
• stílust és luxust akarsz bemutatni (ha jól csinálod kapsz egy modern, de egyben egyszerű megjelentést)
• ha a felhasználóid sokáig nézik a felületeidet (ellenőrizd használhatósági teszttel!)

Azt is fontos azonban figyelembe venni, hogy ma még a legtöbb szöveges anyag világos háttéren jelenik meg, nyilván nem véletlenül. A kutatások ugyan ellentmondóak, azonban, ha sok szöveget használsz a weboldaladon, akkor nem biztos, hogy egy fekete háttér esetén ugyanannyit fognak elolvasni belőle a látogatók, mint világos háttérnél.

Célszerű persze arra is figyelni, hogy a felhasználód mit várnak el, készen állnak-e a sötét mód használatára, mely egyelőre még szokatlan a weben, a gyors terjedés ellenére. A különböző célcsoportnak eltérő preferenciáik vanak, ezt nem szabad elfelejteni. Érdemes a vizsgálatokra is áldozni, hogy kiderüljön: kísérletezhetsz-e a modernebb megjelenéssel.

Mint az előbbiekből is látható, a sötét téma sok tekintetben rontja a felhasználói élményt, miközben más szempontból előnyös, hiszen csökkenti a szem terhelését, fáradását azzal, hogy nem világít, valamint az akkumulátorra nézve is kedvező hatású. A jövő várhatóan egyre sötétebbé válik a digitális világban, úgyhogy jó, ha Te is felkészülsz!