0 GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/
There has been some progress on minor issues.
Major issues still need to be addressed but those will require discussion and decisions.
One of the main issues reported in the first testing round is that there are too many tab stops.
Currently, navigation through all the interface works with tabs meaning ALL the controls are tabbable.
Considering how some of the Gutenberg UIUI UI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing. parts are actually ARIA widgets, ideally, they should implement focus as recommended by the ARIA spec and the ARIA Authoring Practices. For example, toolbars and menus should be navigated with arrows only.
There’s definitely a need for more people to do testing and give feedback but we also need help with coding solutions.
The code can be confusing for those who are new to reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/.. In light of this, it was proposed that we add an additional label to help React devs understand the expected outcome and make sure they know the end goal. Some possibilities are `[Type] A11yAccessibility 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) Task`, `needs React dev` or `has-a11y-feedback-needs-implementation`
To clarify the issue about too many tab stops, consider this example:
This is a Gutenberg “inline toolbar”. They change depending on the 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..
All the controls in the toolbar are tabbable.
Instead, according to ARIA, if we want to treat this an ARIA toolbar, there should be just one tab stop on the toolbar and then all the controls should be navigated with arrows only.
That would greatly help to reduce the number of tab stops. The mixed tab/arrows navigation is a solid ARIA pattern borrowed by our operating systems.
1 Handbook
Sami Keijonen asked about the handbook: I actually really like the structure of theme handbook, can or should we use the same kind of format?
Also, the Breathe Theme is broken that we are using for https://make.wordpress.org/accessibility is broken:
- On mobile Genericon is missing on “hamburger” menu.
- Mobile menu doesn’t open at all.
We would like to do an a11y review on the theme for the theme handbook and fix the theme itself
2 Other a11y documentation in wp.org
We’ll start next week’s meeting with the handbook as well as other wp.org documentation.
3 Open floor
Joe Dolson shared some information about Keyboard 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) in 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/.. You can find here: https://get.slack.help/hc/en-us/articles/115003340723 (new as of today)
Link to Slack archive of meeting: https://wordpress.slack.com/archives/C02RP4X03/p1500311213351043