A megfelelő betűtípus és megjelenítés kiválasztása: A Key to ADA Accessible Websites

A web olyan nyilvános hely, ahol mindenkinek egyenlő joga van a részvételhez, az információk eléréséhez, bemutatásához és lekérdezéséhez bármilyen fogyatékosság ellenére. Az amerikai fogyatékossággal élőkről szóló törvényt (ADA) azért fogadták el, hogy egyenlő esélyeket biztosítsanak a fogyatékossággal élő személyek számára. Bár akkoriban az internet még gyerekcipőben járt, a valóság ma már az, hogy ez az irányelv minden virtuális helyre vonatkozik, beleértve a digitális szolgáltatásokat és az online tartalmakat is.

A jogi és erkölcsi kötelezettségeik teljesítése érdekében minden szervezetnek és vállalkozásnak hozzáférhetővé kell tennie honlapjait és online csatornáit a fogyatékkal élők számára. Az akadálymentes weboldal kialakításának egyik alappillére a szöveges tartalom olvashatósága és olvashatósága. Ez csak hozzáférhető betűtípusok használatával érhető el.

Azért szerveztük ezt az útmutatót, hogy segítsünk olvasóinknak megválaszolni a következő kérdéseket: Mik azok a hozzáférhető betűtípusok, és melyik a legjobb betűtípus egy weboldalhoz? Olvasson tovább, hogy megismerje az ADA által jóváhagyott betűtípusok részleteit és jellemzőiket. Kitérünk néhány olyan jellemzőre is, amelyek ahhoz szükségesek, hogy egy webhely hozzáférhetővé váljon a látássérült, diszlexiás és olvasási zavarokkal küzdő emberek számára.

A betűtípuscsaládok áttekintése

A betűtípusok és a különböző betűtípuscsaládok fontos helyet foglalnak el a digitális tipográfiában. Egy betűtípuscsaládot olyan különböző betűtípusok halmaza alkot, amelyek a tervezési stílusokhoz kapcsolódóan hasonló jellemzőkkel és tulajdonságokkal rendelkeznek. Tulajdonságaik megértése segíthet a webtervezőknek abban, hogy a legjobban hozzáférhető betűtípusokat válasszák ki webhelyeikhez. Bár számos betűcsalád létezik, itt négyet sorolunk fel közülük, amelyeket a felhasználó a webböngészőben is beállíthat:

• Serif: A Serif betűtípusok a betű vagy szimbólum vonásának végén díszítésekkel vagy díszítésekkel rendelkeznek.
• Sans-Serif: A Sans a francia “nélkül” szó. A Sans-serif betűtípusok egyszerűbbek, és nincsenek meghosszabbított vonalak vagy díszítések a betűk vagy szimbólumok egyes vonásainak végén.
• Monospace: A monospace betűtípusoknál minden betű vagy szimbólum azonos szélességű. Ezeket fix szélességű vagy nem arányos betűtípusoknak is nevezik.
• Cursive: A kurzív betűtípusok a kézzel írt szavakra emlékeztető folyékonyan íródnak. Az egyes betűket össze lehet illeszteni, hogy művészi benyomást keltsenek.

Mértékegységek

A betűméretek meghatározására különböző mértékegységek léteznek:

• Ems (em): Ez az egység a HTML-oldalon a szülőelem méretéhez viszonyított betűméretet határozza meg. Például, ha a HTML-ben a szülőelem 14 px, akkor 2 em 28 px-et jelentene.
• Rems (ems gyök): A rem egységek használatakor minden betűtípus a HTML-ben lévő gyökérelem betűméretéhez képest kerül meghatározásra. Ezért a HTML-ben az összes szöveg egy alap betűtípushoz képest kerül meghatározásra, és nem függ attól, hogy a szöveg hol helyezkedik el a weboldalak HTML-hierarchiájában.
• Pixelek (px):
• Pontok (pt): A pontok szintén abszolút mértékegység. A WCAG CSS3 értékeket használ, ahol 1 pt 1,333 px. Ezért a 14pt és a 18pt 18,5px-nek, illetve 24px-nek felel meg.

Mitől lesz egy betűtípus hozzáférhetetlen?

Az ADA-kompatibilis betűtípusok listájáról azok a betűtípusok kerülnek ki, amelyek:

• Megnehezítik a szöveg olvasását
• Nehéz megkülönböztetni a különböző betűk és karakterek formáit
• Lassítják a felhasználó olvasási sebességét
• A betűk vagy karakterek átfedik egymást, ami megnehezíti az egyik betű megkülönböztetését a másiktól.

