הנגשת אתרים – פרק שני – הנגשה ללקויות ראייה

בפרק הזה נדבר על הנגשת האתר לבעלי לקויות ראייה. מדובר על אנשים שצריכים התאמות שונות כדי שיוכלו לחוות את האתר באופן מיטבי.
את הפונקציונליות הנדרשת רוב תוספי הנגישות האוטומטיים מסוגלים לבצע מאחר ואלו הגדרות שמתבצעות באופן גנרי על כל הרכיבים. כלומר ההתנהגות של כל האלמנטים בעמוד אמורה להיות זהה פחות או יותר. (תוסף אוטומטי לא מסוגל לנחש מלל על וידאו כדי להוסיף בעצמו כיתוביות, אך כן מסוגל להגדיר באופן אחיד רקע שחור ופונט צהוב לכל הטקסטים).

בנוסף, שימו לב שכשגולש מגדיר לעצמו את אחת ההגדרות שדלקמן צריך להוסיף לו cookie או session שמגדיר שגולשים במצב המסוים, כדי שלא יהיה צורך מצד הגולש להגדיר בכל עמוד מחדש את ההגדרות שהגדיר פעם אחת באתר.

ניגודיות צבעים

ההתאמה הראשונה והבסיסית ביותר הינה צפיה באתר בניגודיות צבעים גבוהה. כלומר, שתהיה ניגודיות גבוהה בין צבע הרקע לצבע הטקסט שמעליו בכל מקום – בהיר על כהה ולהפך. ישנם כלים שיכולים לעזור לנו לדעת מה הניגודיות בכל מקום, ואם היא מספיקה.

ברוב המצבים דרישות העיצוב של האתר לא תואמים לניגודיות גבוהה, ולכן נוסיף כפתור להגדרת ניגודיות גבוהה. לחיצה על הכפתור תטען לנו למסך קובץ CSS ייעודי שכולל הגדרות ניגודיות גבוהה (בדר"כ נעשה שימוש בצבעים שחור לרקע וצהוב לטקסטים).

שימו לב:

  • יש לתת ניגודיות גבוהה לכל רכיב משמעותי. לדוגמה אם יש לנו כפתורי שיתוף שמוצגים כאייקונים באתר – יש לתת גם אותם בניגודיות גבוהה. אפשר לעשות זאת באמצעות FontAwesome או באמצעות תמונות ייעודיות. לחילופין ניתן להגדיר שבמצב ניגודיות גבוהה יראו טקסט במקום אייקון.
  • כשיש טקסט על תמונה – יש לתת רקע צבע אחיד (לדוגמה צבע שחור) מתחת לטקסט כדי שיוכלו לקרוא אותו.
  • הגדרה נוספת שקשורה לניגודיות צבעים – פוקוס על אלמנטים (נדבר על זה בפירוט רב יותר בפרק על ניווט מקלדת) צריך להיות בניגודיות גבוהה גם כן.

הגדלת פונט

כדי שבעלי לקות ראיה שלא מסוגלים לקרוא פונט קטן על המסך יוכלו לקרוא את הטקסטים באתר – יש לאפשר הגדלת (והקטנת) פונט באופן מדורג. כלומר כפתור להגדלת הפונט, ואם זה לא מספיק ניתן יהיה להגדיל עוד.

מה עוד?

ישנן הגדרות נוספות שככל הידוע לי אינן חובה, כמו מעבר עכבר על תמונה שנותן בגדול את הalt שלה, מעבר עכבר על קישורים שמוסיף טולטיפ עם הכיתוב שעליהם בגדול וכדו'. רוב התוספים האוטומטיים כאמור אמורים לדעת לבצע את זה.

 

בפרק הבא נדבר כבר על ניווט מקלדת וכל מה שקשור אליו. אם נקודות מסויימות לא ברורות או מדויקות לטעמכם – אשמח לשמוע ולעדכן את הפוסט.

בהצלחה רבה

כתוב/כתבי תגובה