Keyboard Interaction for AgileApps new UI Accessibility

From AgileApps Support Wiki
Revision as of 09:31, 25 February 2019 by imported>Aeric

This page provides information on all the accessibility features which are achieved using keyboard shortcuts.

Notepad.png

Note: Standard system keyboard commands are not covered in this section.

Accessibility Support

To use these accessibility features, you should have the following:

  • Firefox browser version 52 or later.
  • A screen reader software JAWS Freedom scientific version 17.0

Frequently Used Keys

Following are some of the keys that are commonly used for accessibility:

  • Tab and Shift+Tab - Press the Tab key to move forward to the next element on the user interface, and press Shift+Tab keys to go to the previous element.
  • Right arrow and Left arrow - Move from one item to the next in a radio-button group.
  • Spacebar - Select or de-select the checkbox or radio button that is currently in focus. Can also use to open a file.
  • Enter - Used for clicking a button or a link.
  • Esc - Close a pop-up window.
  • x - Close a toaster that is currently open (works only when there is a Toaster).
  • Backspace/Delete - Press to remove a chip (only works if there are some chips available. For example: - Record Level visibility, Notes Editor).

Interaction with Tables

When you navigate to a table, the initial focus is on the first cell of the first row of the table. If there is a clickable link on any cell, then you can use the tab key to highlight that link and press Enter to open the link. Use the tab key to move the focus between the cells and to move the focus outside the table. To interact with the table, you can use the following keys:

  • Up Arrow(↑) - Moves focus one cell Up.
  • Down Arrow(↓) - Moves focus one cell down.
  • Left Arrow(←) - Moves focus one cell towards left.
  • Right Arrow(→) - Moves focus one cell towards right.
  • Home - Moves focus to the first cell of the row that is currently in focus.
  • End - Moves focus to the last cell of the row that is currently in focus.
  • Ctrl+Home - Moves focus to the first cell of the first row of the table.
  • Ctrl+End - Moves focus to the last cell of the last row of the table.

Quick Access Keys

There are some quick access keys available within the application. These quick access keys are helpful in navigating from one area to another without any tab interaction. In a screen reader, sometimes these keys are not accessible. To make them accessible, press Insert+3 and then press the quick access key to access it.

Access the following quick access keys from the dashboard or the record list view pages:

  • ? - Displays all the quick access keys
  • q - Performs a quick search
  • c - Creates a new record
  • n - Jumps to primary navigation

Access the following quick keys in record details page:

  • m - Jumps to a secondary navigation.
  • ] - Collapses the secondary navigation details panel.
  • s - Saves the current record.

Keyboard Interaction

This sections covers the information about the keyboard interaction with various pages within the application.

Overview Page

Overview page is the home page and is the start page of the application that appears after you log in. It is also accessible by clicking the Home button from the left navigation menu.

It shows all the applications available for a tenant. After you tab out from the left navigation panel, the focus shifts first to the search box. Here, you can type an application name to search. Next to the search box, there is a filter button where you can click and filter the result. These filter items can be accessed using the arrow-up and arrow-down keys. After you click a filter item, the focus returns to the Home button. You can tab out to move through the application names. Click the link to the application name and a confirmation dialog appears. In the Confirmation dialog, the focus is first on the Cancel button. By clicking the OK button, it changes the application.

Record View Page

The Record View list page is available for all objects. Click an object from the left navigation panel, and you are redirected to the object list view page.

  • The initial focus of the Record List view is on the default view.
  • To change the view, you have to use the left and right arrow keys to navigate between the views and then click to select a view.
  • If you tab out from the view section, it will focus to first cell of the first row of the table. Then you can use the keys to interact with the table. Refer to the section Table interaction for interacting with tables.
  • If there is no record present, then you will not see any table.
  • On the top of the view page, there is an Action button. After clicking the action button, you can access the action items using the arrow up and arrow down keys.
  • For a case, case type and tasks object, there is another action button present in the last cell of each row in the table. You can move the focus on this Action button using the tab keys and then press space bar to open the menu. Use the up and down arrow keys to traverse those actions.
  • For case, case type and tasks object, you have a check box at the first cell for each row. When the focus is on this check box, press the space bar to select the check box for that row or if already selected you can deselect the checkbox by pressing the space bar. The action you select from the top action menu becomes applicable on all the rows selected.
  • List view shows 25 records at a time. If a view has more that 25 records, then you can access these records by moving the focus over the pagination button available at the right-hand bottom corner of the page and then pressing the space bar.

