HTML and XHTML Techniques - Rendering an always visible skip link on top of every page

Submitter's Name: Devarshi
Submitter's Email: devarshipant@gmail.com

Technique ID: UNKNOWN
Short Name: Rendering an always visible skip link on top of every page
Technique Category: HTML and XHTML Techniques
Success Criterion Reference: UNKNOWN

Applicability:
Applicable to a page that displays a navigation menu on the top and content in the center  

UA Issues:
None

Description:
The objective of this technique is to allow users to direct the keyboard focus past repetitive navigation elements, by invoking the visible skip link. The visible skip link, which renders on top of every page, is the first element to receive focus.  Upon invoking the skip link, the focus shifts to a predetermined in-page target. 

Example 1 Head: Online Banking Page
Example 1 Description:
An online banking page features different sections; for example, Banner, Top Navigation Menu, Accounts Overview, Customer Service, Sidebar Navigation, Rewards Section, etc. The central section contains the account overview information below the 'Accounts Overview' header. When a user loads the page, and subsequently tabs, the first page element to receive focus is the “Skip to Accounts Overview” link. On invoking the “Skip to Accounts Overview” link, the focus shifts to the 'Accounts Overview' header. Tabbing again takes the user to the first focusable page element below the 'Accounts Overview' header.

Related Techniques:
G1
G123
G124

Test Procedure:
1. Start tabbing using only the keyboard.
2. Check, if the visible skip link is the first element to receive focus.
3. Check, if activating the visible skip link places the focus past repetitive links. 
4. Tabbing once, check, if the second element to receive focus is below the repetitive block.


Expected Result:
Checks #2, #3, and #4 above are correct

Additional Notes:
This should be a sufficient technique to meet SC 2.4.1

No guidelines reference was submitted!
No example 2 header was submitted!
No example 2 description was submitted!
No resource 1 title submitted!
No resource 1 URI submitted!
No resource 2 title submitted!
No resource 2 URI submitted!
No test file 1 was submitted!
No test file 1 pass/fail was submitted!
No test file 2 was submitted!
No test file 2 pass/fail was submitted!


------------------------------------------------

<technique id="UNKNOWN">
<short-name>Rendering an always visible skip link on top of every page</short-name>
<applies-to>
<guideline idref="" />
<success-criterion idref="UNKNOWN" />
</applies-to>

<applicability>
Applicable to a page that displays a navigation menu on the top and content in the center  
</applicability>
<ua_issues>
None
</ua_issues>
<description>
The objective of this technique is to allow users to direct the keyboard focus past repetitive navigation elements, by invoking the visible skip link. The visible skip link, which renders on top of every page, is the first element to receive focus.  Upon invoking the skip link, the focus shifts to a predetermined in-page target. 
</description>

<examples>
<ex_head_1>
Online Banking Page
</ex_head_1>
<ex_desc_1>
An online banking page features different sections; for example, Banner, Top Navigation Menu, Accounts Overview, Customer Service, Sidebar Navigation, Rewards Section, etc. The central section contains the account overview information below the &#039;Accounts Overview&#039; header. When a user loads the page, and subsequently tabs, the first page element to receive focus is the “Skip to Accounts Overview” link. On invoking the “Skip to Accounts Overview” link, the focus shifts to the &#039;Accounts Overview&#039; header. Tabbing again takes the user to the first focusable page element below the &#039;Accounts Overview&#039; header.
</ex_desc_1>
<ex_head_2>

</ex_head_2>
<ex_desc_2>

</ex_desc_2>
</examples>

<resources>
<resources_title1>

</resources_title1>
<resource_uri1>

</resource_uri1>
<resources_title2>

</resources_title2>
<resource_uri2>

</resource_uri2>
</resources>

<related_techniques>
<related_technique>
G1
</related_technique>
<related_technique>
G123
</related_technique>
<related_technique>
G124
</related_technique>
</related_techniques>

<tests>
<procedure>
1. Start tabbing using only the keyboard.
2. Check, if the visible skip link is the first element to receive focus.
3. Check, if activating the visible skip link places the focus past repetitive links. 
4. Tabbing once, check, if the second element to receive focus is below the repetitive block.

</procedure>
<expected_result>
Checks #2, #3, and #4 above are correct
</expected_result>
<test_file_1>

</test_file_1>
<pass_fail_1>

</pass_fail_1>
<test_file_2>

</test_file_2>
<pass_fail_2>

</pass_fail_2>
</tests>

</technique>

Additional Notes:

This should be a sufficient technique to meet SC 2.4.1

Received on Tuesday, 28 June 2011 12:39:10 UTC