This test case describes the approach and methods used to test
keyboard navigation and keyboard functions in a web page displayed in
the Windows version of Firefox, using the JAWS screen reader. Be
sure to follow the test
case setup instructions before proceeding with this test case.
The following types of functions will be tested. You
can select the provided link for each to go directly to the
section.
Basic text navigation:
Arrow keys, Page Up and Down keys,
Home, End, and several other JAWS navigation keys.
The goal is to test is to verify that the Firefox Web browser
and the JAWS screen reader work together. The focus of
this test is Web content that is displayed in the Web browser. This Web
page file contains a number of common Web
page
elements. JAWS should read appropriate information for
all elements in this page, as described in this test case.
This test might uncover Firefox bugs or JAWS bugs.
Firefox bugs should be reported to the Mozilla.org bug tracking system.
JAWS bugs should be reported to Freedom Scientific.
It is impossible include every combination of web
page
elements here, but the techniques described here can be used when
testing other Web pages. This test case does not include
applets, plug-ins, or
multimedia
content. Testers are encouraged to find live Web sites
containing
those elements, and test them using JAWS also.
Note: The techniques discussed in in this test
case are specifically for JAWS and Firefox running on the
Microsoft Windows
operating system. Learning to use a screen reader such
as JAWS takes time and practice. This test
case attempts to help a novice use many JAWS
features relating to Web page navigation. Read the
JAWS Help pages and online manual for more information on how to
use JAWS.
Tools
required
This test case requires the use of the JAWS screen reader.
Information about JAWS can be found on the Freedom Scientific
Web site.
All of these files must be available for this test case. You
may
save them all in a file folder on your PC, or, if you have a
Web
server, they may all be stored in a single directory on the
Web
server.
win-webcontent-jaws.html (This is the file you
are reading right now.)
groovy-longdesc.html
groovyimg.jpg
imgmap2.jpg
Test
Case Instructions
Start JAWS.
Open this file with Firefox.
Use any method you prefer to open this file. For example,
with Firefox started, you can start the "Open file" dialog
by pressing Ctrl+O,
or by selecting "Open file" from the File menu bar pulldown.
With JAWS running, scroll down through this
file within the Firefox browser
and follow the instructions written in each section. Do not use the mouse during the
execution of this test case.
In the instructions, keystroke sequences are listed in bold
type. For example: H
means to press the "H" key on the keyboard, or Ctrl+H means to press and
hold the Ctrl
key, then press and release the H
key, then release the Ctrl
key.
Because Web pages are essentially "read-only", JAWS uses its
Virtual PC Cursor mode when reading Web pages. This mode
allows you to navigate the page in a way similar to navigating a word
processor document, using the Arrow keys to move forward and backward,
up and down.
If you are not familiar with JAWS cursor modes, see the JAWS
online documentation for more information.
Tip: You can press Insert+Z to toggle virtual
cursor mode on and off. If you have somehow turned virtual
cursor mode off, press Insert+Z to turn it back
on.
Please note:
Even though you are in "read-only" mode, you may still need
to interact with parts of a web page, in
text entry fields within a form, for example. In that case,
you will enter "Forms" mode by pressing the Enter key, temporarily
allowing keyboard input. See the section on testing forms in this test
case for more information.
JAWS provides a number of options that
govern how much or how little information JAWS will speak in
certain situations. To view the HTML options in the Configuration
Manager:
Open Configuration Manager by selecting it from
the Utilities menu in the JAWS application window.
(Or, press Insert+F2, then select
Configuration Manager from the Run JAWS Manager dialog.)
Press Ctrl+Shift+D to open the
default configuration file.
Select Set
Options and then HMTL
Options to view the HTML options dialog.
(Tip: to change options temporarily, for the current
session only, you can use the Adjust JAWS Verbosity dialog by pressing Insert+V instead of using
the Configuration Manager, above.)
These are the options to be used when running this test case.
All of these options are default settings, so you should not
need to set them manually. Even so, you should verify that
these options are set before running this test.
Text Page
Select "Indicate Block Quotations". (Selected
by default)
Graphics Page
Graphics verbosity: Select "Tagged graphics". (Selected
by default)
Graphics options: Select "Use Alt Attribute".
(Selected by default)
Links Page
Select "Say Link Type". (Selected by default)
Select "Identify Same Page Links". (Selected by default)
Text Link Options: Select "Use Screen Text". (Selected by
default)
Image Map Link Verbosity: Select "All Image Map Links".
(Selected by default)
Graphical Link Verbosity: Select "All Graphical Links".
(Selected by default)
Lists and Tables Page
Select "Indicate Lists". (Selected by default)
Headings and Frames Page
Headings Verbosity: Select "Headings with Level".
(Selected by default)
Select "Announce Frame Start and End".
(Selected by default)
Misc Page
Select "Speak Access Keys within Web Pages".
(Selected by default)
Form Field Prompts Options: Select "use
labels". (Selected by default)
Note: You can select additional verbosity options to
increase
the amount of information spoken by JAWS,
if you wish.
End of "Note about JAWS Configuration Manager HTML options"
JAWS provides a number of keystrokes to navigate Web
pages. This section describes many of those keystrokes, to be
tested with Firefox. Perform all of these keystrokes to verify that
they work with the Firefox browser.
Verify that each of the following JAWS
navigation functions works with as described while reading
this test case.
General
navigation keys
Perform each of the following keystrokes and verify
that JAWS performs the indicated action. These keystrokes can be
tested from anywhere within this test
case.
Left Arrow
and Right Arrow
- move left or right one character
Ctrl+Left and Ctrl+Right Arrow - move
left or right one word
Up Arrow
and Down Arrow
- move up or down one line
Insert+Up Arrow - read
current line
Insert+Down Arrow
- Say all: read from current position to end of page
Alt+Left Arrow
- Back a page
Backspace
- Back a page (same as
Alt+LeftArrow)
Alt+Right Arrow
- Forward a page
Alt+D - Move to
address bar (location or URL text field at top of browser window)
Insert+A - Read
address bar (without changing JAWS cursor)
Insert+A twice quickly -
Move JAWS
Cursor to address bar (same as Alt+D???)
Heading
navigation
Verbosity settings for headers (press Ins+V to view):
Element: Headings
use default settings: (select "Indicate Heading Level")
Perform the following keystrokes and verify that
JAWS performs the indicated action.
(Note that this file contains heading levels 3, 4, and 5.
The main section headings, including the title, are <h3>
headers, and some sections contain <h4> and
<h5> headers. As a test aid, sighted users can visually
recognize headers in this file by the light blue
background
stretching across the window from left to right. If you are
unsure if JAWS is
finding all legitimate header tags, view the page source for
the page to determine where html header tags are truly being
used.)
Insert+F6 - Display list of
headings on page
H
- Next heading
Shift+H - Previous heading
Alt+Insert+Home - First heading
Alt+Insert+End - Last heading
#
(1 through 6) -
Next heading of level #, where # is from 1 to 6. (This file contains
level 3, 4, and 5 headers.)
Shift+# (1
through 6) - Previous
heading
of level #, where # is from 1 to 6.
Paragraph
navigation
Perform the following keystrokes and verify that
JAWS performs the indicated action.
There are many paragraphs in this test case file (using
the html
<p> tags). To ensure that JAWS is navigating to
true html paragraphs, you can view the page source to
see where the paragraph tags are used.
P
- Next paragraph
Shift+P - Previous
paragraph
List
navigation
Verbosity settings for lists (press Ins+V to view):
Element: Lists
Use default settings (select "Insert Beginning / End
Message", "Indicate Bullets", "Read to End (Bullets))
Perform the following keystrokes and verify that
JAWS performs the indicated action.
There are many lists found in this file, including this list of
instructions.
Ctrl+Insert+L - Display list of
all ordered, unordered, and definition lists
L -
Next list
Shift+L - Previous list
I
- Next list item
Shift+I - Previous list
item
F8
- Select list (when pointing to beginning of list)
Quote/Blockquote
navigation -
using <q> or <blockquote> html
tags.
Verbosity settings for quotes / blockquotes (press Ins+V to view):
Element: Quotes / Block Quotes
Recommended settings: select "Insert
Beginning / End Message"
Perform the following keystrokes and verify that
JAWS performs the indicated action.
There are some quote and blockquote examples
provided below for use in testing these keystrokes.
Q
- Next quote or blockquote
Shift+Q - Previous quote
or blockquote
Quote and Blockquote examples for use in this test:
This
sentence is surrounded by the <q>
quote html tag.
And
this set of sentences is surrounded
by the <blockquote> tags, and is therefore set apart from
the surrounding text. You should be
able to use the above quote-related keystrokes
to navigate these two quoted test sections.
Access
Keys
An Access key is an attribute that can be associated with
various HTML tags. The access key is a single keyboard character.
When an access key is defined, Firefox allows you to press
Alt+Shift+specified character
to jump directly to the spot on the web page where the
access key was defined.
The following lines contain several access keys. Press the
indicated key combinations to jump to the indicated element. Verify the following
things:
Verify that the screen reader jumps to the indicated
destination, and speaks the proper information for the target element.
Verify that, after jumping to the target, the screen
reader proceeds from that point when continuing navigation. For example, if
you press "Alt+Shift+B" to jump to the first button, then press the Down
Arrow key, the screen reader should speak the line directly following
the button, and not retain its original focus from
before the execution of the access key.
Verify that when reading the elements that contain
access keys, JAWS announces that an access key is
available, and also speaks the alt+shift+letter combination of the access key.
The following access key combinations are provided below:
Alt+Shift+A
- access key attached to an ANCHOR tag (defining a text link).
Alt+Shift+B
- access key attached to a BUTTON tag.
Alt+Shift+C
- access key attached to an INPUT tag.
Alt+Shift+L
- access key attached to a LABEL tag.
Alt+Shift+T
- access key attached to a TEXTAREA tag.
Accesskey on button tag. Press
Alt+Shift+B
to jump to the following button.
Miscellaneous
navigation
Perform the following keystrokes and verify that JAWS
performs the indicated action. You may need to
view
the page source to ensure that JAWS is navigating to the proper
sections of the page.
S
- Move to next same element (same as the current element)
Shift+S - Previous same
element
D
- Move to next different element (different from current element)
Shift+D - Previous
different element
Shift+Period (.) - Move to
next element
Shift+Comma (,) - Previous
element
J
- Jump to line (then press line number, and Enter to complete
the jump)
Shift+J - Previous line
(return to pre-jump location on page)
Verbosity settings for links and images (press Ins+V to view):
Element: Links
Use default settings (select "Indicate Link Before",
"Identify Visited Links", "Read to End")
Element: Objects
Recommended settings: select "Include Type", "Expose
Alternative Text"
Element: LongDesc
Recommended settings: select "Indicate LongDesc"
JAWS provides keystrokes to navigate from one link to
another in the Web page. Perform the following keystrokes and
verify that
JAWS performs the indicated action.
Following the list of keystrokes to be tested, below, you will
find some sample link elements to be used in this test,
including a text link,
an image link, and an image map containing several links. (There are
many other links in this file that can be tested
using the JAWS link navigation keys also.)
(Note that the Tab
key will move to not only links, but also other controls, like
text entry fields and buttons. This section is concerned only
with moving between links.)
Shift+Tab
- move to previous link or control
V
- Next visited link
Shift+V - Previous visited
link
U
- Next unvisited link
Shift+U - Previous
unvisited link
Enter
- Activate Link at current cursor position (if on a link) Verify that
the JAWS focus moves to the target of the
link.
Enter
- Enter is also used by
JAWS to activate
link to "long description" file associated with a graphic image.
(Does
JAWS provide a way to view the longdesc if there is a link (href)
associated with the image?)
Ctrl+Enter - Open link in
new tab (Firefox tabbed browsing)
Shift+Enter - Open link in
new window
N
- Move to next non-link text
Shift+N - Previous
non-link text
A
- Move to next Anchor
Shift+A - Previous Anchor
Ctrl+Insert+A - Display list of
Anchors on page
G
- Move to next graphic
Shift+G - Previous graphic
Ctrl+Insert+G - Display list of
graphics on page
Link elements for use in Link testing
Verify that all of the JAWS keystrokes listed
above work properly with all of the following links.
The graphic image below is an image link that
links to the Link Navigation section header. It also has alternative text (alt)
defined.
Verify that JAWS speaks the
alternative text for the image, which is: "Groovy Image Link Button"
Verify that JAWS indicates that
a link is associated with the image.
With focus on the image button, verify that JAWS
provides a method of activating the link. You should
be able to press Enter to activate the link.
This is an image map that links to various sections of this
file. Each area of the image has alternative text which is
the same as the text on the image.
Verify that you can navigate to each of the buttons on
the image map.
Verify that JAWS reads the Alternative text for each
button (which is the same as the button text).
Verify that you can activate the links for the buttons
by pressing the Enter
key.
The graphic image below has a long description (longdesc)
attribute defined.
Verify that JAWS speaks the
alternative text for the image,
which is: "Groovy Image Link Button with long description"
Verify that JAWS indicates that
a long description is available for the image.
JAWS should prompt you to press Enter
to open the long description.
With focus on the image button, press Enter
to open the long description page. Verify that the long description
page is displayed and is announced by JAWS.
Return to this page when finished reading the
long description page.
Verbosity settings for JavaScripts (press Ins+V
to view). Note, there are no specific options for
JavaScripts,
but the Object settings may affect the way Window-Eyes reads certain
elements.
Element: Objects
Recommended settings: select "Include Type"
This section contains some simple JavaScripts.. Please feel
free to find other
more complex JavaScript examples on other Web
pages on the net, and test the ability to use
those JavaScripts in Firefox using JAWS.
Javascript:
Onkeypress alert
The JavaScript in this section is
activated by placing keyboard focus on the sentence that says "Activate
this JavaScript to cause onKeyPress alert", and pressing the Enter key. When
activated, the JavaScript will display an alert pop-up
message.
The goal of this section is to verify the following
things:
Verify that JAWS identifies the JavaScript as such,
letting the
user know that they can interact with the script.
Verify that JAWS will allow the user
to activate the
script.
Verify that JAWS will read the resulting alert
pop-up to let the
user know what has happened.
Verify that JAWS honors the "tabindex" property and
adds the Javascript text to its tab ring.
Navigate to the script, below, using these methods. (Go
through these steps twice, once for each method of
navigation!):
Verify that JAWS makes it clear that a
JavaScript has been
encountered when it reaches the script text.
Press the Tab
or Shift+Tab key to move
focus to the script text.
Verify that JAWS includes the script in its
tab ring. (The JavaScript text is surrounded by an anchor tag with the
"tabindex" attribute, which instructs the Web browser to add it to the
tab ring.)
With keyboard focus on the script
Press Enter
to activate the onkeypress event.
Verify that an alert box is displayed, with the
words
"You pressed enter".
Verify that JAWS reads the text that is
displayed in the pop-up.
Select "OK" to clear the alert box.
(If you click the mouse on the sentence, you will
activate the "onclick" event, and a different message will display.)
In this example, the pulldown list contains links to various sections
of this file. The Go button activates
the Javascript to jump to the selected destination.
Navigate to the script, below, using both of these
methods. (Go through these steps twice, once for each method of
navigation!):
When the pulldown list is read, verify that
JAWS makes it clear that it is a pulldown list.
When the Go button is read, verify that JAWS
says the words "Go" and "Button" to make it clear that it is a button,
and that the button text says
"Go".
Press the Arrow
keys or Tab
or Shift+Tab key to move
focus to the pulldown list.
Verify
that JAWS includes the pulldown list in its
tab ring.
Verify that JAWS includes the Go button in its
tab ring.
With keyboard focus on the pulldown list:
Press Down
Arrow to navigate through the list items in the pulldown
list.
Verify that JAWS reads the list items as you
arrow down through them.
Press Enter
to select an item from the list.
Press Tab
to move focus to the Go button.
Press Enter
to execute the Go function.
Verify that JAWS move focus to the selected
section, and starts reading from that point.
Javascript:
Popup current time
The following button will cause a popup window to display
the
time. It interacts with a continuously running JavaScript
that starts when this page is first loaded.
Make sure you are in Browse mode (press Ctrl+Shift+A to set).
Use the normal JAWS navigation keys to move to the
button below (use Arrow
keys)
Verify that JAWS tells you that it is a button,
and the button text says "Display the current time".
Press Enter
to activate the button.
Verify that a pop-up message is displayed, with the
current
time, and that JAWS reads all of the text in the pop-up dialog.
Press Enter
again to select the "OK" button to close the pop-up.
Verify that JAWS returns focus to the same spot as
before the pop-up was generated.
Verbosity settings for Forms (press Ins+V
to view).
Element: Forms
Recommended settings: select "Insert Beginning / End
Message (Forms)", "Insert Beginning / End Message (Fieldsets)"
Element: Objects
Recommended settings: select "Include Type"
JAWS provides keystrokes to navigate between form
elements. Use the following instructions to verify the
JAWS form navigation features are compatible with
Firefox.
Use the following form navigation keystrokes to navigate the
forms on this page. There are three forms in this file: one
in the JavaScript section, one in this section (directly after this
list, below), and the third form is in the section titled "Testing
Additional JAWS features". When testing the
JAWS keys that navigate within a single form, use the form in
the section below titled "Sample form for HTML form testing".
To use the form navigation keys listed below, Virtual PC
Cursor mode must be ON.
To allow keyboard input into the form, you must enter Forms
mode. (As described in the keystroke list below, you can
press Enter
to enter Forms mode.
Perform all of the keystrokes listed below
to navigate between controls within a
form.
Use these keystrokes to move from one form to another:
(Does JAWS have a way of doing this?)
F
- Next form
Shift+F - Previous form
Use the following keystrokes to navigate between controls
and fields in a form.
F
- Next form field
Shift+F - Previous form
field
Insert+Ctrl+Home - Move to first
form field
Insert+Ctrl+F - Move to last
form field
B
- Move to next button
Shift+B - Previous button
Ctrl+Insert+B - Display list of
buttons
C
- Next combo box
Shift+C - Previous combo
box
Ctrl+Insert+C - Display list of
combo boxes
E
- Move to next edit box
Shift+E - Previous edit box
Ctrl+Insert+E - Display list of
edit boxes
R
- Move to next radio button
Shift+R - Previous radio
button
Ctrl+Insert+R - Display list of
radio buttons
X
- Move to next check box
Shift+X - Previous check
box
Ctrl+Insert+X - Display list of
check boxes
Enter
- Enter Forms mode to allow keyboard input
Numpad Plus
(on full size keyboard) - Exit forms mode CapsLock+Semicolon (on
Laptop) - Exit forms mode
Insert+F5 - Display list of
form fields
Sample
Form for use in HTLM Form testing
The following form contains a variety of HTML form options.
Instructions are included for navigating the form fields and
controls.
Use the basic JAWS navigation keys (Arrow keys) to
listen to the table.
Verify that JAWS indicates that a form has been
encountered, and the controls (buttons, radio buttons, checkboxes, text
input fields) are announced as they are encountered.
The following keys are provided by
JAWS for frame navigation.
M - Next frame
Shift+M - Previous frame
Insert+F9 - Display list of
frames
Rather than implementing frames inside of this file, this test
will be done on a file containing example frames on the w3schools Web
site. You are encouraged to find other examples of Web pages
using Frames on the internet to test with JAWS also.
Verbosity settings for Tables (press Ins+V to view):
Element: Tables
Recommended settings: select "Insert Beginning /
End Message", "Include Table Summary", "Include Table Size", "Indicate
Row Grouping", "Indicate Merged Cells", "Header Attrib Override",
"Default Header to Column and Row", "Read to End".
Here
is a list of JAWS keystrokes provided for table navigation.
Verify the function of these keystrokes using the sample tables
below.
Table navigation
T
- Next table
Shift+T - Previous table
Ctrl+Alt+Right Arrow - Move
to and read next cell
Ctrl+Alt+Left Arrow - Move to
and read prior cell
Ctrl+Alt+Up Arrow - Move to
and read cell above
Ctrl+Alt+Down Arrow - Move to
and read cell below
Ctrl+Alt+Home - Move to and
read first cell
Ctrl+Alt+End - Move to and
read last cell
Ctrl+Alt+Numpad 5 (on full
size keyboard) - Read current cell ????
(what is this on a laptop?) - Read current cell
Windows Key+Down Arrow - Read
next row
Windows Key+Up Arrow - Read
prior row
Windows Key+Comma (,) - Read
current row
Insert+Shift+Home - Read from
beginning of row to current cell
Insert+Shift+Page Up - Read from
current cell to end of row
Windows Key+Period (.) - Read
current column
Insert+Shift+End - Read from top
of column to current cell
Insert+Shift+Page Down - Read
from current cell to bottom of column
Windows Key+J -
Jump to table cell (must also enter cell number)
Shift+Windows Key+J - Return to
previous cell
General Instructions for testing tables
Use the keystrokes listed above to navigate the following
tables.
Verify that all keystrokes work as described.
Verify that the table headers are announced as you change
rows or columns.
Verify that the table summary is announced
when the table is encountered by JAWS.
Table 1: Simple table using column and row headers
In this table, each cell in the first row is a column header,
and the first cell of each row is a row header. The table
uses the "scope=" attribute to instruct the screen reader that the row
and column headers are available. The table summary attribute
is as follows: "This table contains 3 columns, first a country name,
then the name of the capital city, then the name of the largest city."
Capital city and Largest city of select countries
Country
Capital
Largest City
Australia
Canberra
Sydney
Brazil
Brasilia
São Paulo
India
New Delhi
Mumbai
Morocco
Rabat
Casablanca
United States of America
Washington, D.C.
New York City
Table 2: Complex table with multiple column headers
In this table, each data column is associated with one row
header and two column headers. The table uses the "headings="
attribute to instruct the screen reader that multiple column headers
are available for each data cell. The table summary attribute
is as follows: "This complex table contains 4 columns, first a name,
then home phone number, cell phone number, and fax number."
The Mozilla.org Web site contains a number of
examples of
accessible DHTML elements. Rather than reproduce them here,
follow the links provided below to load those example pages.
Detailed instructions for testing these controls with
JAWS have not yet been written. For now, just verify
the following things while viewing the DHTML pages with JAWS
running:
Verify that you can
use
the JAWS text and link navigation techniques to read and access all of
the fields and controls on the DHTML
example pages.
Verify you can activate all of the controls that allow user
interaction with JAWS running..
There are many other keyboard functions provided
by JAWS. Here is a list of keys that should
be tested. View the JAWS documentation to see
more information about "Using the Internet with JAWS".
Miscellaneous navigation
Shift+Insert+F1 - Display element
information (for element with current focus)
Ctrl+Shift+Insert+F1 - Display
detailed element information (compare with IE output)
F5 - Reload web page
Ins+Esc - Refresh JAWS
virtual mode
F3
- JAWS Find next
Shift+F3 - JAWS Find
previous
Ctrl+K - Temporary place
marker
Ctrl+Shift+K - List, Goto, or
Modify place markers
K
- Move to next place marker
Shift+K - Move to previous
place marker
Insert+Ctrl+Enter - Activate
mouse-over
Copy/Paste keystrokes (a text entry field is
provided below
Ctrl+A - Select entire
page
Shift+Left Arrow
- Select character to left of pointer
Shift+Right Arrow
- Select character to right of pointer
Ctrl+Shift+Left Arrow
- Select word to left of pointer
Ctrl+Shift+Right Arrow - Select
word to right of pointer
Shift+Up Arrow - Select
line from current line position to same place on previous line
Shift+Down Arrow
- Select line from current line position to same place on next line
F8 - Select entire
element (such as a table or a list)
Ctrl+C - Copy selected
text to system clipboard
Ctrl+V - Paste text from
clipboard to current insertion point.
You may use the following text input area to test the paste
function, after copying text into the system clipboard. Remember that
you must enter Forms mode before you can enter text into
the field! (Press Enter
to enter Forms
mode.)
Firefox provides a feature called Caret Browsing,
where a user can navigate a Web page in a
way similar to navigating a document in a word processor. Visually, you
see an insertion caret (cursor) on the page,
and you can use the Arrow
keys to move up, down, left, and right, one line or
character at a time.
Note: Caret Browsing mode is not really needed when using a
screen
reader such as JAWS, since the screen reader provides similar
functions. However, because a user can potentially enter
caret browsing mode even when a screen reader is in use, some testing
of that scenario should be done. Failures in this area will not result in VPAT issues.
Follow these instructions to verify the basic functions of
Caret Browsing.
Press F7
to start Caret Browsing mode. Select the "Yes" button in the
resulting popup (if it displays) to complete the switch to Caret
Browsing mode.