Accessibility

Accessibility is the degree to which software is accessible to people with disabilities. Web Content Accessibility Guidelines (WCAG) 2.0 is a technical standard with the goal of providing a single, shared standard for web content accessibility. WCAG was developed by the Web Accessibility Initiative of the World Wide Web Consortium (W3C). The Geocortex Viewer for HTML5 2.10.1 adheres to WCAG 2.0.

Note that you should take care when customizing your Viewer to ensure that you do not inadvertently render it non-compliant with the WCAG 2.0 standard. For example, when using a WYSIWYG editor, bold font styling is usually applied with the <b> tag rather than the WCAG-compliant <strong> tag.

There are two aspects to accessibility support in the HTML5 Viewer that end users can use:

Screen readers and keyboard shortcuts can be used together.

Users are informed about these accessibility features by the configurable Accessibility window.

Screen Readers

Screen readers read user interface (UI) text aloud, so the user can listen to the page instead of seeing it. They do this by monitoring the position of the mouse pointer and reading the text where the pointer is positioned. It does not matter how the pointer is controlled—the user can navigate using a mouse, the keyboard, a sip-and-puff device, or any other type of navigation device.

Screen readers also provide contextual information for the text being read. For example, if the user navigates to the Sign in button, a screen reader might say "Sign in button"—"Sign in" is the text that the screen reader reads, and "button" is the context provided by the screen reader.

The context is essential. It is how the user knows what will happen when the item is activated—buttons perform an operation, hyperlinks navigate the browser, checkboxes select or clear a setting, and so on.

In order for a user to use a screen reader with an HTML5 Viewer, the user must have a screen reader installed and running when using the viewer. No additional steps are required. The HTML5 Viewer is tested using the Freedom Scientific JAWS screen reader but others may also work.

In the HTML5 Viewer, there are three pieces of information that are provided about the map:

To make the screen reader read out information about the map without changing the map extent, select the map with either the mouse or the Tab key.

Keyboard Shortcuts

Keyboard shortcuts allow end users to interact with the HTML5 Viewer using a keyboard instead of a mouse. The current UI component is highlighted with a border, which is dark purple by default.

Keyboard shortcuts do not interfere with or prevent the user from using the mouse—the user can go back and forth between keyboard shortcuts and the mouse. The only exception to this is when drawing a shape on the map for an identify, draw, or measure operation—the user cannot switch the type of device part way through drawing the shape.

Once you have selected a tool to draw a shape, to draw the shape with the keyboard, press Enter. If you draw the shape with the mouse instead, you will not be able to use the keyboard to create the shape. Note this only applies to when you first create the shape; when you edit a shape, you may use either the keyboard or the mouse.

Operations that use a freehand geometry cannot be done using the keyboard. This includes freehand identify and freehand draw operations.

Keyboard shortcuts provide a level of precision that a mouse does not. You can move or resize a shape by a single pixel using the keyboard.

General Keyboard Shortcuts

The HTML5 Viewer uses standard shortcuts to navigate the page and select or activate items.

General Keyboard Shortcuts for Accessibility

To do this...

Press...

With JAWS screen reader...

Navigate forward through the page's components

Tab 1, 2

Tab 1, 2

Navigate backward through the page's components

Shift+Tab

Shift+Tab

Select or activate the current UI component

Enter

Enter

Select checkbox, radio button, or toggle

Space Bar

Space Bar

Pan the map (if selected)

Arrow keys 3

Alt+Arrow keys 3

Move slider

Arrow keys

Alt+Arrow keys

Jump slider

Page Up; Page Down

Alt+Page Up; Alt+Page Down

Jump slider to the start or end

Home; End

Alt+Home; Alt+End

1 The initial tab operation in a new Viewer session opens the skip navigation links menu consisting of links to the Side Panel, Search, I want to..., Toolbar, and Map. Initial focus is on the Side Panel link, and subsequent tabbing traverses each of the items in the menu. Users can quickly return to the skip navigation links menu by clicking the address field in the Viewer and then tabbing to open the menu. Users can also return to the initial item in the skip navigation links menu by continuing to tab through the Viewer, or they can access the last link in the menu by tabbing back (SHIFT+TAB) through the Viewer.

2 In Chrome, you cannot tab between individual items in a radio group. You must tab to the group, and then use the arrow keys to change the selection.

3 If the Accessibility Module's expandedMapKeyboardAccessibility configuration property is false, the mouse pointer must hover over the map to pan with the arrow keys. By default, it is true.

