→ חזרה לבלוג

מה ההבדל בין רמה A ל-AA ב-WCAG?

אם התחלתם להתעניין בנגישות דיגיטלית, בוודאי נתקלתם במונחים כמו WCAG, רמה A, רמה AA, ורמה AAA. המונחים האלה יכולים להיות מבלבלים, אבל ההבנה שלהם היא קריטית - כי הם מגדירים בדיוק מה האתר שלכם צריך לעמוד בו כדי להיחשב נגיש על פי חוק.

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

מה זה WCAG?

WCAG ראשי תיבות של Web Content Accessibility Guidelines - הנחיות נגישות לתוכן אינטרנט. מדובר בתקן בינלאומי שפותח על ידי ארגון W3C (World Wide Web Consortium) ומגדיר כיצד תוכן אינטרנט צריך להיבנות כדי להיות נגיש לאנשים עם מוגבלויות.

הגרסה הנוכחית של התקן היא WCAG 2.1, שפורסמה ב-2018 ומרחיבה את WCAG 2.0 עם דרישות נוספות. גרסה 2.2 יצאה ב-2023 עם עוד תוספות, אבל רוב הרגולציה עדיין מתייחסת ל-2.1.

התקן מאורגן סביב ארבעה עקרונות בסיסיים, שידועים בראשי התיבות POUR:

• Perceivable (נתפס) - מידע ורכיבי ממשק חייבים להיות ניתנים לתפיסה על ידי המשתמש
• Operable (ניתן להפעלה) - רכיבי ממשק וניווט חייבים להיות ניתנים להפעלה
• Understandable (מובן) - מידע והפעלת ממשק חייבים להיות מובנים
• Robust (עמיד) - תוכן חייב להיות מספיק עמיד כדי שטכנולוגיה מסייעת תוכל לפרש אותו

תחת כל עיקרון יש הנחיות, ותחת כל הנחיה יש קריטריוני הצלחה (Success Criteria) - דרישות ספציפיות שניתן לבדוק אם האתר עומד בהן. לכל קריטריון יש רמה: A, AA, או AAA.

רמה A - המינימום הבסיסי

רמה A היא הרמה הנמוכה ביותר של תאימות ב-WCAG. היא כוללת את הדרישות הבסיסיות ביותר - הדברים שבלעדיהם האתר פשוט בלתי שמיש עבור אנשים עם מוגבלויות מסוימות. אתר שלא עומד ברמה A מהווה חסם מוחלט לנגישות.

דוגמאות לקריטריונים ברמה A:

• 1.1.1 תוכן לא-טקסטואלי: כל תוכן שאינו טקסט (תמונות, אייקונים, גרפיקה) חייב לכלול חלופה טקסטואלית שמשרתת את אותה מטרה. זה אומר alt text לתמונות, תוויות לאייקונים, ותיאורים לגרפים.
• 1.3.1 מידע ויחסים: מידע, מבנה, ויחסים שמועברים באמצעות הצגה ויזואלית חייבים להיות ניתנים לקביעה באופן תוכניתי. במילים פשוטות: אם משהו נראה ככותרת, הוא צריך להיות מסומן ככותרת בקוד.
• 2.1.1 מקלדת: כל הפונקציונליות חייבת להיות זמינה דרך ממשק מקלדת, ללא דרישה לתזמון מסוים בלחיצות.
• 2.4.1 דילוג על בלוקים: קיים מנגנון לדלג על בלוקים של תוכן שחוזרים על עצמם (כמו תפריט ניווט). זה מה שכפתור "דלג לתוכן העיקרי" עושה.
• 4.1.1 פירוק (Parsing): ב-HTML, אלמנטים חייבים לכלול תגיות פתיחה וסגירה מלאות, להיות מקוננים כראוי, ולא לכלול מאפיינים כפולים.

