Proposal to change the day and time of the Accessibility Team’s weekly meetings

Following the discussion begun during the meeting on August 7, 2020, the 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) Team is reviewing the day and time of the weekly meetings, with the goal to increase participation.

You can find the transcript of the discussion on our Slack channel.

The team agreed to keep together the weekly bug-scrub and the weekly meeting, with the bug-scrub starting one hour before the meeting.

After checking the WordPress meeting calendar, the team agreed to consider both Monday and Tuesday as possible alternatives to Friday.

Also, the team is considering whether to start the meeting one hour later. As usual, the starting time of the meeting will be adjusted after the daylight saving period, so that meetings stay almost always on the same local time.

You can express your preference by filling the form before Friday, August 14, 2020 at 15:30 UTC. To help you with local times, you’ll find a link to a local time converter in the form.

We look forward to seeing you during the next weekly meetings!

Cast your vote!

#weekly-meetings

Change in the WP accessibility team meetings time/day

Hey all,

We are changing the day for the bug scrub and team meeting back to the Mondays.

The reason is that Rian has her weekly day off on Wednesday and we didn’t see an increase of attendees when we changed from the Monday to the Wednesday.

So the new day will be Monday.

Time:

  • bug scrub at 14 UTC
  • team meeting at 15 UTC

Starting Monday June 25th.

See you then!

#weekly-meetings

This week in WordPress Accessibility, May 23th, 2018

Weekly Bug scrub

TracTrac Trac is the place where contributors create issues for bugs or feature requests much like GitHub.https://core.trac.wordpress.org/. tickets

#44007: Making a child themeChild theme A Child Theme is a customized theme based upon a Parent Theme. It’s considered best practice to create a child theme if you want to modify the CSS of your theme. https://developer.wordpress.org/themes/advanced-topics/child-themes/. link should open in new tab
Decided to close the issue as we are working on removing the target=”_blank” option for the WP Admin for cases like this (see the WPA11y handbook: The link opens in a window or tab).

#44035: Admin flyout submenu does not open on mouseover when changing device width in browser
Decided to remove the 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) focus; this is an overall issue, not specifically 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).

#44073: Add functionality to search pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party with double quoted keyword
Decided to remove the accessibility focus, as not related to web content accessibility issues.

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/ issues

Gutenberg 1311 react-datepicker is not accessible

The current date picker is not (keyboard) accessible. We need a good alternative.

The most robust solution would be:

  • 3 separate input fields of type `text` with a placeholder to hint about the expected format [mm] [dd] [yyyy]. It seems like some AT like Dragon doesn’t handle the HTML5 type=date very well. This could do with more user testing
  • client validation
  • clicking on the fields also opens a datepicker, at that point Andrea doesn’t mind about the datepicker accessibility since there are standard input fields

Gutenberg 469 Expandable UI sections accessibility
The point is:

  • either the expanded panel immediately follows the toggle that expanded it
  • or focus should be managed properly

Gutenberg 6468 WritingFlow should exclude standard input fields
WritingFlow is the Gutenberg feature that allows to go through all blocks using the arrow keys
It’s intended to emulate the native behavior in a textarea, as all the blocks were part of a unique textarea (and under the hoods, they are)
So when you’re in a 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. and press the Down arrow key, you navigate through the block text content and then to the following block. Also Left / Right arrows are used for WritingFlow. However When focus is within an input field, that becomes very confusing.

We proposed to add Milestone 5.00 to this issue, as this seems pretty essential for keyboard users.

Weekly team meeting

The work on the Handbook Best Practices is on hold, because we @samikeijonen en @rianrietveld need time to prepare for their workshop a11y testing at WordCamp Europe.

The pair programming plan for the WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. Europe contributor dayContributor Day Contributor Days are standalone days, frequently held before or after WordCamps but they can also happen at any time. They are events where people get together to work on various areas of https://make.wordpress.org/ There are many teams that people can participate in, each with a different focus. https://2017.us.wordcamp.org/contributor-day/ https://make.wordpress.org/support/handbook/getting-started/getting-started-at-a-contributor-day/. goes well, we have a11y experts and Gutenberg devs that want to participate. Hopefully we can get some more people joining the GutenA11y table then.