Ha egy betűtípus díszítésekkel van díszítve, nehezen olvashatóvá válik. Minden olyan betűtípus, amelynek a betűvonás végén díszítések vannak, egyes felhasználók számára nehezebben olvasható lehet. A kurzív vagy kézírás stílusú betűtípusok szintén hozzáférhetetlenné teszik a szöveget, ezért nem ezek a legjobb betűtípusok egy weboldalon.

Mi az elérhető betűtípus?

A weboldal tervezésekor az egyik legfontosabb szempont a megfelelő betűtípus kiválasztása és annak megjelenése. A weboldalak túlnyomó többsége sok szöveges tartalmat igényel, amelynek érzékelhetőnek és áttekinthetőnek kell lennie. Az akadálymentesített webhely kulcsa tehát a benne található szöveg olvashatósága, amelyet különböző betűtípusok és színek segítségével fejeznek ki.

Mely szabványos betűtípusok akadálymentesek?

A szakértők véleménye sajnos eltér a webes megjelenítés legolvashatóbb betűtípusáról, illetve arról, hogy melyik betűtípust érdemes használni, mivel a különböző felhasználóknak eltérő követelményrendszere van. A gyengén látó közönségnek például nagyobb szövegre lenne nagyobb szüksége. A gyengén látó, de tisztábban látó embereknek több karakterre lenne szükségük ahhoz, hogy a látómezőjükbe beférjenek, miközben a szöveg mérete kicsi maradjon. A diszlexiával vagy olvasási zavarokkal küzdő embereknek is megvannak a maguk igényei.

A legjobb, ha a webtervezők rugalmasságot biztosítanak, hogy a felhasználók maguk választhassák ki a betűtípusokat. Ha egy weboldal a webböngésző alapértelmezett betűtípusát használja, akkor az olvasónak nem kell minden alkalommal más betűtípusra váltania, amikor a weboldal betöltődik.

Míg nincs rögzített ADA betűméret követelmény, az ADA-konform, hozzáférhető betűtípusok világosak, tiszták és megkülönböztethetők, szemben a kurzív vagy kézírásos stílusokkal. Általánosan elfogadott, hogy a sans-serif betűtípusok könnyebben olvashatók és hozzáférhetőbbek, mint szerif betűtípusú társaik. Az ADA-kompatibilis betűtípusok listáján többek között az Arial, Calibri, Century Gothic, Helvetica, Tahoma és Verdana szerepel.

A hozzáférhető betűtípusok fontossága

A webes információk nagy részét szöveges tartalmakon keresztül közvetítik és terjesztik. A szöveg bemutatásának egyik módja a szöveg .png vagy .bmp formátumú képei. Ez azonban több okból sem járható út. Például a képek méretezésével romlik az olvashatóságuk. A képekben lévő szöveget a képernyőolvasók nem tudják felolvasni. Ezért egy weboldalon az összes szövegnek hozzáférhető betűtípusokból kell állnia, amelyek olvashatóak és megtekinthetőek.

A hozzáférhető betűtípusok használata egy hozzáférhető weboldal tervezésénél ma már nem csak ajánlás vagy opcionális funkció. Ez kötelező; ha egy weboldal megsérti az akadálymentesítési elveket, a tárhelyszolgáltató cég vagy vállalkozás súlyos büntetések, bírságok vagy perek kockázatát kockáztatja. Ez a bírság az első jogsértés esetén akár 75 000 dollár is lehet, a későbbi meg nem felelés esetén pedig még több.

A National Health Interview Survey (NHIS) adatai szerint becslések szerint 32,2 millió látássérült felnőtt van. Ebbe nemcsak a vakok tartoznak bele, hanem azok is, akik szemüveg viselése ellenére gyengén látnak. A CDC előrejelzése szerint ez a szám gyorsan növekszik az életkorral vagy betegséggel összefüggő látáskárosodások miatt.

A weboldalak tervezésekor azok a vállalatok és vállalkozások, amelyek a lakosság e nagyszámú kisebbségét szolgálják ki, természetesen szélesebb közönségnek örvendhetnek. Köztudott tény, hogy ha egy weboldalon nehezebben olvasható a szöveg, akkor annak kisebb lesz az olvasóközönsége, és kevesebb lesz az oldallátogatások száma. Ezért az ADA által jóváhagyott betűtípusok hozzáadása egy weboldalhoz a sikeres vállalkozás működtetésének alapvető szempontja.

