התלהבות יתר, טיפים קצרים, ותוצאות סקר בניית אקורדיון – אוסף קישורי נגישות

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

סטייל גייד (StyleGuide) לנגישות. יש שם הדגמה של אלמנטים נגישים: טפסים, כרטיסים (cards), ניווט, ועוד. הכל ברור וקריא וקצר. לגזור ולשמור.

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

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

מדוע, כיצד ומתי להשתמש ב-HTML סמנטי וב-ARIA. פוסט אורח ב-CSS Tricks. הוא מתחיל מטקסט, מראה למה כדאי לעטוף אותו ב-HTML סמנטי, מראה יתרונות נוספים ל-HTML הזה, ואיך לשפר את זה עם ARIA.  ומסיים באיך לשלב ARIA עם JavaScript.

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