דגשים בהנגשת אתר לפי ת״י 5568: מה ברמה A, ומה מוסיפה רמה AA
דגשים בהנגשת אתר לפי ת"י 5568 מתחלקים לשתי שכבות. שכבת A היא הבסיס: טקסט חלופי, כתוביות, מקלדת מלאה בלי מלכודות, לא להעביר מידע רק בצבע, אפשרות לעצור תוכן שזז, בלי הבהובים, דילוג על אזורים חוזרים ושפת עמוד. שכבת AA, שמחייבת בישראל, מוסיפה ניגודיות 4.5:1, הגדלה ל-200%, פוקוס נראה, שתי דרכים לנווט, שפה של קטעים, ועזרה בתיקון שגיאות בטפסים.
התקן הישראלי מבוסס על הנחיות WCAG 2.0, שמחולקות לשלוש רמות: A, AA ו-AAA. בישראל צריך לעמוד ברמה AA, כלומר בכל דרישות A ובכל דרישות AA. אני מפרט כאן את הדגשים שאני הכי הרבה בודק, ומה שכדאי לזכור בכל אחד.
דגשים בהנגשת אתר ברמה A: הבסיס
| דגש | מה זה אומר | סעיף ב-WCAG |
|---|---|---|
| טקסט חלופי | לכל תמונה ורכיב לא טקסטואלי יש חלופה שווה ערך | 1.1.1 |
| כתוביות | לסרטונים מוקלטים, כולל צלילים חשובים ולא רק דיבור | 1.2.2 |
| לא רק צבע | מידע לא מועבר רק בצבע, כמו "שדות החובה באדום" | 1.4.1 |
| מקלדת | אפשר להפעיל הכל במקלדת | 2.1.1 |
| בלי מלכודות | אפשר לצאת מכל רכיב במקלדת | 2.1.2 |
| עצירת תוכן זז | סליידר או תוכן מתחלף שרץ יותר מ-5 שניות צריך כפתור עצירה | 2.2.2 |
| הבהובים | לא יותר משלושה הבהובים בשנייה | 2.3.1 |
| דילוג על אזורים חוזרים | קישור "דלג לתוכן" או כותרות שמאפשרות לקפוץ | 2.4.1 |
| מטרת הקישור | ברור לאן הקישור מוביל, מהטקסט או מההקשר | 2.4.4 |
| שפת העמוד | מאפיין lang בכל עמוד | 3.1.1 |
דגשים בהנגשת אתר ברמה AA: מה שמחייב בישראל
| דגש | מה זה אומר | סעיף ב-WCAG |
|---|---|---|
| ניגודיות | 4.5:1 לטקסט רגיל, 3:1 לטקסט גדול | 1.4.3 |
| הגדלה | טקסט שאפשר להגדיל ל-200% בלי לאבד תוכן | 1.4.4 |
| טקסט בתמונות | לא להשתמש בתמונה של טקסט כשאפשר לכתוב טקסט | 1.4.5 |
| שתי דרכים לנווט | למשל תפריט וגם חיפוש או מפת אתר | 2.4.5 |
| כותרות ותוויות | כותרות ותוויות שמתארות את התוכן | 2.4.6 |
| פוקוס נראה | רואים תמיד איפה הפוקוס | 2.4.7 |
| שפה של קטעים | מילה או קטע בשפה אחרת מסומנים בשפה שלהם | 3.1.2 |
| ניווט עקבי | התפריט באותו מקום ובאותו סדר בכל העמודים | 3.2.3 |
| הצעה לתיקון שגיאה | כשהמשתמש טועה בטופס, אומרים לו איך לתקן | 3.3.3 |
רוצים לדעת באילו דגשים האתר שלכם נכשל?
נבדוק את האתר מול כל דרישות A ו-AA, ונמסור רשימה עם פתרון לכל ממצא.
3 דגשים שאני מוצא הכי הרבה
- פוקוס נראה (2.4.7). עיצובים רבים מבטלים את מסגרת הפוקוס כי היא "לא יפה". בלי מסגרת, מי שמשתמש במקלדת לא יודע איפה הוא.
- ניגודיות (1.4.3). אפור בהיר על לבן, טקסט על תמונות, וכפתורים בצבעי מותג.
- מקלדת ומלכודות (2.1.1, 2.1.2). תפריטים שנפתחים רק בעכבר, חלונות קופצים שאי אפשר לסגור.
ומה עם AAA?
רמה AAA לא מחייבת בישראל, וגם לא מומלץ לדרוש אותה מכל האתר. יש בה דרישות שאי אפשר לעמוד בהן בכל סוג תוכן. על ההבדלים בין הרמות, ומתי כדאי ללכת רחוק יותר, כתבתי בנפרד. אם תרצו להבין את ההנחיות עצמן, התחילו במה זה WCAG, ואחר כך בארבעת עקרונות הנגישות שעליהם הן בנויות.
שורה תחתונה
לא צריך לזכור את כל המספרים. צריך לזכור שכל דרישה כאן מתארת מישהו שמנסה להשתמש באתר שלכם ונתקע. בדיקה טובה עוברת על כולן, אחת אחת. רוצים שנעשה את זה לאתר שלכם? כל הפרטים בעמוד שירות הנגשת אתרים.
שאלות נפוצות על דגשי ההנגשה
באיזו רמה צריך להנגיש אתר בישראל?
ברמה AA לפי ת"י 5568, שמבוסס על WCAG 2.0. זה כולל את כל דרישות רמה A ואת כל דרישות רמה AA.
מה ההבדל בין רמה A ל-AA?
A הוא הבסיס: מקלדת, טקסט חלופי, כתוביות, לא רק צבע. AA מוסיפה ניגודיות, הגדלה, פוקוס נראה, שתי דרכי ניווט ועזרה בתיקון שגיאות.
מה הדגש הכי נפוץ שאתרים נכשלים בו?
פוקוס נראה, ניגודיות וניווט במקלדת. שלושתם מופיעים כמעט בכל בדיקה שאני עושה.
צריך לעמוד ברמה AAA?
לא. AAA לא מחייבת בישראל. אפשר ליישם ממנה דרישות מסוימות כשזה מתאים, אבל לא כחובה לכל האתר.
חושבים שהאתר שלכם חשוף?
אל תישארו עם התחושה. שלחו כתובת אתר ונחזור אליכם עם תמונת מצב ראשונית, בלי התחייבות.