רמה A לבד לא מספיקה לעמידה בחוק הישראלי. היא מכסה רק את הבסיס - כמו לדרוש ממבנה שיהיו לו קירות, בלי לדרוש דלת כניסה נגישה.

רמה AA - הסטנדרט המשפטי

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

דוגמאות לקריטריונים ברמה AA (מעבר למה שנדרש ב-A):

• 1.4.3 ניגודיות (מינימום): הצגה ויזואלית של טקסט חייבת לכלול יחס ניגודיות של לפחות 4.5:1, למעט טקסט גדול (שם מספיק 3:1), טקסט דקורטיבי, ולוגואים.
• 1.4.4 שינוי גודל טקסט: טקסט חייב להיות ניתן להגדלה עד 200% ללא אובדן תוכן או פונקציונליות, ובלי צורך בגלילה אופקית.
• 1.4.5 תמונות של טקסט: אם אפשר להשיג את אותו אפקט ויזואלי עם טקסט אמיתי, אין להשתמש בתמונה של טקסט (למעט חריגים כמו לוגואים).
• 2.4.5 דרכי ניווט מרובות: יש לספק יותר מדרך אחת למצוא עמוד באתר - למשל, תפריט ניווט וגם חיפוש, או תפריט ניווט וגם מפת אתר.
• 2.4.7 פוקוס נראה: כל ממשק שמופעל באמצעות מקלדת חייב לכלול אינדיקציית פוקוס ויזואלית ברורה.
• 3.3.3 הצעת תיקון לשגיאה: אם מזוהה שגיאת קלט והצעות לתיקון ידועות, יש לספק את ההצעות למשתמש.

רמה AAA - השאיפה האולטימטיבית

רמה AAA היא הרמה הגבוהה ביותר של תאימות ב-WCAG. היא כוללת את כל דרישות A ו-AA ומוסיפה דרישות מחמירות במיוחד. חשוב לדעת: אף חקיקה בעולם לא דורשת רמה AAA עבור אתר שלם, כי חלק מהדרישות כמעט בלתי אפשריות ליישום באופן גורף.

דוגמאות לקריטריונים ברמה AAA:

• 1.4.6 ניגודיות (משופרת): יחס ניגודיות של לפחות 7:1 לטקסט רגיל ו-4.5:1 לטקסט גדול. זה יחס ניגודיות גבוה מאוד שמגביל מאוד את בחירת הצבעים.
• 1.4.8 הצגה ויזואלית: דרישות מפורטות לגבי רוחב שורה (לא יותר מ-80 תווים), ריווח שורות, ואי-שימוש ב-justified text.
• 2.2.3 ללא תזמון: תזמון אינו חלק חיוני מהפעילות - כלומר, אין מגבלת זמן כלל (לא רק אפשרות להאריך).
• 3.1.5 רמת קריאה: כשטקסט דורש רמת קריאה גבוהה מחטיבה עליונה (תיכון), יש לספק גרסה מופשטת.
• 3.1.6 הגייה: יש לספק מנגנון לזיהוי ההגייה הספציפית של מילים כשהמשמעות לא ברורה ללא הגייה.

למרות שרמה AAA אינה נדרשת בחוק, כדאי לשאוף ליישם כמה שיותר מהקריטריונים שלה - במיוחד כאלה שקל ליישם וששיפור חוויית המשתמש שלהם גבוה.

למה AA הוא הסטנדרט בישראל?

החוק הישראלי, באמצעות תקן ישראלי 5568, מאמץ את WCAG ברמה AA כסטנדרט המחייב. הסיבות לכך הן:

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

סטנדרט בינלאומי מקובל: רוב המדינות המפותחות - ארצות הברית (Section 508), האיחוד האירופי (EN 301 549), קנדה, אוסטרליה ועוד - כולן דורשות רמה AA. זה מקל על עסקים בינלאומיים ומאפשר שימוש בכלים ומשאבים גלובליים.