Record Details Page

The Record Details page is available for all objects. Click any record to view the Record Details page.

  • The initial focus for a Record details page first focus is the first section of the record form.
  • Record details page contains Left navigation panel, right navigation panel, record form, record banner (for case and task), action menu, record locator, record visibility button, and assign button.
  • Left and right navigation panel items are accessible by using the up and down arrow keys.
  • To work with the Action menu when it is in focus, use the up and down arrow keys.
  • To access the Record visibility dialog, click the lock button at the top of record.
  • To open the Assignment pop-up, click present on the top of the record, In that popup user need to use up and down arrow key to access the access the items.

Record Form

A record form contains multiple types of fields, sub-forms, and related forms. For each type of field, it has different types of keyboard interactions.

  • When user clicks any record, it redirects to the record form and the initial focus is the first section of the form.
  • You can access these sections by using the left and right arrow keys and pressing Enter.
  • To move the focus outside the form section, press tab and the focus will set on the first field of the form.
  • Use the tab and shift+tab keys to move forward or backward between the fields of a form.
  • To select a check box field, press the space bar to activate or deactivate it.
  • To select a radio button, use the space bar and then use the left and right arrow keys to move your selection across radio buttons.
  • When a drop-down list is in focus, press the space bar to view the contents of the list and then use the up and down arrow keys to move up or down across the items. You can select an element even without expanding the list by using the up and down arrow keys.
  • For a date field that is in focus, you can either manually type the date or select a date using the date picker. To select the date picker, tab to bring the date picker in focus and then press Enter or space bar to open the date picker.
  • In the date picker, the first focus is on the current date. Use the left and right arrow key to move to next or previous date and use the up and down arrow keys to move up or down in the date row. When the focus is still inside the date picker, press the tab key to change the focus from date to year section and then press Enter to expand the years list. Use up/down or left/right arrow keys to move the focus between the years.
  • In the years section, each page contains some limited number of years. Press the tab key to move the focus on the previous and next buttons and press Enter to access the previous or next set of years.
  • After you select a year, you will see the month selection page. Use the tab key to highlight a month in the selected year and then select the arrow keys to highlight a month and then press Enter :to select the month.
  • After you select a month, you will see the dates for that month. Use the tab key to highlight a date and then use the arrow keys to highlight the date you want to select. Press Enter when that date you want to select is in focus.
  • After you select a date, the focus will return to the date picker button.
  • If it is a date time field, then it will populate the current time in the time field. You have to change the time manually.
  • If it is a Geo location field, then there is a location picker and map button available. Press the tab key to highlight the map button and press Enter to set the coordinates for your location. :Once the coordinates are set, you can press the tab key to highlight the location picker, and press Enter to view this location using the browser. You are not allowed to add anything manually for :the geo location field.
  • If it is an image field, and if there is no image, then the first focus is on the upload button. Press Enter to open a pop-up window for attaching a file. Here, press the Tab key to highlight the Choose File option and press Enter to open a file browser. Select the file by using the tab and the arrows keys on the keyboard and press Enter to choose a file you want include as an image.