Speciális betűtípusok

A Brit Diszlexia Szövetség (BDA) a következő fontos szempontokra hívja fel a figyelmet, amelyeket a honlapok tervezésekor és a diszlexiás egyének számára hozzáférhető betűtípusok kiválasztásakor szem előtt kell tartani:

• A kiválasztott betűtípust úgy kell kialakítani, hogy a felhasználók könnyen felismerjék a különböző betűk és számok közötti különbséget. Például az l (kis L), az 1 és az I (nagy i) egyformának tűnhet.
• A b és a d, valamint a p és a q betűk egymás tükörképei. A diszlexiás egyének nehezen tudnak különbséget tenni közöttük. A betűket úgy kell ábrázolni, hogy ne legyenek többé tükörképek.
• A BDA által megkérdezett személyek többsége a lekerekített “g”-t és a lekerekített “a”-t részesíti előnyben. Ezeknek a betűknek a lekerekítése azonban nem eredményezheti azt, hogy összetéveszthetők legyenek az “o”-val.
• A betűközöknek elegendőnek kell lenniük a különböző karakterek megkülönböztetéséhez, pl. az “rn” együtt összetéveszthető az “m” betűvel, így a “learn” összetéveszthető a “leam”-mal.

A diszlexiások számára speciális betűtípusokat terveztek, pl. a Dyslexie és az OpenDyslexic. Mindkét betűtípus szabadon hozzáférhető és ingyenesen letölthető. Ezek a legjobb betűtípusok közé tartoznak, amelyeket a diszlexiások számára készült weboldalakon lehet használni. Hasonlóképpen, az Fs Me betűtípus a tanulási fogyatékossággal élők számára készült, és az Egyesült Királyságban a tanulási fogyatékossággal élőkkel foglalkozó Mencap jótékonysági szervezet támogatja.

A webes tartalomhoz való hozzáférési irányelvek betartása

A webes tartalomhoz való hozzáférési irányelveket (WCAG) a World Wide Web Consortium (W3C) dolgozta ki és tette közzé. Ezek az ajánlások alkotják az akadálymentesített weboldalak és online tartalmak tervezésének széles körben elfogadott szabványát. Az Egyesült Államokban az 508. szakasz végleges szabálya közvetlenül előírja a WCAG betartását, legalább AA szintű megfeleléssel. Az ADA-val kapcsolatos perek esetében az Igazságügyi Minisztérium és az amerikai bíróságok gyakran hivatkoznak ezekre az iránymutatásokra a nyilvános webhelyek hozzáférhetőségének értékeléséhez.

A WCAG egyértelmű útmutatást ad a látássérült felhasználók számára hozzáférhető betűtípusokról, beleértve az olyan attribútumokat és tervezési jellemzőket, mint a szín, a kontraszt, a méret és a szöveg arányai. A szöveges tartalom elrendezésére és szerkezetére vonatkozóan is vannak ajánlások, amelyek olvashatóbbá és hozzáférhetőbbé teszik a weboldalakat. Elengedhetetlen, hogy ezeket a funkciókat beépítsük egy weboldalba a gyengén látó, diszlexiás, olvasási zavarokkal küzdő vagy más kognitív fogyatékossággal élő felhasználók számára.

Ez az útmutató a W3C különböző ajánlásait tárgyalja a legjobb betűtípusok kiválasztása a hozzáférhetőség érdekében, az ADA-konform betűtípusok karbantartása és azok fontos jellemzői.

A betűméret és az arányok: hagyjuk, hogy a felhasználó irányítsa őket

Szöveg írásakor a forma változik, és ez a nyelvtől is függ. Egyes ábécéformák bonyolultak, míg mások egyszerűbbek, és kisebb méretben is könnyebben olvashatók. Ez a fő oka annak, hogy a WCAG nem határoz meg minimális betűméretet. A következő fontos szempontokat kell figyelembe venni a legjobb betűtípusok kiválasztásakor az akadálymentesítéshez és a képernyőn való olvasáshoz:

• Betűméretek és mértékegységek: A WCAG szerint a betűméretet ems és rems használatával kell megadni, azaz az irányelv az abszolút mértékegységek helyett a relatív betűegységeket részesíti előnyben. A webtervezőknek kerülniük kell az alap betűméret beállítását a gyökérelemben. Ehelyett a böngésző alapértelmezett betűmérete használható, amely referenciapontként szolgálhat az összes többi betűméret meghatározásához. Ha a felhasználó megváltoztatja az alap betűméretet, akkor az egész oldal ennek megfelelően változik.
• Zoom funkció: A felhasználóknak rendelkezniük kell a betűméret felett, beleértve a szöveg 200%-ig történő nagyítását. A szövegnek olvashatónak kell maradnia nagyításkor is, anélkül, hogy túlzsúfolt vagy átfedések lennének. Ennek a nagyításnak segédtechnológia használata nélkül is lehetségesnek kell lennie, például egy egyszerű vezérlő, például egy csúszka hozzáadható a weboldalhoz a szövegméret növelésére vagy csökkentésére. Ennek a funkciónak minden eszközön elérhetőnek kell lennie, pl, mobil, asztali számítógép, táblagép stb.

Szövegtávolság: a betűmérethez viszonyítva legyen

A WCAG 2.1 a következő ajánlásokat tartalmazza a szövegtávolságra vonatkozóan:

• A sortávolság legalább a betűméret másfélszerese legyen.
• A bekezdés utáni térköz legalább a betűméret kétszerese legyen.
• A betűköznek legalább a betűméret 0,2-szeresének kell lennie.
• A szóköznek legalább a betűméret 0,16-szorosának kell lennie.

Sorszélesség: engedélyezze a szövegtörlést

A sorhossz mértékegységeként általában a karakterszámot használják. Bármilyen fogyatékosság ellenére az emberek nehezebben olvasnak hosszabb sorokat, mint rövidebbeket, mivel a sortörések lehetővé teszik a szemek pihenését. Végső soron a sorhossz nem haladhatja meg a 80 karaktert.

A kisebb látómezővel rendelkező emberek keskenyebb szövegterületet igényelnek, ahol könnyen kivehetik a sor végét és a következő sor elejét. Ezért a sorhossznak a felhasználó által szabályozhatónak kell lennie. Ha beállítják a nézetablakot, a szövegsoroknak automatikusan körbe kell tekeredniük és újra kell folyniuk, így a felhasználó vízszintes görgetés nélkül olvashatja a szöveget.

Kezdések: a bekezdések balra vagy jobbra igazítása

Minden webes tartalmat rövid bekezdésekbe kell strukturálni és szervezni, és kerülni kell a hosszú mondatokat. A bekezdéseket vagy balra vagy jobbra kell igazítani. Bár az igazított szöveg vizuálisan vonzóbbnak tűnhet, kerülni kell, mivel a sorokon belüli extra szóközök hozzáférhetetlenné teszik a szöveget. Ugyanez vonatkozik a középre állított bekezdésstílusokra is, amelyek megnehezíthetik az olvasó számára, hogy megtalálja a következő sor elejét.

A betűszín bölcs megközelítése

A színek hatékony használata fontos ahhoz, hogy értelmes információt közvetítsünk a felhasználónak. Például az űrlapok kötelező mezőit színkiemeléssel lehet jelölni, a hibákat piros színnel lehet megjeleníteni, a kék aláhúzott szöveg általában a hiperhivatkozásokat jelzi, és szürke színnel lehet jelezni a letiltott űrlapmezőket.

Noha a színek növelik a weblap esztétikai vonzerejét, ügyelni kell a gyenge színérzékelésű emberekre, akik esetleg nem tudják kivenni a színkülönbségeket. A WCAG 2.1 kimondja, hogy a színeken kívül alternatív vizuális jeleket kell használni a különböző jellemzők megkülönböztetésére.

A színek használata szorosan összefügg a kontrasztarányokkal. Az olvasható és hozzáférhető szöveghez elengedhetetlen a jó színkontraszt. A következő pontok fontosak, amikor a látássérült felhasználók számára hozzáférhető betűtípusokat vizsgáljuk:

