קריטריון 2.4.10: כותרות מקטעים רמה AAA
בקצרה
קריטריון 2.4.10 כותרות מקטעים (Section Headings, רמה AAA) דורש שכאשר תוכן מחולק למקטעים, כל מקטע ינוהל עם כותרת מתאימה. כותרות מסייעות לניווט מהיר ולהבנת מבנה התוכן - בעיקר עבור משתמשי קורא מסך. קריטריון זה הוא רמה AAA ואינו נדרש לפי ת"י 5568.
פרטי הקריטריון
| מספר | 2.4.10 |
|---|---|
| שם | כותרות מקטעים (Section Headings) |
| רמה | AAA |
| גרסה | WCAG 2.0 |
| עיקרון | 2 - ניתן לתפעול (Operable) |
| הנחיה | 2.4 - ניווט |
| מחייב לפי ת"י 5568 | לא - רמה AAA, אינה נדרשת |
מה דורש קריטריון 2.4.10?
הקריטריון דורש שכאשר תוכן מאורגן במקטעים, כל מקטע יקבל כותרת המתארת את תוכנו. הכותרות מאפשרות לכל משתמש - ובמיוחד למשתמשי טכנולוגיה מסייעת - לסרוק את מבנה העמוד ולדלג ישירות למקטע הרלוונטי. חשוב להדגיש:
- הקריטריון חל רק כאשר התוכן מחולק למקטעים. עמוד עם תוכן קצר ורציף שאינו מחולק אינו חייב בכותרות.
- הכותרות חייבות להיות סמנטיות - כלומר, להשתמש בתגיות
<h1>עד<h6>ולא רק בטקסט מודגש או מעוצב. - הכותרות חייבות להיות תיאוריות ומועילות - לא כותרות סתמיות כמו "מקטע 1", אלא כותרות שמבהירות את תוכן המקטע.
- היררכיית הכותרות צריכה להיות לוגית: H1 לכותרת הראשית, H2 למקטעים ראשיים, H3 לתתי-מקטעים וכן הלאה.
למי זה עוזר?
בעיקר למשתמשי קורא מסך שמנווטים בין כותרות (למשל בלחיצה על מקש H ב-NVDA או ב-JAWS) ויכולים לדלג ישירות לחלק הרלוונטי. הקריטריון מסייע גם למשתמשים עם לקויות קוגניטיביות שנעזרים בכותרות להבנת מבנה הטקסט, וכן לכלל המשתמשים שמעיינים בעמוד ארוך ומחפשים מידע ספציפי.
איך עומדים בקריטריון?
- חלקו תוכן ארוך למקטעים לוגיים, ותנו לכל מקטע כותרת בתגיות HTML סמנטיות (
<h2>,<h3>וכו'). - הקפידו על היררכיה תקינה: אל תדלגו מ-H1 ל-H4 ללא H2 ו-H3 ביניהם.
- כותרת טובה מבהירה את תוכן המקטע - "שאלות נפוצות" עדיפה על "מידע נוסף".
- אל תשתמשו בטקסט מודגש או מוגדל כ"כותרת" חזותית בלבד - השתמשו בתגיות heading סמנטיות.
טיפ
מאמר זה עצמו הוא דוגמה ליישום: כל מקטע (מה דורש, למי עוזר, איך עומדים, איך בודקים, שאלות נפוצות) מלווה בכותרת H2 סמנטית, מה שמאפשר ניווט מהיר.
איך בודקים?
- בדיקה ידנית: קראו את העמוד וזהו מקטעי תוכן. ודאו שכל מקטע משמעותי מלווה בכותרת.
- קורא מסך (NVDA / VoiceOver): פתחו את רשימת הכותרות (ב-NVDA: Insert+F7) ובדקו אם הן משקפות את מבנה התוכן.
- כלי פיתוח: בדקו את מבנה ה-DOM ואמתו שהכותרות החזותיות ממומשות בתגיות
<h1>-<h6>ולא כ-<div>עם עיצוב בלבד. - כלים אוטומטיים (Lighthouse / axe): מזהים כותרות חסרות או היררכיה שגויה.
שאלות נפוצות
מה דורש קריטריון 2.4.10?
שכאשר תוכן מאורגן במקטעים, כל מקטע יהיה מלווה בכותרת. הכותרות מסייעות לניווט ולהבנת המבנה, ומאפשרות למשתמשי קורא מסך לדלג ישירות למקטע הרצוי.
מהי רמת הקריטריון 2.4.10?
רמה AAA - הרמה המתקדמת ביותר. הקריטריון נכלל ב-WCAG 2.0 אך אינו נדרש לפי ת"י 5568 (שמכסה עד רמה AA בלבד).
מה ההבדל בין קריטריון 2.4.10 לקריטריון 2.4.6?
קריטריון 2.4.6 (רמה AA) דורש שכאשר כותרות קיימות הן יהיו תיאוריות ומועילות. קריטריון 2.4.10 (רמה AAA) מרחיב את הדרישה: הוא דורש שתוכן מאורגן יחולק לכלל למקטעים עם כותרות - כלומר, הוא מחייב את קיום הכותרות, לא רק את איכותן.
מקורות
- W3C - Understanding SC 2.4.10 Section Headings (w3.org/WAI)
- W3C - How to Meet WCAG (Quick Reference) (w3.org/WAI/quickref)
צריכים לעמוד בקריטריון הזה באתר שלכם?
ראו את המדריך המעשי להטמעה, או בדקו את האתר מול הצ'ק-ליסט.
לצ'ק-ליסט הנגישות