@afercia asked for a11y testing of the new block inserter for Gutenberg. See 6636 Try inserter with collapsable panels. It still needs some further simplification, like removing some ARIA stuff. This functionality is installed on our test server (wpaccess.org/gutenberg-git). Rian will ask some people to test, if you need access give her a pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” on 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/..

@abrightclearweb is going to lead the accessibility table in Glasgow.

Action

 

  • Test the new Gutenberg block inserter: everyone
  • Write about what WCAGWCAG WCAG is an acronym for Web Content Accessibility Guidelines. These guidelines are helping make sure the internet is accessible to all people no matter how they would need to access the internet (screen-reader, keyboard only, etc) https://www.w3.org/TR/WCAG21/. 2.1 means for the WordPress project: Rian (planned for end of May)
  • Write ATAG statement: Joe Dolson

#weekly-meetings

This week in WordPress Accessibility, May 9th, 2018

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/ Bug scrub

We discussed issues marked for the Gutenberg merge proposal milestone accessibility.

Publishing Flow accessibility:
The conclusion of the discussion with this ticket is: we need to work with the current design and get that working for keyboard. We should probably start trying to fix keyboard interaction, tab order, focus management, etc. Needs a developer.

Link boundaries don’t work with Safari 11.0.1 when using VoiceOver:
Andrea tested the issue again and closed it: current Safari stable is 11.1 (which was Safari Technology Preview at the time this issue was created) so now boundaries work when using VoiceOver.

Consider a mechanism to customize shortcuts, e.g. Ctrl + backtick:
There is a good discussion with the issues but no PR or actual progress so far.
Still marked for merge proposal, because without this some features are not available for all users. Needs a developer.

Components and features should be logically placed within the main regions:
From a coding perspective, it’s mainly about the publishing flow.
Once that is fixed, it should be made clear in the Gutenberg developers documentation that any 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. must live inside the landmark regions, with the exception of modals and the like, since they’re typically injected before the closing <body>.

Reminder: audit all the aria-labels:
@grahamarmfield is making a list of all current aria-labels.
It will be quite a job to create clear labels for all items.

Switches should always show On/Off label:
This is a design decision that conflicts with 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). It’s hard to create consensus over this.
Our question: what is the value of these switches compared to native checkboxes, besides being pretty. Native checkboxes are universal, simple, clear and very accessible.

Team meeting

Handbook

Going steady. We just need people to read the pages in the section Best Practices. For readability, completeness and accuracy. Volunteers are very welcome

Gutenberg

About the Gutenberg Assistive TechnologyAssistive technology Assistive technology is an umbrella term that includes assistive, adaptive, and rehabilitative devices for people with disabilities and also includes the process used in selecting, locating, and using them. Assistive technology promotes greater independence by enabling people to perform tasks that they were formerly unable to accomplish, or had great difficulty accomplishing, by providing enhancements to, or changing methods of interacting with, the technology needed to accomplish such tasks. https://en.wikipedia.org/wiki/Assistive_technology manual: Rian talked with the docs team and the best place for a Gutenberg AT manual will be the new HelpHub. We now have access to write content there. Maybe (in the far far future ) we can convert it into an overall AT manual for the Admin.

The Gutenberg “Inserter” is probably going to change, there’s one more iteration and a pending PR that changes it significantly. In a first look it’s an improvement, accessibility wise.

Andrea explored the re-ordering of elements surrounding the blocks and this proposal by @melchoyce could help 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): Display block tools underneath the block, instead of to the sides.

WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. Europe

We plan to organise a “Pair/Peer programming with a Subject Matter Expert and Dev” for the WCEU contributor dayContributor Day Contributor Days are standalone days, frequently held before or after WordCamps but they can also happen at any time. They are events where people get together to work on various areas of https://make.wordpress.org/ There are many teams that people can participate in, each with a different focus. https://2017.us.wordcamp.org/contributor-day/ https://make.wordpress.org/support/handbook/getting-started/getting-started-at-a-contributor-day/..

The a11y team has not enough expertise to write a pull request for some of the milestone issues and the Gutenberg developers have enough expertise on web accessibility. So pairing them up at the contributor day seems like the best solution to get work done quickly. We will write a dedicated blog post about it and make some noise to recruit developers.