HTML5 Viewer Keyboard Shortcuts

The HTML5 Viewer has its own shortcuts for working with shapes, including text markup. These shortcuts are used with tools that require the user to manipulate a shape on the map, specifically, identify, draw, measure and edit tools.

Some of the JAWS screen reader default keyboard shortcuts may override the Viewer's keyboard shortcuts listed in the following table. The user may need to remap the JAWS keyboard shortcuts to ensure that they function in the Viewer as indicated.

HTML5 Viewer Keyboard Shortcuts for Accessibility

To do this...

Press...

With JAWS screen reader...

Add a vertex to the shape that you are creating

Enter

Alt+Enter

Movethe selected vertex horizontally or vertically

Arrow keys

Alt+Arrow keys

Move the selected vertex diagonally

Page Up

Page Down

Home

End

Alt+Page Up

Alt+Page Down

Alt+Home

Alt+End

Move the selected shape horizontally or vertically

Arrow keys

Alt+Arrow keys

Move the selected shape diagonally

Page Up

Page Down

Home

End

Alt+Page Up

Alt+Page Down

Alt+Home

Alt+End

Enlarge the selected shape uniformly

S

Alt+S

Reduce the selected shape uniformly

Shift+S

Alt+Shift+S

Rotate the selected shape to the right

R

Alt+R

Rotate the selected shape to the left

Shift+R

Alt+Shift+R

Complete the shape

Enter, Enter 

(press Enter twice)

Alt+Enter, Alt+Enter

(press Alt+Enter twice)

Enter vertex editing mode

V

Alt+V

In vertex editing mode, select the next vertex of the current shape

V

Alt+V

In vertex editing mode, select the previous vertex of the current shape

Shift+V

 

 

Alt+Shift+V

Delete the selected vertex

D

Alt+D

Exit vertex editing mode

Enter

Alt+Enter

When the mouse pointer is over the map, enable snapping for the selected tool (Measure, Draw, Edit, Create New Feature, or non-dragging Identify tool)

F

Alt+F

For greater precision when moving, rotating or resizing a shape, hold down the Alt key while pressing the desired shortcut keys. For example, press Alt + Left Arrow to move the selected shape one pixel to the left.

Example 1 - Use the Keyboard to Measure Distance

  1. Press Tab as may times as needed to navigate to the Measure multitool.

  2. Press Enter to open the Measure multitool.

    The pointer is positioned on the Measure Distance tool.

  3. Press Enter to activate the Measure Distance tool.

  4. Press Enter to create the first vertex.

    Because you are drawing a line, the vertex is an end point.

  5. Use the arrow keys and diagonal movement keys to move the end point close to the desired position.

  6. Use the Alt key in combination with any other movement keys to move the end point to the precise position that you want.

    The Alt key restricts the movement to one pixel each key press.

  7. Press Enter to mark the position of the first end point and create the other end point.

  8. Move the end point to the desired position.

  9. Press Enter twice to mark the position of the second end point.

    This completes the measurement.

Example 2 - Use the Keyboard to Draw a Polygon

  1. Press Tab as may times as needed to navigate to the Draw multitool.

  2. Press Enter to open the Draw multitool.

  3. Press Tab as may times as needed to navigate to the Polygon tool.

  4. Press Enter to activate the Polygon tool.

  5. Press Enter to create the first vertex.

  6. Use the arrow keys and diagonal movement keys to move the vertex close to the desired position.

  7. Use the Alt key at the same time as any other movement keys to move the vertex to the precise position that you want.

    The Alt key restricts the movement to one pixel each key press.

  8. Press Enter to mark the position of the first vertex and create the next vertex.

  9. Move the vertex to the desired position.

  10. Continue adding and positioning vertices until there are no more vertices to add.

  11. Press Enter twice to close the polygon.

Example 3 - Use the Keyboard to Move, Rotate, or Resize a Shape

  1. Press Tab as many times as needed to navigate to the Edit tool.

  2. Press Enter to activate the Edit tool.

  3. Press Enter again to draw a point on the map.

  4. Move the point to the shape that you want to edit.

  5. Press Enter to select the shape that the point is on.

  6. Use the move, rotate, and resize keyboard shortcuts to modify the shape.

  7. Press Enter twice to finalize the shape's size and position.

See Also...

Accessibility Window

Accessibility Module

© 2018 Latitude Geographics Group Ltd. All Rights Reserved.

Documentation Version 4.9