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

כדאי לנסות להפוך את אפליקציית Android לשימושית לכולם, כולל אנשים עם צרכי נגישות.

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

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

הגדלת הנראות של הטקסט

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

  • אם הטקסט קטן מ-18sp, או אם הטקסט מודגש וקטן מ-14sp, צריך להשתמש בצבעים של חזית ורקע שיוצרים יחס ניגודיות צבעים של 4.5:1 לפחות.
  • לכל שאר הטקסטים, צריך להגדיר יחס ניגודיות של לפחות 3:1.

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

שתי דוגמאות למילה 'טקסט' על רקעים צבעוניים. בדוגמה שמימין יש ניגודיות מספקת בין צבע הטקסט לצבע הרקע, אבל בדוגמה שמשמאל הניגודיות נמוכה מדי.
איור 1. ניגודיות צבעים נמוכה מהמומלץ (משמאל) וניגודיות מספקת (מימין).

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

שימוש בפקדים גדולים ופשוטים

אם קל יותר לראות את אמצעי הבקרה בממשק המשתמש של האפליקציה ולהקיש עליהם, קל יותר להשתמש באפליקציה. בממשקי מגע, מומלץ שגודל האזור שניתן למיקוד או משטח המגע של כל רכיב בממשק המשתמש יהיה לפחות 48dp‎ x 48dp. ככל שהמסך גדול יותר, כך טוב יותר.

ב-Jetpack פיתוח נייטיב, הרבה רכיבי Material מובנים כמו Button,‏ IconButton ו-ListItem כבר אוכפים את הגודל המינימלי הזה. אבל כשיוצרים רכיבים אינטראקטיביים מותאמים אישית, צריך להגדיר את הגודל באופן ידני.

בדוגמה הבאה, רכיב קטן בממשק המשתמש הופך לנגיש על ידי מתן משטח מגע גדול יותר:

@Composable
private fun LargeBox() {
    var clicked by remember { mutableStateOf(false) }
    Box(
        Modifier
            .size(100.dp)
            .background(if (clicked) Color.DarkGray else Color.LightGray)
    ) {
        Box(
            Modifier
                .align(Alignment.Center)
                .clickable { clicked = !clicked }
                .background(Color.Black)
                .sizeIn(minWidth = 48.dp, minHeight = 48.dp)
        )
    }
}

מידע נוסף על גודל משטח המגע זמין במאמר בנושא גודל משטח המגע המינימלי.

תיאור של כל רכיב בממשק המשתמש

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

@Composable
private fun ShareButton(onClick: () -> Unit) {
    IconButton(onClick = onClick) {
        Icon(
            imageVector = Icons.Filled.Share,
            contentDescription = stringResource(R.string.label_share)
        )
    }
}

שימו לב: אין צורך לספק contentDescription עבור קומפוזיציות Text. שירותי הנגישות ב-Android (כמו TalkBack) מכריזים אוטומטית על הטקסט עצמו.

כשמוסיפים תיאורים לרכיבי ממשק המשתמש של האפליקציה, חשוב להקפיד על השיטות המומלצות הבאות:

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

  • חשוב להימנע מחזרות מיותרות בתיאורים. לדוגמה, אם לחיצה על לחצן גורמת לפעולת 'שליחה' באפליקציה, תיאור הלחצן צריך להיות "Submit" ולא "Submit button".

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

  • משתמשים ב-hideFromAccessibility API כדי לסמן רכיבים שהם רק קישוטיים, כדי ששירותי נגישות יוכלו להתעלם מהם. אם לרכיב בממשק המשתמש יש פרמטר contentDescription אבל הוא משמש רק כקישוט (לדוגמה, Icon שהוא חלק מרכיב אחר בממשק המשתמש), מעבירים את הערך null כדי להימנע מתוויות מיותרות. תרחישי שימוש מורכבים יותר מפורטים במאמר בנושא מיזוג וניקוי.

  • בודקים את הקוד כדי לוודא שתיאור התוכן מועבר כמצופה. ‫Android Lint, בדיקות Compose וכלי בדיקה ידניים ואוטומטיים יכולים לסמן בעיות נפוצות ולחשוף בעיות בהטמעה.

מקורות מידע נוספים

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

Codelabs

סרטונים

צפייה בתוכן