Ce înseamnă acest criteriu?
WCAG 1.4.5 – Images of Text cere ca textul să fie prezentat ca text real (HTML, CSS), nu ca parte dintr-o imagine, cu excepția cazurilor în care imaginea este esențială (ex: logo-uri, diagrame care trebuie să arate într-un anumit fel).
Scopul este de a asigura că textul poate fi scalat, citit, personalizat și interpretat de tehnologii asistive.
De ce este important?
Textul real se poate mări, traduce, copia, interpreta de cititoare de ecran.
Imaginile de text (ex: texte în bannere sau butoane sub formă de JPG/PNG) sunt:
- greu de scalat,
- dificil de citit pe ecrane mici,
- complet inaccesibile pentru cititoare de ecran (dacă nu au alt),
- imposibil de personalizat (font, contrast, spațiere).
Criteriul promovează flexibilitatea vizuală și funcțională, permițând utilizatorilor să adapteze textul după nevoi.
Exemple de aplicare corectă:
- Incorect: Un banner care conține textul „Reduceri azi!” sub formă de imagine.
Corect: Textul este scris cu HTML/CSS peste un fundal decorativ. - Incorect: Un buton sub formă de imagine cu textul „Trimite”.
Corect: Se folosește un <button> cu text real și stilizare CSS. - Incorect: Un meniu de navigație compus din imagini cu texte în ele.
Corect: Meniul este realizat cu liste HTML și fonturi accesibile.
Ce greșeli apar frecvent?
- Se încarcă texte importante (titluri, butoane, oferte) sub formă de imagini pentru „efect vizual”.
- Se folosesc fonturi artistice inserate în imagini, în loc să fie stilizate prin CSS.
- Nu se oferă alternative textuale (alt) relevante pentru textul din imagine.
- Se combină texte în imagini fără contrast sau cu fonturi greu de citit.
Textul este conținut — și conținutul trebuie să fie accesibil, scalabil și controlabil. Criteriul 1.4.5 ne spune clar: nu încorpora text în imagine doar pentru că „arată bine”. Cu tehnologiile actuale, poți crea designuri spectaculoase fără să sacrifici accesibilitatea.
