Nyitóoldal   |   SZÍN  |   SZÍNKOMMUNIKÁCIÓ   |   Tartalom 
 
 
 
 
2.3.3.3.

Színes szöveg olvasása
 
 
Az olvasás az ember tanult képessége. A vizuális ingerek és mintázatok között különleges helyet foglalnak el a betűk: a szöveg olvasása, a többi képi inger feldolgozásától bizonyos mértékig eltérő feladat számunkra, a betűk és szavak közvetlen (nyelvi) információt hordoznak.

A betűk és hátterük színesek is lehetnek, a szín pedig befolyásolja az olvashatóságot, az üzenet befogadását, értelmezését és érzelmeket kelt. A színnek nemcsak figyelemfelhívó és esztétikai szerepe, hanem ergonómiai jelentősége is van, mert az olvashatóság minden szöveges környezetben kiemelt követelmény. Az írott szöveg megértése általában hosszabb időt vesz igénybe, mint a képé, ezért az olvashatóság fontosságát nem lehet eléggé hangsúlyozni. (
Feisner 2006:87; Carter 2002; Using Color in...)


Passzív és aktív felület

Szöveggel két különböző fizikai környezetben találkozunk, melyek ergonómiai szempontból is lényegesen eltérnek egymástól: (Majoros 2004:21)

Passzív felület:
• papír és más hagyományos anyagok
• visszaveri a ráeső fényt
• statikus
• a szín intenzitása korlátozott, mert festék, tinta hordozza

Aktív felület:
• elektronikus (monitor, kijelző, világítótestek, LED)
• fényt sugároz
• dinamikus (programozottan vagy interaktívan mozoghat)
• világít, és ezért a szín nagyon intenzív lehet

Mindezekből következően aktív felületről olvasni (rendszerint) fárasztóbb.

Az aktív felület előnye a passzívval szemben:
• nem igényel megvilágítást
• a betűméret (általában) változtatható

Már létrejött a passzív és aktív felület fúziója az elektronikus papír, mely egyesíti az előnyöket, ez az e-könyvolvasó (e-book) kijelzője
. Folynak a kísérletek színes felület létrehozására is, de ez a kereskedelemben jelenleg (2012) még nem kapható. (E-papír; E-ink)



Az olvashatóság szín-kritériumai

Az olvashatóságnak és szövegek megjelenítésének számos szempontja van, amire itt nem térhetünk ki. A tipográfia már több száz éve kiforrott, de az elmúlt évtizedekben forradalmi változásokon ment keresztül. Az utóbbi 1-2 évtizedben az internetes megjelenés teljesen új lehetőségeket és követelményeket állított erre a területre is. Az új lehetőségek sajnos új hibalehetőségeket is magukkal hoznak, ráadásul az internetes környezet messze van a kiforrottságtól, szinte évente változik. A számítógépes szövegszerkesztés nemcsak a képzett tipográfusok, hanem nagyon sok ember napi feladata, talán ezért hemzsegnek az alig vagy nehezen olvasható szövegek a világhálón. Mindenkinek, aki szöveget tesz közzé, illik legalább elemi szinten ismernie az olvashatóság „törvényeit”. (Virágvölgyi 1996; Leiszter 2011)

Az alábbi példák, megállapítások és színjavaslatok csak a hosszú, összefüggő, ún. főszövegre érvényesek. Címek, rövid szlogenek, kézzel írott és más szövegfajták esetén egyéb szempontok is felmerülnek, de ezekre itt nem térünk ki.

