גיליון תרמיות תפקידים של ARIA: הבחירות הטובות ביותר בהשוואה

גיליון תרמית לתפקידים של aria הוא רפרנס ל-ARIA עם רכיב HTML מקורי, קטגוריה (יישומון, נקודת ציון, מבנה, אזור חי או חלון) והמאפיינים והמצבים הנלווים אליו. WAI-ARIA 1.2 מגדיר 82 תפקידים. השוואה זו מרכזת את דפי העזר הטובים ביותר הזמינים ב-2026 ומסבירה באיזה מהם כדאי להשתמש בהתאם לזרימת העבודה שלך.

מדוע דף רמאות לתפקידי ARIA עדיין נחוץ

מפרטים כמו WAI-ARIA 1.2 ויורשתו WAI-ARIA 1.3 הם מסמכים דחוסים, המיועדים למפתחי דפדפנים וטכנולוגיות מסייעות, ולא למי שמעצב טופס ביום שלישי אחר הצהריים. הכלל הראשון של ARIA — להשתמש ב-HTML מקורי תמיד כשקיים כזה — פותר את מרבית המקרים, אך ישנם תבניות שאין להן מקבילה מקורית: לשוניות, עצים, רשתות אינטראקטיביות, תיבות שילוב עם השלמה אוטומטית ותפריטים עם תפריטי משנה. שם דף עזר חוסך זמן, ומעל לכל, מונע שגיאות.

הטעות הנפוצה ביותר אינה שכחת תפקיד, אלא הוספת תפקיד מיותר. אלמנט <button> עם role="button" אינו תורם דבר ועשוי לשבש את ההתנהגות המקורית בחלק מקוראי המסך. דף רמאות הוא רק הסבר מפורט של תפקידים מיותרים של בנים מיותרים, תפקידים שדורשים תנועה של ג’אווהסקריפט ושאילתות בנות חובה.

La segunda razón es la verificación. Los roles tienen relaciones de propiedad: aria-labeledby apunta a un id, aria-activedescendant exige que el elemento referenciado exista y sea visible, aria-owns solo se justifica cuando el orden del DOM no coincide con el orden visual. Una tabla que cruce roll, atributos requeridos y atributos prohibidos detecta fallos antes de que lleguen a una auditoría.

מה צריך לכלול דף רמאות טוב לתפקידי ARIA

Una hoja de referencia útil para desarrollo front-end cumple cinco criterios. Los listo porque son exactamente los que he usado para evaluar las opciones de esta comparativa.

• **סיקור של כל חמש קטגוריות התפקידים. **WAI-ARIA מקבץ תפקידים בסיכומים, ווידג’טים, מבנה מסמכים, ציוני דרך ואזורים חיים. סיכומים (roletype, widget, input) אינם בשימוש במסגרת; התייחסות טובה לנתוני צורה גלויים.
• מקבילה מקורית של HTML לתפקיד. ללא עמודה זו, ההפניה מבקשת להשתמש ב-ARIA שם מבלי לגעת.
• מאפיינים נדרשים, נתמכים ואסורים. role="checkbox" דורש aria-checked; role="heading" דורש aria-level; role="presentation" אסור.
• תבנית מקלדת נלווית. תפקיד ללא ניהול teclado הוא הבטחה כלולה. role="tablist" מרמז על אלמנטים שונים/דרשה, Home וEnd.
• פורמט ניתן לחיפוש. Buscador, סינון לפי קטגוריה, גרסת מפרט ויכולת להעתיק את קטע הקוד.

השוואה: דפי העזר הטובים ביותר לתפקידי ARIA ב-2026

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

קשורים: accessiBe — Superposición de IA que promete cumplimiento WCAG ב-48 שעות.