• A színkontrasztnak lehetővé kell tennie, hogy az előtérben lévő szöveg megkülönböztethető legyen a háttértől. Nem lehet túl alacsony vagy túl erős.
• A szürke (#777777) szövegszín fehér háttéren az AA WCAG-szinthez szükséges minimum. Nagyobb szöveg esetén az 52 százalékos szürke (#828282) elfogadható.
• A fordított szöveget, vagyis a világos előtérszínt sötét háttéren megjelenő világos szövegszínt lehetőleg kerülni kell, mivel nehezebben olvasható.

Kontrasztarány: mindent tegyen megkülönböztethetővé

A WCAG 2.1 kontrasztarányra vonatkozó iránymutatásai az alábbiak:

1. 1. Címek: A szövegcímek és a nagyobb szövegek kontrasztaránya legalább 3:1 legyen. A 18 pontos vagy 14 pontos félkövér szöveg nagy szövegnek minősül, és meg kell felelnie ennek a követelménynek.
2. 2. Főszöveg: A főcímeken kívüli szöveg esetében legalább 4,5:1 kontrasztarányt kell fenntartani.
3. 3. Logó: A logó vagy márka részét képező szövegnek nincs kontraszt követelménye.
4. 4. Mellékszöveg: Az inaktív felhasználói felület részét képező, puszta dekoráció, láthatatlan vagy egy kép részét képező szöveg, amely nem közvetít értelmes információt, nincs kontrasztkövetelmény.

Az ajánlott kontrasztarány fenntartásának több ajánlott módja van. Ha például egy betű vagy szöveges szimbólum alul világosabb, akkor az sértheti az egész betű kontrasztarányát. Ebben az esetben a tervező vagy elsötétítheti a hátteret, vagy vékony fekete körvonalat adhat a betűhöz, hogy fenntartsa az előírt kontrasztarányt. Az előtérben lévő betűk vagy a háttér relatív fényereje is megváltoztatható a kívánt eredmény elérése érdekében. A kontrasztarány ellenőrzésére használható különböző eszközök a WCAG honlapján

Szöveg megjelenítése

A látássérült felhasználóknak szánt betűtípusok beépítése mellett a szöveg elrendezésére és szerkezetére is fontos figyelmet fordítani. Amikor a szöveg általános megjelenítéséről van szó egy weboldalon, a következő kulcsfontosságú pontokat kell követni:

• A dokumentumokat azonos betűtípussal vagy a lehető legkevesebb betűtípussal kell megírni. A több betűtípust tartalmazó oldal, még ha azok ADA-kompatibilis betűtípusok is, nehezebben olvasható.
• A HTML-címkéket, pl. <h1>, <h2> stb. a dokumentum szerkezetének és hierarchiájának közvetítésére kell használni, és nem szabad csak azért alkalmazni, mert egy bizonyos betűméretre volt szükség egy elem vizuális kiemeléséhez.
• Az animált és mozgó szöveget teljesen el kell kerülni.
• A szöveges tartalmat szöveges adatokon keresztül kell bemutatni, nem pedig képekkel vagy grafikákkal. A szöveg betűtípusai nagyításkor általában nem veszítenek olvashatóságukból és megőrzik minőségüket. A szöveges képek általában ellentétes viselkedést mutatnak, és nagyításkor romolhat a minőségük.
• A mondatvégi nagybetűket kell használni, és kerülni kell a kisbetűket.
• A vastag és dőlt betűket nem szabad kombinálni.
• A dőlt betűs szövegblokkok nem hozzáférhetőek és nehezebben olvashatóak.
• A szöveg aláhúzása kerülendő, kivéve, ha linkről van szó.

Következtetés

A digitális akadályok megszüntetése és az azonos internetes élmény biztosítása minden egyén számára, fogyatékossággal élők és nem fogyatékkal élők számára, minden vállalat és szervezet legfőbb prioritása kell, hogy legyen. Ennek elérése érdekében a WCAG értékes ajánlásokat ad a legjobb betűtípusok kiválasztásához egy weboldalhoz, amelyek minden felhasználó számára olvasható szöveget adnak vissza, beleértve a gyengén látókat, a diszlexiások vagy az olvasási zavarokkal küzdőket is.

A kevés ADA tapasztalattal rendelkező vagy azzal nem rendelkező vállalkozások szakértőkhöz fordulhatnak, amikor új weboldalakat terveznek és készítenek, vagy meglévő oldalaikat javítják. A webes tartalmak és online szolgáltatások hozzáférhetőségének biztosítása iránti proaktív hozzáállás segít elkerülni a súlyos pénzbírságokat és károkat.

Bölcs dolog olyan fejlesztőkből, tervezőkből és mérnökökből álló csapat segítségét igénybe venni, akik rendelkeznek az ADA és 508 szabványnak megfelelő weboldalak fejlesztéséhez szükséges szakértelemmel és tapasztalattal. Webes akadálymentesítési szolgáltatásaink részeként teljes körű csomagokat kínálunk a WCAG-szabványokon alapuló weboldalak fejlesztéséhez, a régebbi weboldalak helyreállításához, valamint rendszeres auditok elvégzéséhez a weboldal hozzáférhetőségének biztosítása érdekében.