jtmako
asked on
Accessibility - is it ok to use tabindex on elements other than form fields?
Hi There,
I'm pretty new to Accessibility and I was doing some testing using NVDA screen reader. I noticed that the heading on my page, even though they were semantic, they were not picked up by the screen reader. I tried various means of getting them to work but I couldn't get them to work at all until I added the tabindex="0" attribute to the element. I'm just wondering if it's ok to use this? Or is there some other way to solve the issue?
<header class="clearfix" id="banner" aria-labelledby="product-h
<section class="col-sm-6 col-xs-12">
<h1 id="product-heading">this is my heading</h1>
<h2>Application form</h2>
</section>
</header>
I'm pretty new to Accessibility and I was doing some testing using NVDA screen reader. I noticed that the heading on my page, even though they were semantic, they were not picked up by the screen reader. I tried various means of getting them to work but I couldn't get them to work at all until I added the tabindex="0" attribute to the element. I'm just wondering if it's ok to use this? Or is there some other way to solve the issue?
<header class="clearfix" id="banner" aria-labelledby="product-h
<section class="col-sm-6 col-xs-12">
<h1 id="product-heading">this is my heading</h1>
<h2>Application form</h2>
</section>
</header>
>complaint from a user who expects the cursor to start from a form element
Would it help to use a media query to load a different version of the style sheet or at least a portion of the style sheet for this? Or media type?
Would it help to use a media query to load a different version of the style sheet or at least a portion of the style sheet for this? Or media type?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Hi All,
Thanks for the answers. In regards to the focus on a form element I can use tabindex="-1" and then set it using Javascript I believe.
Thanks for the answers. In regards to the focus on a form element I can use tabindex="-1" and then set it using Javascript I believe.
By default the cursor normaly positions at the first element the the user can interact with and if there is no interactive element the browser implementation is left to the browser manufacturer.
If using tabindex on the header makes the page more accessible, then by all means use it, even though you might occasionally get a complaint from a user who expects the cursor to start from a form element on clickable element.
Cd&