SuperTables

Known limitations 

Navigation to pinned rows/columns 

Screen readers assume that the visual and DOM element order are identical. Specifically, when you pin a row/column, it causes elements to be rendered in different containers. This is why you cannot use screen readers to navigate into a pinned row/column cells, as in fact, this means they’re rendered in a different element from the rest of the columns/rows which are scrollable. 

Limitations announcing the correct column name in grouped columns 

Even though all aria tags have been applied to the necessary elements, some screen readers have trouble navigating the tags when the structure of the grid gets more complex (eg. grouped columns). This is the reason why there are some limitations announcing the correct column names. 

No announcements of state change of a grid cell or grid header 

Some screen readers will not recognize changes that happen to an element that is currently focused (including children of this element). So in order to detect changes (eg. sorted state, updated labels, etc…) you will need to move focus to another element and back. 

Check the Product Guide for more information.

Aria Rule: Bypass repeated blocks by setting role to “Main” 

Since web sites often display secondary, repeated content on multiple pages (such as navigation links, heading graphics, and advertising frames), keyboard-only users benefit from faster, more direct access to the primary content on a page. This reduces keystrokes and minimizes associated physical pain. Since SuperTables is just one page and there are navigation shortcuts to move around. This does not affect the accessibility of SuperTables. Check the Product Guide for more information.

ARIA Rule: configuration option to enable/disable Accessibility optimization for the grid 

You can use the “Enhanced accessibility option”, if you wish to optimize SuperTables for accessibility. It in general disables the column and row virtualization. Which in results generates all cells in the DOM thereby you will see considerable reduction in performance.  There may be 2 scenarios when you may wish to disable column virtualization (if you prefer). 

1) Auto-sizing of all columns. This will ensure that all columns, and not just the columns which are rendered on the screen, will be resized. 

2) Support for a11y. This is to prevent any potential issues for keyboard navigation and screen readers (https://www.a11yproject.com/). 

Check the Product Guide for more information.

ARIA Rule : A Main landmark should be available in the SuperTables structure

Screen reader users can use keyboard shortcuts to navigate directly to the first h1, which, in principle, should allow them to jump directly to the main content of the web page. If there is no h1 or if the h1 appears somewhere other than at the start of the main content, screen reader users must listen to more of the web page to understand its structure, wasting valuable time. To tackle this this issue we have added an invisible heading which will help the screen reader to easily recognize the SuperTables container. Check the Product Guide for more information.

Aria Rule: landmarks to element 

Navigating a web page is far simpler for screen reader users if the content splits between multiple high-level sections. Content outside of sections is difficult to find and the content’s purpose may be unclear. However, in this case, SuperTables stand as one single element instead of website where contents are spread of multiple sections. Check the Product Guide for more information.

ARIA Rule : For every column header ARIA parent role must be added. 

By default, SuperTables has column header’s role described as role=”columnheader” - element containing a column header. For all the members cells there is an ARIA-Describe By tag which explains where it belongs.  However, even though all aria tags have been applied to the necessary elements, some screen readers have trouble navigating the tags when the structure of the grid gets more complex (eg. grouped columns). This is the reason why there are some limitations announcing the correct column names. Check the Product Guide for more information.

ARIA Rule : Page must contain a level-one heading 

Generally, it is a best practice to ensure that the beginning of a pages main content starts with a h1 element, and to ensure that the page contains only one h1 element. However, ARIA Standards also mentions that in case if iframes, the heading can be an <h2> or <h3> so we have added an invisible heading, which tells the screen readers that it is the SuperTables container. Check the Product Guide for more information.