back to CanAdapt home

Title

Testing tabindex=-1 on an iframe that has tab stops inside it.

Test 1: tabindex="-1" on iframe

The frame is below:

Test 2: Remove tabindex from iframe

Code Used

<h2>Test 1: tabindex=&quot;-1&quot; on iframe</h2>
<p>The frame is below:</p>
<iframe src="https://www.davidmacd.com" tabindex="-1" height="100px" width="200px"></iframe>


<h2>Test 2: Remove tabindex from iframe</h2>
<p>
<iframe src="https://www.davidmacd.com" height="100px" width="200px"></iframe>
</p>

Results

• In WIN10, IE with JAWS: tab enters iframe to access the links the same in both cases.
• JAWS with Firefox on WIN10: tab enters iframe the same in both cases.
• JAWS in Chrome: tab key jumps the ifrrame with tabindex=-1
• NVDA on Firefox: skips iframe tabindex=-1. Stops there but announces nothing
• VoiceOver in Safari: tab key skips over the iframe with tabindex=-1
• In OSx Safari and Chrome: tab key doesn't allow the user to enter the iframe with the tab key.

Comments

Only JAWS allows the user to tab into an iframe that has links, if the iframe has tabindex=-1. NVDA on Windows and VoiceOver on Safari do not stop on tabs inside an iframe if it has tabindex=-1. Therefore, don't use tabindex=-1 on an iframe that has tab stops inside it. iFrame behaviour is not uniform across screen readers, and browser tab stop behaviour. It's best for authors not to rely on them for large amounts of content. They are flakey in browsers/screeen reader support and have varied behaviour.