משאב	גישה	קטגוריות מכוסות	מקבילה מקורית	תבנית מקלדת	אידיאלי עבור
WAI-ARIA Authoring Practices Guide (APG), W3C	Patrones completos con ejemplos	ווידג’טים, ציוני דרך, אסטרוקטורה, אזורים חיים	Sí, en cada patrón	Sí, detallado	יישום יישומון קונקרטי
MDN Web Docs, התייחסות לתפקידים ARIA	Ficha por rol	Todas, incluidos abstractos	סי	פרטיל	Consultar un rol puntual
ARIA Authoring Practices, indice de roles	טבלה רול → תכונות	Widgets y estructura	פרטיל	לא	בדוק את התכונות הנדרשות
Deque University, ARIA הפניה	Fichas con notas de soporte	ווידג’טים וציוני דרך	סי	פרטיל	Conocer soporte real por lector
רשימת פרויקטים A11Y	Lista de verificación	רוחבי	אין אפליקה	לא	Auditar antes de publicar
HTML-ARIA (W3C), tabla de equivalencias	Rol permitido por elemento	כולן	Sí, es su propósito	לא	להחליט אם ARIA נחוץ

WAI-ARIA Authoring Practices Guide (APG)

La APG del W3C es la referencia canónica para patrones. מערכת ההגנה כוללת מבנה HTML, תפקידים, אסטרטגיות, אינטראקציית מידע ופונקציונליות. Su punto fuerte es que no se limita a listar תפקידים: explica el comportamiento esperado. Su punto débil es que no es una tabla rápida; para consultar «qué atributos lleva role="slider"» hay que navegar hasta el patrón correspondiente.

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

MDN Web Docs: la referencia por rol

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

שווה להסתכל: UserWay — Widget de accesibilidad עם תוכנית חינם עבור empezar hoy mismo.

פרקטיקה מפורטת: ה-MDN מרק התפקידים מיושנים או גרסאות עתידיות של חיסול. Consultar esa marca evita adoptar un roll que desaparecerá.

HTML-ARIA: la tabla que evita ARIA incesario

La especificación HTML-ARIA del W3C להגדיר, עבור קוד אלמנט HTML, מה תפקידים ARIA se le pueden aplicar y cuáles son redundantes. Es la herramienta decisiva cuando dudas entre usar un elemento nativo o un div con rol. Si el rol que quieres aplicar aparece como redundante para ese elemento, la respuesta es no añadirlo.

פרויקט Deque University y A11Y

Deque University ofrece fichas de roll con notas sobre soporte real en lectores de pantalla, algo que la especificación no cubre porque no es su cometido. רשימת הפרויקטים של A11Y אינה מהווה גיליון רמאות לתפקידים.

Cómo elegir según tu caso

La decisión depende de tres preguntas. Primero, ¿ya sabes qué rol necesitas? Si la respuesta es sí, MDN es la vía más corta. האם אתה יכול להבין את הווידג’ט עם השילוב? Entonces necesitas la APG, porque el roll por sí solo no describe el comportamiento de teclado. חוץ מזה, האם יש לך מקור HTML ו-ARIA? עיין ב-HTML-ARIA לפניות que cualquier otra fuente.

עבור אקוופוס que trabajan עם מסגרות XHTML ו-CSS, עבור שילוב נוסף יעיל: HTML-ARIA עבור החלטה, APG עבור יישום ו-MDN עבור תכונות אימות. דף רמאות דה una sola página sirve como memoria a corto plazo, pero no sustituye a estas tres fuentes cuando aparece un caso límite.

Un criterio adicional que conviene aplicar: si el rol requiere JavaScript para funcionar correctamente (התפקוד פונקציונלי, אקטואליזציה של אריה-מורחב, סינקרוניזציון של אריה-נבחר), trátalo como una decisión de arquitectura, no como decorativo un atributo. Los roles de widget sin la lógica asociada generan más barreras que la ausencia de rol.

קשורים: IAAP CPACC / WAS Certification — La certificación profesional que acredita tu experiencia en accesibilidad.

שגיאות תדירות que inguna cheat sheet evita por sí sola

Los roles de duplicados confunden la navegación por regiones. Un role="main" sobre un <main> es redundante; dos role="navigation" sin etiqueta distintiva son ambiguos. La solución es aria-label או aria-labeledby en cada ציון דרך חוזר.

Los rolls de widget sobre elementos no enfocables rompen la interacción. role="button" sobre un <div> exige tabindex="0" y manejo de Enter y Espacio. Sin eso, el roll anuncia un botón que no se puede activar con teclado.

