The HTML aria-colindextext attribute
The aria-colindextext attribute provides a human-readable alternative to aria-colindex, so a screen reader can announce "column Q1" instead of "column 2". It is an ARIA 1.3 feature with limited support.
Overview
The aria-colindextext attribute provides a human-readable text alternative for aria-colindex (ARIA 1.3).
It exposes table or grid structure to assistive technology. You generally only need it when you build a custom grid (role="grid") or when a native <table> cannot express the structure — for example a grid whose rows are virtualized and not all present in the DOM. A real <table> with <th> headers conveys most of this automatically.
Like all ARIA, aria-colindextext changes only the accessibility tree — what assistive technology perceives — never the element's behavior or appearance. The first rule of ARIA applies: if a native HTML element or attribute conveys this, use that instead, and only reach for ARIA when nothing native fits.
Syntax
<td role="gridcell" aria-colindex="2" aria-colindextext="Q1"> … </td>Values
| Value |
|---|
| A string. |
Example
<th role="columnheader" aria-colindex="2" aria-colindextext="Q1">Quarter 1</th>Best practices
- Follow the first rule of ARIA — use a native HTML element or attribute that conveys this where one exists, rather than adding ARIA.
- Use a native <table> with <th> headers where possible — it conveys most structure for free.
- Reach for these attributes on a custom grid, or when rows and columns are not all in the DOM.
- Keep the index and count values accurate as the grid changes.