(Ezen a weboldalon olvasható főszöveg betűinek színe kékesfekete: #040030)


Kontraszt

Az olvashatóság szín-kritériumai között legfontosabb a világosságkontraszt. A legnagyobb kontraszt a fehér és fekete között van, a szövegek túlnyomórészt ilyen környezetben jelennek meg, de más világos és sötét színek is megfelelnek a célnak. (
de Grandis 1984:118; Color contrast)
Egyes kutatások szerint a leginkább olvasható színkombináció a sárga alapon fekete karakter, de ez csak a rövid szövegekre (pl. felhívás, figyelmeztetés) érvényes. Folyamatos szövegnél az élénk színű háttér rendkívül fárasztó a szemnek.
» Kontrasztok


A színek világában csak kevés szigorú szabály van, ezek egyike a vibráló színek (az élénk vörös és zöldeskék) elkerülése betűnek és hátterének. Ezek a színek csak akkor lehetnek egymás mellett, ha világossági és telítettségi paramétereik között jelentős különbség van, pl. a sötéttürkiz és rózsaszín már megfelelő.

Színes háttér és betű
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Tilos!
Színadatok: piros háttér: #FF0000; türkiz betű: #009CBF
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Megfelelő: rózsaszín és sötéttürkiz
Az előbbi színek világosabb ill. sötétebb árnyalatai !
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Megfelelő: egy szín sötét és világos árnyalatai

(Lorem ipsum)

Kellemes a sötétzöld háttéren a nagyon világos zöld, vagy a sötét- és világoskék, és számtalan megfelelő párosítás létezik.

Kerülendő a főszöveg alatt a színes vagy kontrasztos kép (alnyomat), mert ez is nehezíti az olvasást.

Alnyomat
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Nehezen olvasható


Inverz színek
Az inverz színek (fekete/sötét alapon fehér/világos betűk) bár a kontraszt ideális, mégis rosszabbul olvashatóak akár nyomtatásban, akár monitoron látjuk, ezt csak a megnövelt betűméret tudja ellensúlyozni.

Inverz színek
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Lassabban olvasható mint a fehér alapon fekete szöveg



Háttér színe


Ma egy tipográfus rengeteg színhez férhet hozzá a számítógépes szerkesztőprogramokon, –és ha nem elég biztos a tudása és ízlése– könnyen elcsábulhat, és képes élénk színű háttérre írni szöveget. Egy-egy cím, felirat, szlogen esetében ez jó lehet, de hosszú, összefüggő szöveget élénk színre írni még akkor sem szerencsés, ha különben a kontraszt megfelelő. Az erős színű háttér fárasztja a szemet, utóképet okoz, és –az olvasási gyakorlottság, az életkor, a látási körülmények függvényében– lassabban olvasható. A világos és tört színekre nem érvényes a tiltás, a halvány színek bármelyike jó, sőt nagyon kellemes háttérszín a sötétbetűs szöveg alatt.


Színes háttér
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
A nagyon élénk színű háttér fárasztja a szemet,
habár a kontraszt megfelelő


A színes, de kis telítettségű háttéren az élénk színű betűk jól olvashatóak, feltéve, hogy megfelelő közöttük a világossági kontraszt. A színes szöveg képe felkelti színasszociációinkat, jelentést tulajdonítunk a szöveg színének és (gondos tervezés esetén) kellemes benyomást kelthet. Az élénk színű betű nem okoz számottevő utókép-hatást, nem fixálódik, hiszen a szem olvasás közben mozog, és a betűk csak vékony vonalak.

Színes háttér és betű
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
világossárga: #FFF8CC; sötéttürkiz: #001155
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
világoszöld: #E0FFEE; lila: #440088
Jól olvasható, nem fárasztó, kellemes



Alapszínek a monitoron

Számítógépes környezetben gyakori hiba, hogy fekete (#000000) háttérre tiszta kék (#0000FF) betűvel írnak, gondolván, hogy a kék szín maximális fényerőre állítva elegendő kontrasztot ad. Sajnos ez nem így van, mert az RGB monitor legintenzívebb kékje meglehetősen sötét szín, alig emelkedik ki a fekete háttérből (11%-kal világosabb a feketénél), ráadásul a vékony kék vonalakat nehezen fókuszálja a szem. A piros (#FF0000) valamivel jobb, és a zöld (#00FF00), ami a legvilágosabb a három alapszín közül, már megfelelő.
» RGB alapszínek világossága , » Fényszínek intenzitása és világossága


A jelenség oka, hogy szemünk elsődlegesen a világosság-különbséget érzékeli, és nem a fizikailag mérhető fényerőt!

Fekete háttéren R,G,B alapszínek
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Megfelelően olvasható (zöld: #00FF00)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Nehezebben, de még olvasható (piros: #FF0000)
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ... .
Tilos! (kék: #0000FF)


Ha mindenképpen kék betűvel szeretnénk a fekete háttérre írni, akkor a kissé zöldes (cyan, türkiz-) kék vagy a világoskék megfelelő lehet.

Fekete háttár – kék betű
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Olvasható világoskék (#88AAFF) betű



Különböző színek egy szövegben

Mind a nyomtatott, mind az elektronikus anyagok tartalmazhatnak címet, szlogent, kiemelt szavakat. A hirdetésekben, címekben elfogadhatóak a kontrasztos, élénk színek, itt kevésbé szigorúak a színválasztás elvei. E szövegrészek a kép tartalmára hívják fel a figyelmet, kevés szóból állnak, ezért olvasásukat nem nehezíti a színesség.

A főszövegben egy-egy szó kiemelése színnel általában helyes, feltéve, hogy megfelelő a kontraszt:

Kiemelés színnel
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Fehér alapon, fekete betűk között a vörössel írt szó feltűnő,
a világoszöld nem, ez alig olvasható


Nem szerencsés egy szó betűinek különböző színeket adni, ahogy ezt laikusok szívesen teszik, pl. a „színes” szó írásánál. A különböző színek széttörik a szóképet, ezáltal sokkal nehezebben olvasható, és (enyhén szólva) esztétikai többletértéke sincs. Ez egyedül címek és nagy betűméret esetén elfogadható. Legalább ilyen helytelen egy összefüggő szövegben minden szónak különböző színt adni: ez a szövegképet töri szét, megnehezíti a mondat értelmezését, mert pl. a pirossal írt szót hangsúlyosabbnak vélhetjük, mint a barnát, a világosszürke betűk beleolvadnak a fehér háttérbe.

Színes szavak
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id ...
Kellemetlen, értelmetlen, nehezen olvasható, csúnya...


A különböző színű betűkkel írt szavak módosíthatják a szöveg tagolását és jelentését. János esztergomi érsek híres mondatának* kétféle értelmezését színekkel is elérhetjük.
*A Gertrudis ellen tervezett merénylet kapcsán, 1213-ban.
(
Reginam occidere)

A szín tagolja a mondatot és módosítja jelentését
A királynét megölni nem kell félnetek jó lesz
ha mindenki beleegyezik én nem ellenzem
A királynét megölni nem kell félnetek jó lesz
ha mindenki beleegyezik én nem
ellenzem

Felhasznált és ajánlott irodalom:

Carter:
Digital Color and Type

Color contrast

Designing Accessible Text

Do not harm

E-ink - Wikipedia

E-papír - Wikipedia

Feisner:
Colour

de Grandis:
Teoria e uso del colore

Leeuwen:
The Language of Colour, 92.p.

Leiszter (szerk.)
Webergonómia – Jakob Nielsen nyomán

Lorem ipsum – Wikipedia

Majoros:
Belsőtéri vizuális komfort

Reginam occidere – Wikipedia

The Legibility of a Font

Using Color in Information Display Graphics

Virágvölgyi:
A tipográfia mestersége – számítógéppel
Színes szöveg olvasása
« Vizualizáció
A színek nyelvi reprezentációja »
142.
Nem kereskedelmi oldal    |   Non-commercial website
Erről a weboldalról  |  Tartalom (Site map)  |  Magamról  |  Jogi nyilatkozat  |  Email  | 
Utolsó tartalmi frissülés: 2015.06.30.