מדינות שהופסקו הן הסיבה השכיחה ביותר לירידה בקהל. aria-expanded שאינו משתנה לפתיחת אקורד, aria-selected שאינו מתעדכן כאשר משתנה Pestaña או aria-checked בrole="switch" שהוא קבוע. Ninguna tabla lo detecta: hace falta probar con teclado y con una reader de la pantalla real.

שווה להסתכל: Deque axe DevTools Pro — El estándar de la industria para testear accesibilidad durante el desarrollo.

תפקידים מופשטים בשוק הם טעות עקרונית. role="widget", role="input" או role="section" אינם חייבים להופיע ב-HTML; קיימים לבד עבור ה-jerarquía של המפרט.

נקודות חשובות

• WAI-ARIA 1.2 מגדיר 82 תפקידים.
• La primera regla de ARIA —usar HTML nativo cuando exista— convierte la tabla HTML-ARIA del W3C en la referencia más importante antes de escribir cualquier roll.
• La APG del W3C הוא בלתי נסבל עבור פטרוני יישומון פורקה כולל אינטראקציית טכנולוגיה; MDN es más rápida para consultar un rol concreto.
• Un roll sin gestión de foco y sin actualización de estados genera más barreras de accesibilidad que no usar ARIA.
• Ninguna cheat sheet sustituye la prueba con teclado y con lector de pantalla: los estados desincronizados solo se detectan en uso real.

Preguntas frecuentes

¿Cuántos תפקידים ARIA קיים?

WAI-ARIA 1.2 מגדיר 82 תפקידים, קטגוריות שונות: תקצירים, יישומונים, מבנה תעודה, ציוני דרך ואזורים חיים. Los roles abstractos no se aplican nunca en el marcado; sirven para organizar la jerarquía de la especificación. En la práctica, un proyecto típico utiliza entre 15 ו 20 תפקידים שונים.

¿Cuál es la mejor cheat sheet de roles ARIA?

תלוי בשימוש. עבור יישומו של יישומון עם תוכנה, במדריך שיטות הכתיבה של WAI-ARIA של W3C הוא ההפניה המלאה. עבור יועץ לאריכות קונקרטיות, MDN Web Docs es meira rápida. Para decidir si un roll es necesario sobre un elemento HTML, la tabla HTML-ARIA del W3C es la fuente decisiva.

¿Debo משתמש ב-ARIA האם קיים מקור HTML?

לא. La primera regla de ARIA establece que si existe un elemento HTML con la semántica y el comportamiento que necesitas, se usa ese elemento en lugar de un div con rol. Añadir role="button" a un <button> es redundante y puede alterar el comportamiento nativo en algunos lectores de pantalla.

¿Qué diferencia hay entre un roll de widget y un roll de landmark?

תפקידי יישומון מתוארים פעולות אינטראקטיביות - כפתור, תיבת סימון, מחוון, טבליסט- ודרישות ניהול הפוקוס והטקלדו. Los roles de landmark described regiones de la página —main, navigation, banner, contentinfo— y sirven para la navegación por regiones. Un mismo elemento no debería cumplir ambas funciones.

¿Los roles ARIA cambian entre versiones de la especificación?

סִי. WAI-ARIA 1.2 תפקידים כמו blockquote, caption, code, מחיקה, emphasis, insertion, meter, paragraph, strong, subscript וסופר-script. תפקידי אלגונוס הם מיושנים בגרסה לאחור. התאמה ל-MDN o en la propia especificación si un roll siue vigente antes de adoptarlo.

¿איזה גיליון רמאות לתפקידים ARIA basta para cumplir WCAG?

מס’ תפקידים של ARIA בן פרט לקריטריונים 4.1.2 Nombre, roll y valor, pero WCAG 2.2 כולל עוד הרבה דרישות: ניגודיות, foco visible, תמונת אובייקט, טקסט אלטרנטיבי, מבנה הסברה. דף רמאות עזר לתיקון תפקידים, אין צורך בתקשורת.

מקורות וקריאה נוספת

• דף תרמית — ויקיפדיה: דף רמאות (גם דף רמאות) או דף עריסה או עזר לעבודה הוא קבוצה תמציתית של הערות המשמשות לעיון מהיר. גיליונות הונאה שימשו בעבר על ידי תלמידים ללא…