Table of Contents
- Installation of 3rd-Party Tools
- Tool Demonstration Videos
- Keyboard Navigation
- Keyboard Navigation (Mac)
- VoiceOver (Mac)
- Adobe Key Shortcuts
- Apple Zoom Key Shortcuts
- Screen Resolution Tester
Installation of 3rd-Party Tools
Several 3rd-party tools are required to complete the tests in Modules 1-4. Please review the tool implementation checklist for installation instructions.
Tool Demonstration Videos
The LEAP Training Series YouTube playlist contains short demonstration videos for some 3rd-party tools:
- Alt-text Assessment Using WAVE
- Colour Contrast Test Using WAVE
- Assessing Heading Structure Using WAVE
- Assessing Keyboard Navigation
- Non-extractable PDF Assessment
- Screen Reader Basics: NVDA
WAVE extension allows you to evaluate web content for accessibility issues directly within Chrome and Firefox. The extension can check intranet, password-protected, dynamically generated, or sensitive web pages.
Because the WAVE browser extension evaluates the rendered version of your page, locally displayed styles and dynamically-generated content from scripts or AJAX can be evaluated.
WAVE is a Google Chrome or Firefox extension. Once it has been downloaded, a small "W" button will appear in your Chrome or Firefox browser on the top right-hand corner.
- Navigate to an eresource you would like to test, login and select the appropriate page for testing (main page, results page etc)
- Click on the "W" extension button that appears in the top right-hand corner of your browser
- The best place to start with WAVE is by reviewing the results summary that appears on the left-hand side (see image on the left, below) and then selecting the “details” tab for more information (see image on the right, below). All accessibility errors, alerts, features, and structural elements found by the WAVE tool will be listed here under relevant subheadings.
- These elements will also be flagged/indicated on the webpage. Click on the icons listed in the “Details” sidebar to navigate to that element within the page (see image on the right, below).
- To exit the WAVE report, click the “W” extension button again
"The report section at the top of the WAVE sidebar indicates if WAVE detected any errors or not. The absence of errors DOES NOT mean your page is accessible or compliant. RED icons indicate accessibility errors that need to be fixed. GREEN icons indicate accessibility features - things that probably improve accessibility (though these should be verified). The other icons and indicators, particularly the yellow alert icons, highlight other elements that you should look at. WAVE brings the underlying accessibility information of a page to the fore-front so it can be easily evaluated in context."
Instructions for navigating through menus using keyboard navigation
- Note that you may wish to practice keyboard navigation skills before testing a specific database. A good page to test on is https://webaim.org so that you can get a feel for how keyboard navigation works on a page that is accessible.
- Initiate keyboard navigation by placing cursor in your browser's address bar and then follow the directions below.
- If a menu bar item has focus (usually a small border around the item will show that it has focus) and the menu is not open:
- Enter, Spacebar, and the up down arrow keys opens the menu and places focus on the first menu item in the opened menu or child menu bar.
- Left or right arrow keys moves focus to the adjacent menu bar item.
- When a menu is open and focus is on a menu item in that open menu:
- Enter or Spacebar invokes that menu action (which may be to open a submenu).
- Up or down arrow keys cycles focus through the items in that menu.
- Escape closes the open menu or submenu and returns focus to the parent menu item.
- If the menu item with focus has a submenu, pressing Enter, Spacebar, or the right arrow key opens the submenu and puts focus on the first submenu item.
- When a submenu is open and focus is on a menu item in that submenu:
- Up or down arrow keys cycle through the submenu items (behaves the same as open menu).
- Escape or the left arrow key closes the submenu and returns focus to the parent menu item.
- Typing a letter (printable character) key moves focus to the next instance of a visible node whose title begins with that printable letter.
- First item in menu bar should be in the tab order.
- Disabled menu items receive focus but have no action when enter or left/right arrow is pressed. It is important that the state of the menu item be clearly communicated to the user.
- Tabbing out of the menu component closes any open menus.
- With focus on a menu item and a sub menu opened via mouse behavior, pressing down arrow moves focus to the first item in the sub menu.
- With focus on a menu item and a sub menu opened via mouse behavior, pressing up arrow moves focus to the last item in the sub menu.
- With focus on a submenu item, the user must use arrows or the Escape key to progressively close submenus and move up to the parent menu item(s).
- At the top level, Escape key closes any sub menus and keeps focus at the top level menu.
There are three types of navigation systems which use drop down menus:
- Full tab, where the user tabs through the main navigation menu and all the drop-down options for each item.
- Tab and arrow, where a combination of tab and arrow keys can be used to move between items in the main navigation menu and the drop-downs
- Tab and enter, where the main navigation item is not a link and you can tab from main item to main item. When enter is selected on a main item the drop-down is presented and the tab key or arrow key is used to move between the choices.
To activate a choice within a drop-down menu, use the spacebar or enter key
To move out of the drop-down menu without activating a choice, hit the escape or tab key
Keyboard Navigation (Mac)
You will need to ensure that “Full Keyboard Access” is enabled. To do this, go to System Preferences > Keyboard > Shortcuts and check the “All Controls” check box.
These are basic instructions for accessing and navigating with NVDA. A comprehensive list can be found in the NVDA Keyboard Shortcuts document by Deque University:https://dequeuniversity.com/screenreaders/nvda-keyboard-shortcuts
- Control + Alt + N: Turn NVDA on
- Insert + Q: Turn NVDA off
- Control: Stop Reading
- Insert + Down arrow OR Numpad + : Start reading continuously from this point on
- Down Arrow: Read next item
- Tab: Read next focusable item (e.g. link, button)
- Enter: Activate Link
- Enter or Spacebar: Activate Button
If you have access to JAWS you can use these tests instead of NVDA
Please ensure your speakers are on or your headphones are plugged in. Once JAWS starts, you can minimize the JAWS window and open the PDF document you intend to test. JAWS will notify you if the PDF document is untagged.
The following JAWS keyboard shortcuts can be used to navigate your document
- Insert + Down Arrow: say all text
- Page up/Page down: Increase/decrease voice rate during say all reading
- Ctrl: Stop reading
- Up arrow/Down arrow: Prior line/next line
- Left/right arrow: Previous/next character OR Rewind/Fast forward during say all reading
- F5/Shift+F5: Page refresh/Hard refresh to start over
- Tab: Skips to the next link or form element
- Shift + Tab: Reverses to the previous link or form element
- H: Skips to the next heading
- N: Skips to the next non-link text
- T: Skips to the next table
- 1-6: skips to respective heading levels, H1 to H6
VoiceOver is a screen reader software which comes on any new Mac computers, iPads and iPhones. The following test is designed for desktop or laptop:
- Use Command + F5 to activate VoiceOver (laptop users may also need to select fn key to complete the activation) or access this feature via Home Button > System Preferences > Accessibility > VoiceOver; Remember that screen reader users generally rely on keyboard access only so this test should involve keyboard shortcuts rather than a mouse;
- Open your PDF article in preview, View PDF Display menu command. You have options between Single Page and Single Page Continuous, depending on how you would like to read.
- Navigate to the "scroll area" (CTRL+Option+right arrow repeatedly), then type CTRL+Option+A. If you're in Single Page mode, VoiceOver will read an entire page, then stop. To move to the next page, press Page Down (or fn-Down Arrow on a laptop), then repeat CTRL+Option+A.
- In Single Page Continuous mode, CTRL+Option+A will read the entire document. To pause in either mode, press Ctrl on its own. To restart, press Ctrl once more.
VoiceOver Key Shortcuts for Web Content
Feature accessible under home button: System Preferences > Accessibility > VoiceOver
- Ctrl + Option + A: Start reading
- Ctrl: Stop reading
- Ctrl + Option + Right arrow: Read next item
- Ctrl + Option + Left arrow: Read previous item
- Ctrl + Option + P: Read Paragraph
- Ctrl + Option + S: Read sentence
- Ctrl + Option + W: Read word (Press W multiple times to spell words alphabetically and phonetically)
- Ctrl + Option + B: Read from top to current location
- Ctrl + Option + Home: Jump to top of page (On laptop keyboards, fn + left arrow is Home)
- Ctrl + Option + End: Jump to bottom of page (On laptop keyboards, fn + right arrow is End)
- Ctrl + Option + Command + Left/right arrow: Select speech setting option (speaking rate, voice, pitch, etc)
- Ctrl + Option + Command + up/down arrow: To modify the selected speech setting
For a full list, please see https://help.apple.com/voiceover/mac/10.14/#/cpvokys01
Adobe Key Shortcuts
- Go to the next or previous page: Ctrl + Page down or Ctrl + Page up
- Go to the bottom or top of a document: Shift + Ctrl + Page down/page up
- Open preferences dialogue box: Ctrl + K
- Display document properties, including security settings and tagged status that affect accessibility: Ctrl + D
- Start accessibility quick check: Shift + Ctrl + 6
- Save to text: Alt + F and then V
- Start accessibility setup assistant: Alt + D and then T
- Place focus on document: F5
- Read This Page Only: Shift + Ctrl/Command + V
- Read To End of Document: Shift + Ctrl/Command + B
- Pause Reading: Shift + Ctrl/Command + C
- Stop Reading: Shift + Ctrl/Command + E
Further instructions with regard to using older or newer Acrobat versions for accessibility checks can be found in the following article:
Apple Zoom Key Shortcuts
- Access the Apple Zoom feature under the home button: System Preferences > Accessibility > Zoom
- Turn on zooming by selecting Command (⌘) + Option (⌥) + F5 and selecting options in the Zoom section.
- Zoom with keyboard shortcuts
- To zoom in, press Command (⌘) + Option (⌥) + Equal Sign (=)
- To zoom out, press Command (⌘) + Option (⌥) + Minus Sign (-)
Screen Resolution Tester
Note that the Chrome extension below no longer works. Please use one of these Screen Resolution Testers:
- Updated instructions will be provided shortly.
OLD INSTRUCTIONS:Once the Screen Resolution Tester Chrome extension has been downloaded it can be accessed by selecting the red heart icon that appears in your browser toolbar. This screen resolution tester will allow you to view websites in different screen resolutions. It uses a predefined list of screen resolutions. You can also enter a custom screen resolution and the browser will resize to that resolution.
Once this tool has been activated, you will see a list of available screen resolutions that can be selected. Choose several different screen sizes, including iPad, iPad landscape, and iPhone to determine how the content appears at various sizes. Pay particular attention to text and image clarity, whether meaningful order of the text is preserved, whether images or text overlap at any point, and whether overall reading experience is preserved.