Kontraszt és betűméret: miért nem tudják elolvasni a weboldalát a 45 év feletti ügyfelei

Kap olyan üzeneteket, hogy „nem találom a telefonszámukat” vagy „a telefonomon olvashatatlan”? Az ügyfeleinek nincs látásproblémájuk — az oldalának van olvashatósági problémája. És akik a legtöbbet panaszkodnak, azok általában 45 év felettiek, ami történetesen pontosan az a réteg, amelyik megtölti egy fogorvosi rendelő vagy egy ügyvédi iroda naptárát.

A jó hír: ez nem ízlés kérdése, hanem néhány konkrét szabályé, amelyeket saját maga is ellenőrizhet és kijavíthat. A világosszürke szöveg fehéren, a „hogy minden elférjen” zsugorított betűk, egy gomb, amelyet az ujja folyton elvét — mindegyik elfordítja pontosan azt az embert, aki éppen fel akarta hívni Önt. Nézzük meg lépésről lépésre, hogy miért történik ez, és mit lehet tenni.

Mi változik a szemben 40 után (és miért nem az ő hibájuk)

Nagyjából 40–45 éves kor körül a szemben lévő lencse merevebbé válik, és kevesebb fényt enged át. A jelenségnek orvosi neve is van, presbyopia (öregszeműség), és szinte mindenki megkapja — még azok is, akik soha nem viseltek szemüveget. Két dolog történik: a szem nagyobb erőfeszítéssel fókuszál közelre, és — ami egy weboldal szempontjából döntő — csökken a kontrasztérzékenység, vagyis nagyobbnak kell lennie a szöveg és a háttér közötti különbségnek ahhoz, hogy kényelmesen olvasható legyen.

A gyakorlatban az a szöveg, amelyet Ön 30 évesen könnyedén elolvas, az 55 éves ügyfelének szürke ködként jelenik meg. Nekik nem jobb szemüvegre van szükségük. Egy olyan oldalra van szükségük, amelyet arra építettek, ahogyan egy érett szem valójában működik — és ez az Ön kezében van, nem az övékében.

Kontraszt: a szabály, amelyet 30 másodperc alatt ellenőrizhet

Létezik egy világos, világszerte használt technikai szabvány, a WCAG. Ez legalább 4,5:1 kontrasztarányt ír elő a normál szöveghez, és 3:1-et a nagyméretű szöveghez. Nem kell megjegyeznie a számokat — csak azt kell tudnia, hogy ezek mérhetők, ingyen, bármelyik böngészős „contrast checker” eszközzel.

A nagy bűnös a világosszürke szöveg fehéren, az a #999 vagy #aaa árnyalat, amely „elegánsan mutat” egy tervező portfóliójában. Az Ön képernyőjén, árnyékban, kifinomultnak tűnik. Egy 55 éves szemnek, autóban, napsütésben, szinte láthatatlan. Ugyanennyire kockázatos:

• nagyon vékony betűtípusok (thin / light vastagságok)
• fehér szöveg világos fénykép felett
• halvány szürke a kritikus adatoknál, mint a nyitvatartás vagy a telefonszám

Egyszerű szabály: az az információ, amelytől egy foglalás függ — telefon, cím, gomb — legyen a legsötétebb, ne a legdiszkrétebb elem az oldalon.

A méret és a térköz ugyanolyan fontos, mint maga a betű

A jó kontraszt apró betűkkel még mindig olvashatatlan lesz. A folyószöveghez (bekezdések, elérhetőségek) ma egy ésszerű alap nagyjából 16px, a címsorok pedig nagyobbak. Ez alatt egy érett ügyfélnek közelebb kell hoznia a telefont, vagy nagyítania kell — és sokan egyszerűen feladják.

De nem csak a méret számít. Ami szintén sokat nyom a latban:

• a sorok közötti térköz (a nagyjából 1,5-ös sormagasság sokkal könnyebben követhetővé teszi a szöveget)
• a sorok, amelyek asztali gépen ne nyúljanak végig a teljes képernyő szélességén
• az ujjal is könnyen eltalálható, elég nagy gombok — a klasszikus ajánlás nagyjából 44px magasság

Az „prémium” hatás kedvéért összezsúfolt szöveg fárasztja a szemet. Az elemek közötti levegő nem elpazarolt hely; ez az, ami olvashatóvá teszi az oldalt.

A 2 perces teszt, amelyet most azonnal elvégezhet

A legtöbb probléma felderítéséhez nincs szüksége szakemberre. Csinálja meg a saját telefonján:

• Nyissa meg az oldalt a szabadban, nappali fényben, ne az irodában maxra vett fényerővel.
• Tartsa a telefont normál olvasási távolságban, anélkül hogy a szeméhez emelné, és anélkül hogy nagyítana.
• Vegye le a képernyő fényerejét körülbelül a felére — sok ügyfél valójában így látja.
• Kérjen meg egy szülőt, vagy egy 55 év feletti ügyfelet, hogy tíz másodperc alatt találja meg a telefonszámát.

Ha tétovázik, hunyorog, vagy közelebb hozza a telefont — megvan a válasz. Nincs szükség elméletre: a szeme közvetlenül megmondja, mi a baj. Jegyezze fel pontosan, hol akadt el; ott veszít időpontokat.

A tervezési csapdák, amelyek gyönyörűen néznek ki, de megölik az olvashatóságot

Sok oldal modernnek tűnik, és pontosan emiatt nem olvasható. Gyakori csapdák, különösen az „elegáns” hatásra vágyó rendelőknél és irodáknál:

• Szöveg fényképek vagy videó felett, alatta dedikált sötét réteg nélkül — csak a kép felén olvasható.
• Világos márkaszínek (arany, bézs, gyöngyszürke) közvetlenül a szövegen használva, nem csak a kiemeléseken.
• Rejtett menük és szavak nélküli ikonok — egy érett ügyfél a „Kapcsolat” szót keresi, nem egy szimbólumot.
• Animációk, amelyek mozgatják a szöveget, miközben az illető éppen olvasni próbálja.

Ez nem azt jelenti, hogy le kell mondania egy szép oldalról. Azt jelenti, hogy a szépség és az olvashatóság nem áll egymással szemben — a jó tervezés mindkettőt megoldja. A márkaszíne élhet a gombokban, a vonalakban és a háttereken, miközben a szöveg sötét és tiszta marad.

Hogyan kezeljük az olvashatóságot az MPO-nál

Az MPO Web Studio-nál a vállalkozása valódi ügyfeléből indulunk ki, nem egy bemutatóban szereplő szép sablonból. Egy érett ügyfélkörrel rendelkező rendelő vagy iroda esetében ez ellenőrzött kontrasztot, alapból elég nagy szöveget és elöl, jól látható elérhetőségeket jelent — nem menü alá temetve.

Az egész országban távolról dolgozunk, és először ingyenes demót építünk Önnek — egy oldalt, amelyet a saját telefonján megnézhet és tesztelhet, mielőtt bármit fizetne. Akár a fenti tesztet is elvégezheti rajta, egy 60 éves ügyfél mellett ülve. Az árazás átlátható, meglepetések nélkül.

Ha már most kap „nem látom” panaszokat, írjon nekünk WhatsApp-on a jelenlegi oldalának a címével — őszintén megmondjuk, mit lehet gyorsan javítani, és mit érdemes újraépíteni.