All Release Notes

Improved keyboard accessibility in the Merchant Center

15 October 2020
Enhancement
General

You are now able to navigate throughout interactive elements in your Merchant Center Project by using the keyboard only.

Via newly implemented visual indicators you can now recognize a focused element.

This improvement in accessibility helps to increase productivity and task efficiency for both users with disabilities which rely on a keyboard as well as power users.

Example

Use the following keyboard navigation web standard keys to navigate through the Merchant Center:

  • Use the Tab key to navigate through links and forms within a page. Pressing Shift + Tab keys allow you to navigate backwards.
  • Spacebar allows you to activate buttons, open drop downs, and change the state of certain inputs such as checkboxes and toggles.
  • Enter opens links and activates buttons.
  • Arrow keys are used for navigation within certain inputs such as a group of radio buttons, dropdown menus and date picker input menus.

Complex elements with user interactions catered to the use of a mouse such as the Column Manager in table settings are also keyboard navigation friendly:

  • With the Tab key, navigate to the tag you would like to move.
  • Press the Spacebar to activate the drag functionality.
  • Move it to the new slot by using the Arrow keys.
  • Drop it by pressing the Spacebar again.

These improvements are optimized for the latest version of Chrome but they are also available for the latest versions of Firefox and Safari browsers. To ensure keyboard navigation works correctly in those two browsers, we recommend you to do the following:

  • For Safari and Firefox users on MacBooks: on System Preferences > Keyboard > Shortcuts enable "Use keyboard navigation to move focus between controls"
  • For Firefox users, you might also need to: enable in the browser preferences the option "Always use the cursor keys to navigate within pages." It is located in General preferences > Browsing.
Developer Center
HTTP APIGraphQL APIBETAPlatform Release NotesCustom ApplicationsBETASDKs & Client LibrariesImport & ExportSUNRISE Starter FrontendsTutorialsFAQ
Sign upLog inTech BlogIntegrationsStatusSupportUser Research Program
Copyright © 2021 commercetools