Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Datatable paginator accesibility #1027

Open
Lb-lea opened this issue Nov 15, 2018 · 0 comments
Open

Datatable paginator accesibility #1027

Lb-lea opened this issue Nov 15, 2018 · 0 comments
Labels
dataTable Issues with the main Topic dataTable
Milestone

Comments

@Lb-lea
Copy link

Lb-lea commented Nov 15, 2018

Hello,
it seems that the datatbles paginator might not be full accesible to screen reader users. Indeed, there is no information on the current page and the links are not being recognized as a navigation tools.
Here is a fully accessible example of pagination/


<nav role="navigation" aria-label="Pagination">
    <ul>
        <li><a href="/page-1" aria-label="Current - Goto Page 1" aria-current="true" >1</a></li>
        <li><a href="/page-2" aria-label="Goto Page 2">2</a></li>
        <li><a href="/page-3" aria-label="Goto Page 3">3</a></li>
        <li><a href="/page-4" aria-label="Goto Page 4">4</a></li>
        <li><a href="/page-5" aria-label="Goto Page 5">5</a></li>
    </ul>
</nav>

I have also seen title used instead of aria-label but I don't know which is best.
The role of the nav seems to be optional as some example do not make use of it.
Some example used title or aria-label to indicate the current page, however it may cause issues with screen reader configured in any languages other than English. Thus, using aria-current seems to be the best option.

I know bootstrap datatable do not provide this functionality. It has led me to think that it might be a lot of work to implement for such a small issue.

I didn't have the time to answer the question about accessibility tools before the issue was closed last time.
I mostly chrome embedded accessibility audit function and firefox add-on https://wave.webaim.org/.
As for free screen reader I use orca on linux and nvda on windows.

Thank you for your hard work

@geopossachs geopossachs added the dataTable Issues with the main Topic dataTable label Nov 24, 2019
@geopossachs geopossachs modified the milestones: v2.0.0, v1.6.0 May 17, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
dataTable Issues with the main Topic dataTable
Projects
None yet
Development

No branches or pull requests

2 participants