Action

  • Write ATAG statement: Joe Dolson
  • Write about what WCAGWCAG WCAG is an acronym for Web Content Accessibility Guidelines. These guidelines are helping make sure the internet is accessible to all people no matter how they would need to access the internet (screen-reader, keyboard only, etc) https://www.w3.org/TR/WCAG21/. 2.1 means for the WordPress project: Rian (planned for end of May)
  • Organise Gutenberg Pair/Peer programming for WCEU contributor day: Rian (this and next week)

And further…

May 17th is Global Accessibility Awareness Day (#DAAG) with many events you can attend.

For those of you who have not subscribed yet: A11y Weekly is a excellent newsletter by @davidakennedy with news and resources on Web Accessibility.

#weekly-meetings

This week in WordPress Accessibility, May 4th, 2018

Bug scrub

We discussed issues marked for the Gutenberg merge proposal milestone:

Simplify and streamline keyboard navigation through blocks:
First: what if 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. toolbar had only one tab stop and navigating through its controls would be possible with the arrow keys? Would users be able to get it?
Interaction modal: ARIA toolbar example
Conclusion: we are going to try this and let it test by some advanced keyboard / screen reader / VIM users

Second: the tab order
A good tab order would be for example: insert block, then editable area and then the rest. But should the visual order meet match DOM order? @afercia will try to investigate on the first two things in the next days

Constrain tabbing within popovers and similar components:
Alexander Botteram is working on a modal component that introduces a re-usable “constrain tabbing” feature.

Publishing Flow accessibility:
Nic Bertino did research on this and created a design proposal, that needs following up by the design and develop team.

Weekly meeting

Handbook

We added new pages added about Test for web accessibility to the handbook’s Best Practices chapter. If there are people who want to review what is published, please do.

Sami Keijonen tweeted posts from the handbook in a series on Twitter. Nobody uses Facebook in the team, so we won’t start a Facebook campagne.

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/

Summarised: Minor fixes went in, the bigger issues are still to solve.

We need to write a manual for AT users. We need people who are familiar with Gutenberg to be involved in writing the manual for AT users of Gutenberg. We can start outlining the processes and AT combinations to be documented. Rian will investigate what the best place is to publish this manual. Rian and Sami want to help writing.

We will dedicate our weekly bugscrub now on Gutenberg for now

We need to contact someone from Dragon about issue raised by Eric Wright: Can’t add a post title using speech recognition software.

Open Floor

Nicolas Steenhout has a podcast: A11y Rules. He’d love to speak to people that are NEW to 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), either working full time in it, or developers that are exploring #a11y.


So, if you think that’s you, please contact him, always nice to hear new voices

Action

  • Write ATAG statement: Joe Dolson
  • Write about what WCAGWCAG WCAG is an acronym for Web Content Accessibility Guidelines. These guidelines are helping make sure the internet is accessible to all people no matter how they would need to access the internet (screen-reader, keyboard only, etc) https://www.w3.org/TR/WCAG21/. 2.1 means for the WordPress project: Rian
  • Find the best place for the Gutenberg AT handbook: Rian

 

 

#weekly-meetings

Accessibility team meeting, April 23, 2018

Transcript in Slack

Meeting notes

Time for next meetings

We picked a new time for the weekly 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) bugscrub and team meeting:

During the daylight saving time (as in now):

  • 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) bug scrub: Wednesday 14:00 UTC
  • Accessibility Team meeting: Wednesday 15:00 UTC

Starting next week, May 2, so the meeting on Monday 30th will be cancelled.

Handbook

After the handbook is sort of finished we want to maintain it via GitHubGitHub GitHub is a website that offers online implementation of git repositories that can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/. That way more people can contribute or file issues. @nicbertino will help migrating the content we have now to GitHub and we are looking for an easy way to push the GitHub pages back in the handbook pages on wordpress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/.

Kudos to WPTavern for publishing a post about the handbook and the need for help.
At the moment we don’t need writers, but we desperately need reviewers with knowledge of accessibility and native English speakers to go through the pages on Best Practice we have published or are in draft on Google Docs.

@samikeijonen will post a series of tweets on @WPAccessibility to promote finished content in the Best Practice section. Which already gave discussion on Twitter, so that works well 🙂

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/

