תוכן שלא מופיע במסך מוסתר מפני טכנולוגיה מסייעת

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

איך מבצעים בדיקה ידנית

כדי לוודא שהתוכן מחוץ למסך מוסתר, עליך לבדוק ידנית את התוכן באמצעות קורא מסך. - למשתמשי Mac, מומלץ לצפות בסרטון הזה על שימוש ב-VoiceOver. - למשתמשי מחשב: מומלץ לצפות בסרטון הזה על שימוש ב-NVDA. - משתמשי Chromebook יכולים לנסות את ChromeVox, קורא המסך המובנה.

משתמשים במקש TAB כדי לעבור בין הדפים. קורא המסך לא אמור להכריז על תוכן מוסתר.

איך פותרים את הבעיה

כדי להסתיר תוכן שלא מופיע במסך, צריך להסיר את הרכיב שמכיל את התוכן הזה מסדר הכרטיסיות על ידי הגדרת הערך display: none או visibility: hidden.

לדוגמה:

.remove-me {
  visibility: hidden;
}
<button class="remove-me">Can't reach me with the TAB key!</button>

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

מקורות מידע

קוד המקור של תוכן שאינו מוצג במסך מוסתר מביקורת של טכנולוגיה מסייעת