If an image is already present in the image field, then the first focus is set to the View button. Press Enter to view the image in a new window. You can close this window by either pressing ESC key or by pressing Enter as the focus in the new window by default is on the Close button.
  • Next to the View button, there is a Download button which you can use to download the image. Also, there is a delete button, which you can click to delete the existing image. A confirmation dialog appears on pressing Enter on the Delete button and when the focus is on the OK button, press Enter to remove the file.
  • If it is a file field, then the first focus is set on the Select a file button. Press enter to open the Attach file window. Use the tab key to highlight the Choose File button and press Enter to open the file browser. Use the tab and arrow keys to select a file. Press Enter to select the file and press Enter when the focus is on the Add button.
  • After you upload a file, it will appear like a hyperlink with the delete icon next to it. If a record has a file already, then the focus is first set on the link. By pressing Enter, you can view the file in a new window. This also depends on the file type. If it is an image, you can view it. However, for some other extensions, the application will show a download button, using which you can download the file.
  • You can remove the File by pressing Enter when the delete icon is in focus. When you perform the delete operation, you will see a confirmation dialog box.
  • If the field is a multi-select picklist, then you have to use the up and down arrow keys to select an element. For selecting multiple elements, use the Shift+Up arrow or Shift+Down arrow keys in combination.
  • If it is an email field, then the field has a send email button next to the email field. Press Enter when that button is in focus and it opens the default email client configured on your system with the email address auto-populated in the To field of the new email. To add a new email address, type the email address when the field is in focus and tab to highlight the Save button and press Enter.
  • If it is a lookup field, then it has a search button and a redirect button. Use the tab key to highlight the search button and press Enter to open a lookup dialog. Highlight the redirect button and press Enter to be redirected to the corresponding record details page.
  • If a field is disabled or is a read-only field, then you cannot change anything on that field. You can move the focus to that field and press Enter to read the content.
  • If there is any error in the record form, when you highlight the Save button and press Enter, the focus moves to the first field with the error.
  • If there is any change in the record and you navigate away form the form, you will see a pop-up dialog with a corresponding message.
  • After you traverse through all the fields of a record, the focus moves to the first field of the Related Information section. You can move through the fields by using the up and down arrow keys and pressing Enter when the focus is on the field that you want to view or modify.
  • You can interact with the records in a table. For more information, see [Interaction with Tables].

Dashboard

You can highlight Dashboard.png from the left navigation panel and press Enter to access the dashboard.

  • With the dashboard in focus, press tab and the focus moves from the left navigation panel to the Create new dashboard link.
  • Press Enter with the link in focus and you will see a window for creating a new dashboard. The first focus in the New Dashboard window is on the Name field. Use the left and right arrow keys to toggle between the radio buttons. Use the tab key to move across sections within this dialog box. Move the focus to the Cancel or Save button and press Enter. The focus returns to the Create new dashboard link.
  • Press the tab key to highlight the sections of the dashboard. Use the left or right arrow keys to move the focus across the sections.
  • Press the tab key to move the focus from the section to Default view activate.png. With Default view activate.png in focus, press Enter to set the current view as the default view. As you move across the sections, look for Default view activated.png to identify the section that is currently set as the default view.
  • With Default view activated.png or Default view activate.png in focus, press the Tab key to move the focus on the edit icon. Press Enter to open the Edit dashboard dialog box. Use the arrow keys and tab keys to move the focus within the Edit dashboard dialog box.
  • With the focus on the Edit dashboard icon, press the Tab key to move the focus on the lock icon. Press Enter to open the visibility permissions list. Use the up and down arrow keys to select.
  • With the focus on the lock icon, press the Tab key to move the focus on the Delete icon. Press Enter to delete the current page. Use the Tab keys to move the focus within the Delete Confirmation dialog box and press Enter.
  • With the focus on the delete icon, press the Tab key to move the focus on the + icon. Press Enter to open the Add widget dialog box. Use the Tab key to move the focus within the dialog box and press Enter with a widget in focus to make a selection.
  • After you create a new widget, the focus will move to that widget section.
  • On the top of every widget, there are three action buttons as follows:
  • Collapse/Expand button - Use the tab key to bring this in focus and press Enter to expand or collapse this widget.
  • Move icon - Use the tab key to bring this in focus and press Enter to open the Move widget dialog box. Use the tab key to shift the focus within this dialog box and the up and down arrow keys to select the values from the drop-down lists available within this dialog box. The widget will move on the screen based on the row and column selection. With Cancel or Save in focus, press Enter once you make the necessary changes.
  • Edit/Remove icon - Use the tab key to bring this in focus and press Enter to open a menu with Edit and Remove option. Press Enter with Edit highlighted to make changes to the widget or press Enter on Remove to remove the widget.

Report

Click Report icon newui.png from the left navigation panel to open the Reports section.

  • The first focus is on the Reports tab. You have another tab for Schedule. Use the left and right arrow keys to move across the tabs.
  • Press the tab key to move the focus from the current area of focus to Edit icon newui.png. Press Enter to open the Edit folder dialog box. By default, the initial focus is on Folder name. Use the tab key to move the focus to the Visibility Control field. Use the up and down arrow keys to move across the options in the drop-down list. Depending on your selection, you will see the respective dialog box. You have options to set visibility for Everyone, specific users, specific roles, and specific teams.
  • Use the tab and arrow keys to move your focus within these dialog boxes. To select check boxes, press the space bar.
  • Press the Tab key to move the focus to the Save button and press Enter.