AT WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. London @karmatosed joined the a11y table and we discussed the issues on GitHub that have priority.
They are 13 issues labeled Accessibility and Milestoned Merge proposal: Accessibility. Some are also labeled High Priority.
@abrightclearweb researched the blocks – keyboard interaction (Tab, Shift+Tab) and added that info to the issue Simplify and streamline keyboard navigation through blocks.

These issues need to be worked on. The team is worried those issues can not be addressed before the merge proposal.

#weekly-meetings

Change of the day and time of the Accessibility Team Meetings

We picked a new time for the weekly 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) bugscrub and team meeting, so more people can be present and less people will be very hungry:

During the daylight saving time (as in now):

  • Accessibility Bug Scrub: Wednesday 14:00 UTC
  • Accessibility Team meeting: Wednesday 15:00 UTC

We’ll adjust the time after the daylight saving period, so the meetings stay on the same local time.

Starting next week, May 2nd, so the meetings on Monday 30th will be cancelled.

#weekly-meetings

Accessibility team meeting, April 9, 2018

Agenda

  1. 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) statement
  2. Handbook
  3. 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/, priorities for WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. London
  4. Contributor drives
  5. Open floor

Meeting notes

Accessibility statement

The WordPress project now has an accessibility statement. We still need to add an ATAG (Authoring Tool Accessibility Guidelines) statement to add to that page. @joedolson will write that, sometime in the near future.

Accessibility Handbook

At the moment @rianrietveld and @samikeijonen are writing pages about how to test for accessibility to add to the handbook best practices chapter, for developers, designers and content managers. This at the request of the Gutenberg team. The pages are in draft now, to be published this or next week.

Gutenberg, priorities for WordCamp London

@karmatosed suggested the following workflow for this:

  • sit down together at 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) table on the contributor dayContributor Day Contributor Days are standalone days, frequently held before or after WordCamps but they can also happen at any time. They are events where people get together to work on various areas of https://make.wordpress.org/ There are many teams that people can participate in, each with a different focus. https://2017.us.wordcamp.org/contributor-day/ https://make.wordpress.org/support/handbook/getting-started/getting-started-at-a-contributor-day/. prioritising all a11y issues in a spreadsheet
  • create a solid few weeks plan for accessibility, get everything in milestones, get everything so we all know we’re on track
  • get a ‘hot list’ from that and give easy wins to developers present at  the contributor day
  • leave that clearly knowing what needs to be done for a11y and how help can get there
  • focus on a plan of tasks and that all tasks have enough information to be developed by anyone working on project

Contributor drives

Angela Jin asked us to write up content for their info pages about work that can be done for the different teams during a contributor drive (a bite sized contributor day). @rianrietveld also adjusted the page Getting Started at a Contributor Day for this too.
If a contributor wants to select an a11y task:

  1. Tell the #accessibility channel in WordPress 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/. that you are hosting a Contributor Drive and request specific projects and direction.
  2. If you need assistance during the Contributor Drive, ask questions in Slack.

To avoid having to maintain a page with a list of tasks in the documentation of the contributor drive.

Open floor

  • @postphotos came with the idea of organising “contributor drives” in regions across the world, focused on a11y. Like the translation days. He will research this further. We agreed this is a fun idea (wpa11y day?)
  • @arush will publish her research on the screen reader accessibility of Gutenberg this week
  • We had a discussion about adding hreflang to links in translatable strings, like e.g. <a href="%s" hreflang="en"> . Adding the hreflang="en" in the translation triggers a warning
  • We discussed setting a new date/time for the meetings. There will be a separate post about this tomorrow.

 

#weekly-meetings

Accessibility team meeting, March 26, 2018

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/ testing

@joedolson was at then CSUN conference last week and asked Léonie Watson and Sina Bahram to have a go at the Gutenberg test. Both are internationally recognized experts in web 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), WordPress users and highly experienced both at testing applications and coding.

Test results

Leonie Watson found the system extremely difficult to use. She currently runs her own WordPress site, and has for many years, so her starting assumption was to expect her past knowledge to be useful, and to attempt to use it as a standard page.

Sina Bahram immediately assumed that Gutenberg was an application, and should be operated as one, but found it frustrating that this turned out to only sometimes be true. Strongly suggested using the application role so that interactions would be more predictable. Video of Sina’s session (20 min)