יישום ריאלי: בעוד שרמה A היא בסיסית מדי (ולא מספקת נגישות אמיתית), רמה AAA מחמירה מדי ולפעמים סותרת מגבלות עיצוביות ועסקיות. AA הוא האיזון הנכון.

בפועל, תקן 5568 כולל גם התאמות ספציפיות לעברית ולשוק הישראלי, כמו דרישות הקשורות לכיוון כתיבה RTL ולתמיכה בעברית בקוראי מסך.

דוגמאות מעשיות: ההבדל בין הרמות

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

ניגודיות צבעים

• רמה A: אין דרישת ניגודיות ספציפית (למעט הדרישה הכללית שמידע לא יועבר רק דרך צבע)
• רמה AA: יחס ניגודיות מינימלי של 4.5:1 לטקסט רגיל, 3:1 לטקסט גדול
• רמה AAA: יחס ניגודיות מינימלי של 7:1 לטקסט רגיל, 4.5:1 לטקסט גדול

כתוביות לווידאו

• רמה A: כתוביות נדרשות לתוכן שמוקלט מראש (pre-recorded)
• רמה AA: כתוביות נדרשות גם לתוכן חי (live)
• רמה AAA: נדרשת גם שפת סימנים לתוכן מוקלט

ניווט

• רמה A: דילוג על בלוקים חוזרים, כותרת עמוד תיאורית
• רמה AA: דרכי ניווט מרובות, פוקוס נראה, כותרות תיאוריות לסעיפים
• רמה AAA: מיקום המשתמש באתר ברור תמיד (breadcrumbs), מטרת כל קישור ברורה מהקשרו

איך מנגיש עוזר לעמוד ברמה AA?

מנגיש תוכנן מהיסוד כדי לעזור לאתרים לעמוד ברמה AA של WCAG. הנה כיצד:

ניגודיות צבעים: סרגל הנגישות של מנגיש מציע מצבי ניגודיות גבוהה, מצב כהה, ומצב מונוכרום - כולם עומדים ביחסי הניגודיות שרמה AA דורשת. השינויים מתבצעים ברמת CSS אמיתי, לא כשכבת Overlay.

שינוי גודל טקסט: מנגיש מאפשר הגדלת טקסט עד 200% ללא שבירת הפריסה - בדיוק כפי שקריטריון 1.4.4 דורש.

ניווט מקלדת: מנגיש מוסיף תמיכת מקלדת מלאה עם focus indicators ברורים, עומד בקריטריונים 2.1.1 (רמה A) ו-2.4.7 (רמה AA).

דילוג על בלוקים: מנגיש כולל כפתור "דלג לתוכן העיקרי" כנדרש בקריטריון 2.4.1.

סריקת AI (Pro): מנגיש Pro סורק את האתר מול קריטריוני AA ומזהה פערים - תמונות בלי alt, שדות בלי תוויות, בעיות ניגודיות, היררכיית כותרות שגויה, ועוד. הדוח כולל הנחיות מדויקות לתיקון.

סיכום: מה צריך לדעת?

הנה התמצית:

• רמה A - הבסיס. חובה, אבל לא מספיקה לבדה. 30 קריטריונים.
• רמה AA - הסטנדרט המשפטי בישראל ובעולם. כוללת את A ומוסיפה 20 קריטריונים נוספים. זו הרמה שאתם צריכים להשיג.
• רמה AAA - השאיפה. 28 קריטריונים נוספים. לא נדרשת בחוק, אבל כדאי ליישם כמה שאפשר.

העמידה ברמה AA אינה משימה בלתי אפשרית, במיוחד עם הכלים הנכונים. מנגיש מספק את הבסיס - סרגל נגישות שמבצע שינויים אמיתיים ב-CSS/HTML ועומד בדרישות AA. גרסת Pro מוסיפה סריקה אוטומטית שמזהה בעיות שהסרגל לא יכול לפתור לבד.

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

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