אייר

נגישות לעורכי תוכן, מוגבלויות בלתי נראות, ועוד קישורי נגישות

התגית הנכונה ל-HTML סמנטי – המאמר דן בחשיבות השימוש ב-HTML סמנטי ליצירת אתרים נגישים. Semantic HTML הוא תגי HTML המעבירים משמעות ומאפשרים לטכנולוגיה מסייעת, כגון קוראי מסך, להבין את מבנה דף האינטרנט. המאמר מספק דוגמה לאתר חדשות לא סמנטי ולאופן שבו קוראי מסך אינם מסוגלים לנווט בו. הוא גם דן בחשיבות של ציוני דרך ותפריטים וכיצד ניתן ליצור אותם באמצעות HTML סמנטי. השימוש בתג nav לסימון תפריטים ורשימות להוספת קישורים מודגש כשיטת עבודה מומלצת.

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

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

תמונות ומשתמשי קוראי מסך – פוסט קצר של קריס פרדיננדי שבו הוא מדבר על מאפיין ה-alt. המאפיין הזה משמש עם רכיבי img לספק טקסט תיאורי למשתמשים לקויי ראייה. חשוב לתאר את פרטי התמונה, ולא רק לציין מה היא. אין להשתמש בתכונת הכותרת כחלופה ל-alt, אלא כדי לספק מידע דמוי caption. עטיפת תמונה באלמנט figure והוספת figcaption היא לעתים קרובות אפשרות טובה יותר. לתמונות דקורטיביות בלבד, השתמשו במחרוזת ריקה למלל חלופי.

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

נגישות בלוגואים – Intuit הציבה את נושא הנגישות בראש עדיפויותיה, מתוך הכרה בכך שלפחות 2.2 מיליארד אנשים ברחבי העולם סובלים מליקוי ראייה או מוגבלות כלשהי. החברה מעצבת מתוך מחשבה על נגישות ויוצרת אפליקציות מעצימות לכולם. דוגמה אחת לעיצוב נגיש היא יצירת לוגואים נגישים במצב ניגודיות גבוהה עבור משתמשים עם ליקויי ראייה. בעוד שמצב ניגודיות גבוהה עשוי לפעול באופן שונה במערכות הפעלה ובדפדפנים שונים, השימוש ב- CanvasText במאפיין המילוי של סמל SVG מספק פתרון נגיש בכל מערכות ההפעלה ו/או הדפדפנים. Intuit התייחסה לנגישות במספר מאמרים ומקווה שחברות נוספות יצטרפו אליהם בבניית חוויה מכילה לכל האנשים.

איך להגדיר טקסט אלטרנטיבי לתמונה שמוצגת בטוויטר ופייסבוק, ולמה יתכן שזה לא משנה – המאמר דן ביישום טקסט חלופי עבור תצוגות מקדימות של קישורים במדיה חברתית באמצעות רכיבי מטא של כרטיסי Open Graph ו- Twitter. בעוד ששני התקנים תומכים בשימוש בטקסט חלופי, המאמר גילה כי טוויטר מעבד את תמונת התצוגה המקדימה ב- div עם תכונת aria-hidden, אשר מסירה את האלמנט ואת כל ילדיו מעץ הנגישות. משמעות הדבר היא שקוראי מסך לא יגלו את התמונה ולא את הטקסט החלופי שלה. בנוסף, נראה שפייסבוק משתמשת ב- og:title במקום ב- og:image:alt עבור הטקסט החלופי של התמונה. למרות ממצאים אלה, המחבר ימשיך ליישם og:image:alt ו- twitter:image:alt באתר שלו.

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

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

למה לדון על ניגודיות של אלמנטי UI לא טקסטואלים – המאמר דן בחשיבות של ניגודיות שאינה טקסט בעיצוב ממשק משתמש, המתייחסת להצגה חזותית של רכיבי ממשק משתמש בעלי יחס ניגודיות של לפחות 3:1 כנגד צבעים סמוכים ומהווה קריטריון הצלחה ברמה AA ב- WCAG 2.1. המאמר מציין שיש אנשים שמתלבטים אם רכיבי ממשק משתמש צריכים לעמוד בדרישה זו ומסביר את החריגים בהדרכה. עם זאת, המחבר מדגיש כי הדבר החשוב ביותר הוא לוודא שרכיבי ממשק משתמש שניתן לקיים עימם אינטראקציה או שמכילים מידע חיוני יהיו ניתנים לזיהוי לאנשים עם ראייה ירודה. המאמר דן גם בזיהוי רכיבי ממשק משתמש, בעיות במערכת התכנון ובאחריות צוותי מערכות התכנון. המחבר מסכם בהדגשה כי במקום להתווכח אם רכיב ממשק משתמש מסוים צריך לעמוד בדרישת הניגודיות שאינה טקסט, מעצבים צריכים פשוט ליישם אותה.

קורסים ללימוד איך להתחיל עם נגישות – שלל קורסים באתר של Trailhead.

התמונה מתוך Freepik

כתבו תגובה

כתובת הדוא"ל שלכם לא תוצג.