One comment that both users made specifically was that they “didn’t trust” the focus management, and both elected to try alternate methods of navigation (link nav, heading nav, find in page) specifically because they didn’t trust that tabbing would take them where they expected. The most problematic issue there was 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. menus having different forward and backwards action.

Both users also attempted to search for help at some point, feeling that there should be some kind of instruction to inform them how the interface worked, but did not find any.

Unpredictability is one of the biggest enemies Joe saw in these tests. Users got frustrated not knowing where their next interaction would go.

CTA

During the meeting we discussed use of role="application" and role="textbox" and we will do an A/B test on the test server to see if that makes the interface better usable for the combination Firefox & NVDA.

We will publish a post this week summarizing all test results and the work that needs to be done on Gutenberg before merge.

Underlining of links in the content

In new committed code, there is no underlining for links in text blocks. But according to WCAGWCAG WCAG is an acronym for Web Content Accessibility Guidelines. These guidelines are helping make sure the internet is accessible to all people no matter how they would need to access the internet (screen-reader, keyboard only, etc) https://www.w3.org/TR/WCAG21/.: links must stand out in the text, not by colour alone. To prevent this from happening this should be added to the Accessibility Coding Standards for WordPress CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. This was also added earlier to the Theme Guidelines.

@afercia added the required underlining text to the Accessibility Coding Standards for WordPress Core.

#weekly-meetings

This week in WordPress Accessibility, March 12, 2018

We had four items on the agenda:

  1. Handbook.
  2. 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/ and 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) requirements.
  3. Visual change on hover for a link.
  4. Open floor.

Read the full transcript in Slack.

Handbook

Accessibility handbook is going forward little by little. Here are couple of newest articles:

Next steps also include marketing plans for the handbook. The idea is that people would actually know about the handbook 🙂

Gutenberg and accessibility requirements

We have been talking about accessibility requirements in Gutenberg. We now have nine items in the list, last three was added todays meeting.

  1. Keyboard navigation through blocks needs to be greatly simplified and streamlined. See the experiment with navigation mode / edit mode.
  2. For some components, there’s the need to constrain tabbing within the component (i.e. they should behave like “modals”).
  3. The publishing flow needs to be simplified, currently its accessibility is terrible.
  4. Everything needs to live inside the landmark regions.
  5. Text mode: a simple textarea is the only guarantee to enable users to publish content, regardless of the device / technology they use.
  6. Write documentation for keyboard and screen reader users.
  7. Consider a mechanism to customize shortcuts, e.g. Cmd/Ctrl + backtick, see issue #3218.
  8. Use a `role=”textbox”` for all the Editable elements, see issue #3412 and issue #4074.
  9. 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. toolbars position counterintuitive for keyboard users, see issue #3976.

We would like to get these implemented before merge proposal.

Update March 13: We also talked about the issue where adding a post title is hard using speech recognition software. There is PR for adding aria-label to post title, which needs testing.

Visual change on hover for a link

We discussed should links have visual change on hover. There were two use cases to investigate.

  1. Vanilla link: <a href="#link">This is link</a>
  2. Link with image: <a href="#link"><img src="test.png" alt="testing image inside link"></a>

For item one we already have a guideline that main content links needs to be underlined. Without CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. browsers only have cursor pointer on hover. See the screenshot below.

link have cursor pointer by default on hover

We agreed that there is no need for visual change on hover, as it follows browsers native behaviour. But from a usability point of view extra visual change can be helpful. For example removing the underline.

Item two (image inside a link) use cases are for example gallery or feature image linking to post. We agreed that images don’t need underline or border. But on hover change we recommend same styles as on focus, like outline styles.

There are couple of examples how to deal with feature image linking to post:

  1. Put image inside the same link as post title.
  2. Ignore some of the links at least for keyboard users.

We were also joking around as usual: Surround the image with marquee text “Click the image”.

Open floor

@postphotos (Leo Postovoit) had his first ticket and patch about what captions means for video. Congrats!

@afercia (Andrea Fercia) made the “Available Widgets” section operable with a keyboard. Also, the link to the “Accessibility mode” is now available to all users.

enable accessibility mode link visible

There should be a game called things you didn’t know about WP admin.

#weekly-meetings