WordPress 6.3 Accessibility Improvements

Thank you to @joedolson and @alexstine for collaborating to write this post.

With WordPress 6.3 set to launch on August 8th, 2023, this post seeks to provide an overview of the many accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) improvements and fixes coming to the next major WordPress release. As always, there’s more work to be done with accessibility requiring an ongoing effort and commitment. 

If you’re interested in helping with this work, please join the #accessibility channel in Make SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. and check out how you can get involved. There are numerous ways to get involved in this important work including testing, giving accessibility feedback, and creating PRs to address feedback.

Site Editor

In order to keep up with the changes brought by the addition of more features in the Site Editor, including being able to add pages and patterns, the following work was completed:

• Add missing focus style to start template options previews.
• Editor: Add a description key to theme.json style variations & Add a description key to theme.json style variations.
• Ensure consistent labels for the WordPress logo and back links.
• Fix the headings hierarchy in the styles sidebar.
• Fix incorrect aria-describedby attributes for theme patterns.
• Fix Site Editor switch mode message.
• Pattern: add an explicit label to the search control.
• Post Comments From: prevent hidden input fields from being focusable in Safari.
• Site Editor: fix keyboard navigation flow.
• Site Editor: update headings hierarchy in the ‘Manage all’ screens.
• Site Editor: disable the revision button if there is no clickable menu.
• Site Editor: improvements to Sidebar buttons.
• Site Editor: add missing tooltip to navigation Back icon button.
• Site Editor: fix Multiple Tooltips from Focus Toolbar Shortcut on Site Editor.
• Site Editor: add view site link to site editor nav.
• Site Editor: add a navigable region for content area of Library and Template views
• Site Editor: add no-js fallback.
• Site Editor: manage selection on block sync.
• Site Editor > Pages: change password input to type text so contents are visible.
• Small improvements for the sidebars and Close buttons labeling.
• Use generic div instead of nav for <SidebarNavigationScreen />.

List View

List View remains an important and powerful tool for navigating complex content. To ensure all can benefit, the following accessibility related efforts were completed: 

• List View: modify the shortcut to focus while open.
• List View: allow selected block to override roving tabindex.
• List View: refactor ARIA attributes.
• List View: add aria-description.
• List View: allow deleting blocks using keyboard.
• Fix screen readers not announcing updated aria-describedby in Firefox.

General blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor experience

Work continues to improve the base block experience, especially since improving blocks enhances the experience across all parts of your site. In particular, work to streamline link editing included a specific accessibility focus. 

• Add aria labels to the focal point picker component.
• Add transparent outline to input control BackdropUI focus style.
• Add TabPanel to document overview replacing fake tabs.
• Autocomplete: duplicate list within iframe for non visual users.
• BlockLockModal: restore focus on fallback toolbar button when original button is not rendered.
• Block Mover: Make text labels for left/right move buttons legible,
• Block Toolbar: Fix incorrect switcher button width in text mode.
• Block Toolbar: Fix text only label for locked blocks.
• Distraction Free: Avoid focus loss when enabling/disabling distraction free mode via the more menu.
• Editor: Improve accessibility of new custom field UI.
• Fix labeling, description, and focus style of the block transform to pattern previews.
• Fix constrained tabbing failures with Safari and Firefox.
• Fix UrlInput combobox to use the ARIA 1.0 pattern.
• Fix accessibility of the Classic block modal dialog.
• Fix Navigable Toolbar initialIndex.
• Fix Multiple Tooltips from Focus Toolbar Shortcut on Widget Editor.
• Formatting: Support aria content attributes.
• Handle isDraft or isInvalid Enter keypress via onKeyDown instead of a Keyboard Shortcut.
• Preferences Modal: fix double focus outline in tab item.
• Link Control: add support for text only labels.
• Link Control: fix the ‘Save’ button’s disabled state.
• Link Control: focus first focusable on Link UI.
• Make sure useFocusOnMount runs when all the children tabbable elements have mounted.
• Modals: Update the Cancel action’s button design.
• Small improvements for the Document Overview labeling.
• Snackbar: Fix insufficient color contrast on hover.
• Social Icons: Manually set Snapchat label color.
• ToggleGroupControl: Fix focus and selected style to support Windows High Contrast mode.
• Writing Flow: improve keyboard navigation on certain input types.
• Writing Flow: allow Escape key to deselect blocks and selection during multiselection.

Administration

• Administration: make checkbox column clickable.
• Administration: replace Tagline option placeholder with a description.
• Administration: consistent positioning and size of search form.
• Administration: improve alignment in the Activity dashboard widget.
• Editor: Show scheduled text when changing to new future dates.
• List table: sortable column headers accessibility.
• Users: use type=”hidden” for hidden input on User edit administration panel.

Upgrade/Install

• Upgrade/Install: log in link should look like a link.
• Upgrade/Install: update ‘show details’ button change.
• Upgrade/Install: show/hide toggle on password fields.
• Upgrade/Install: improve WP_Upgrader strings rendering on small screens.
• Upgrade/Install: add aria-describedby for input descriptions.

Other

• Bundled Themes: fix Twenty Fourteen button block line-height.
• Bundled Themes: remove/disable obsolete IE-specific skip-link-focus-fix.
• Media: update admin image editor design.
• Login and Registration: add required to Username/password inputs.

#6-3