Skip to content

Latest commit

 

History

History
20 lines (19 loc) · 4.2 KB

TESTING-WITH-AAC.md

File metadata and controls

20 lines (19 loc) · 4.2 KB
AAC # Checklist items How to check
AAC1 Can navigation to all interactive content occur when using the keyboard? Use Tab and Shift + Tab to navigate through links, buttons and form controls and press Enter to check for activation
AAC1 Can complex components be navigated using the arrow keys? e.g. expanding combo boxes, navigating Tabs Use arrow keys and spacebar to navigate through buttons and form controls
AAC1 Can a popup be opened and closed solely from the keyboard? 1. Use Tab and Shift + Tab to navigate to open and close popup
2. Use Enter or Escape to close the popup
AAC1 Can tooltips and hover content be triggered from the keyboard? Use Tab and Shift + Tab to navigate to open hover content
AAC2 Do tooltips (hover content) remain visible when I move the pointer over the tooltip? 1. Hover over an element that triggers additional content.
2. Move the pointer over the additional content. Check the additional content is still visible.
AAC3 Is the page title and website in the tab bar in some format? Look at the browser tab to see the title text in use
AAC4 When the Tab key is pressed is the keyboard focus clearly identified on all focusable elements? Use Tab and Shift + Tab to navigate through links, buttons and form controls
AAC5 Are <ol>,<ul> elements used for related collections of information such as links, or collections of items? 1. Right-click and select Inspect
2. Select the 1st item in a related collection and inspect the HTML, check for <ol> or <ul> elements
AAC5 Do prominent visual headings use heading elements such as <h1>, <h2> etc? 1. Right-click and select Inspect
2. Select a prominent visual heading and inspect the HTML, check for <h1>, <h2>, <h3>, <h4>, <h5>, <h6>
3. Check the headings are applied in sequence
AAC6 Does the screenreader announce each form control label? 1. Open NVDA
2. Use Tab and Shift + Tab to navigate through form controls
3. Check the form control label is announced by NVDA when focused on the form control
AAC6 Does the screenreader announce each form control error? 1. Open NVDA
2. Use Tab and Shift + Tab to navigate through form controls
3. Check the form control error is announced by NVDA when focused on the form control
AAC6 Does the screenreader announce a data format (if required)? 1. Open NVDA
2. Use Tab and Shift + Tab to navigate through form controls
3. Check the form control label data format (if one exists) is announced by NVDA when focused on the form control
AAC7 Whenever something significant has changed on the page, is it announced by the screen reader? e.g. search results displaying while searching, error summary displaying after activating the submit button. 1. Open NVDA
2. Use Tab and Shift + Tab to navigate through page controls
3. Trigger a significant change
4. Check the change is announced by NVDA and can be understood
AAC8 Is the core page content still viewable and navigable at 400% browser zoom? Change the browser zoom to 400%
AAC9 Do all descriptive <img> screenreader announcements have an ALT text description? 1. Right-click and select Inspect
2. Select an image (<img>) element and inspect the HTML, check an ALT attribute exists with sufficient text
AAC9 Do all descriptive <svg> screenreader announcements have an aria-label description? 1. Right-click and select Inspect
2. Select an image (<svg>) element and inspect the HTML, check an aria-label attribute exists with sufficient text
AAC10 Is the core page content still viewable and navigable in portrait and landscape orientation? 1. Right-click and select Inspect
2. Select Toggle device toolbar
3. Select Rotate