Accessibility team update for December 11, 2017

Transcript meeting in Slack

Handbook

The writing continues steadily, we still hope to finish the best practices mid March.

In the meantime we need to set up a marketing plan for the handbook. @samikeijonen and @postphotos want to work in this, with the help of the Marketing team (@mcdwayne, @gidgey and @anafransilva).

Thoughts and ideas are in the Google doc: Marketing plan for accessibility handbook.
We will continue the discussions in the 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/. channel #accessibility-docs.

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/

The Gutenberg inserter has been tested at the contributors day at WCUS and by @abrightclearweb

The the Gutenberg toolbar roving tabindex is still on the to-do list.

Note from @afercia: The roving tabindex thing is implemented for now just on the Inserter “tabs”. The point is, consider to use the same technique for the toolbar too?
See Toolbar: consider to use a roving tabindex and standardize navigation · Issue #3383

It’s well explained in the ARIA Authoring Practices example. Worth noting there’s now an option to set the toolbar in different positions:

  • docked to the top
  • floating on top of each 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.

Further more we need urgent frontend testers/reviewers/devs for the issues Sami created om GitHub to prevent inline style going into the frontend code. There have been good conversation about inline styles in Proposal of removing inline styles · Issue #2862.

Items on the To-do list

  • Prevent frontend style getting in Gutenberg
  • Research screen reader performance for code short codes like [ php ] or [ htmlHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. ] – action Sami, if he has time
  • Write up a summary of things that will change in 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 for coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. and design – action Rian, next week

#accessibility-team-meeting

Accessibility team update, November 27, 2017

Weekly meeting

Transcript meeting in Slack

Handbook

Should we  use <pre><code> or <pre> or shortcodes like [ php ] for displaying code examples? The shortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. adds a table, VoiceOver doesn’t announce this well and also jumps unexpectedly out of the code example.
Conclusion discussion: we need to do more research, also with other screen readers and see how they perform.

New articles:

  • Post about forms need a bit of text tweaking
  • Post about archive page needs some addition text with discussion

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/

Two tests are still open:

  • Test the Gutenberg inserter
  • Test the Gutenberg toolbar roving tabindex

Pause meeting for the holidays

We will skip the meetings on December 25th and January 1st.

Items on the To-do list

  • Research screen reader performance for code short codes
  • Write up a summary of things that will change in 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 for designers and developers
  • Tests Gutenberg

#accessibility-team-meeting

Accessibility team update, November 20, 2017

Weekly meeting

Transcript meeting in Slack

The handbook

Things go well, we are adding new content every week on the handbook – best practices.
@mercime will help with the documentation, starting with forms.

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 are improvements made to the keyboard navigation, specifically the inserter. This is still work in progress. The top toolbar has now arrow navigation too.
@samikeijonen requested a review for his pull requests on 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/.

Test server

Nimbus hosting sponsors our team with a dedicated server, where we can install trunk and patches using SVNSVN Apache Subversion (often abbreviated SVN, after its command name svn) is a software versioning and revision control system. Software developers use Subversion to maintain current and historical versions of files such as source code, web pages, and documentation. Its goal is to be a mostly compatible successor to the widely used Concurrent Versions System (CVS). WordPress core and the wordpress.org released code are all centrally managed through SVN. https://subversion.apache.org/. and GitGit Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. Git is easy to learn and has a tiny footprint with lightning fast performance. Most modern plugin and theme development is being done with this version control system. https://git-scm.com/.. At the moment we do not use this server much.
The question is: do we still need it and and will we use it in the near future?

After a discussion we concluded: Yes we need it and we will use it more for testing in the future. The team requests test and Rian will do the installs, mail the testers and report the results.

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 AA

Rian will write a post this week about what is new in WCAG 2.1 AA for the designers and developers.

One of the new requirements is a minimum size for the a link/button.
@afercia added new a11y keyword target-size on Trac.

#accessibility-team-meeting

Accessibility Team Update – Nov 13 2017

Transcript in Slack

Planning and focus for WP 5.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/, testing an fixing
  • Finishing the first version of the handbook
  • Media tickets (if there is time left)

The handbook

The content of what to do on a WP contributors day in the handbook has been updated.

The work on best practices is in progress. Maja Benke, Sami Keijonen, Rian Rietveld and Stefan Brechbühl are writing. Joe Dolson and William Patton are proof reading and reviewing. We have a deadline of mid January for all draft content but we already publish what is ready and reviewed.

Gutenberg

We’ll test during contributor days. Andrea pointed out that he needs more help testing and fixing. There are still a lot of open issues. We discussed how to solve this, it’s hard to get more people involved.

As for 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) test team: most gave up on Gutenberg and there is hardly any useful response anymore. Maybe we started testing too soon. There was a discussion if and how we can use the test server we have on wpaccess.org, without a conclusive outcome.

Open floor

The time of the meetings will be one hour later:

  • Bug scrub: 16:00 UTC
  • Team meeting: 17:00 UTC

#accessibility-team-meeting

Accessibility update for October 23, 2017

Transcript in Slack

Please note: the times of our meetings have changed.

Handbook

Because of work and holidays, the last month not much work was done on the handbook. But as from now we will pick up writing again. The goal still is to have the handbook finished mid March 2018 (with all the text ready for review around mid January).

Tickets/Issues for contributor days

We need a page to refer to on contributor days with a list of tickets and issues to work on. Preferable tickets without a long history of discussion. Like “good-first-bugs” or keyword related tickets or 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/ “Good first issue”. @afrecia provided a list and Rian will create the page.

Our focus for 5.0

For the WordPress 5.0 release we will focus on 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) of Gutenberg. There are still a lot of Gutenberg a11y tickets open and discussions to be held and testing to be done.

HTML5 landmarks

Marco Zehe published recently: Firefox 57 will be less chatty to screen readers in some situations. FireFox will treat HTML5 landmarks differently. This has implications for the changes just made in the Underscores theme. @samikeijonen is researching this.

Also Apple VoiceOver doesn’t announce the footer if no role="contentinfo" is added. This seems like a bug.

We will wait until FireFox 57 is officially out and will test this with FF/NVDA and Safari/Voiceover.

#accessibility-team-meeting

Accessibility Team meeting, August 28, 2017

Transcript of the meeting

Agenda

  • Handbook, progress so far
  • CodeMirror
  • 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/
  • Open floor

CodeMirror was moved up in the discussion by request of @samikeijonen.

CodeMirror

CodeMirror will be incorporated into WordPress 4.9 in theme and plug-in editing, the HTMLHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. text widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user., and the customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings. CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. editor. Discussed how to provide access to Help for keyboard users who will need some instruction on how this will work from the keyboard. The 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/theme editors and the CSS editor have logical places to provide information, but HTML widget doesn’t have a place for this information.

Conclusion: WordPress needs an inline help implementation. Lacking that, we’ll use the Help tab to hold the information for now, with the eventual goal to implement inline help and move the information.

Handbook

Report: Work on the Handbook has started. Trying to write at least one topic per week. Discussed how to handle some complex topics, and agreed that where applicable, we’ll refer directly to external examples and recommend the most official example for a given specification. E.g. tab panels.

Progress on Handbook

Gutenberg

Simply Accessible has offered to provide support for developers on Gutenberg. Discussed effectiveness of this and ability to help with solutions. Problems mostly have to do with gathering consensus then finding somebody to implement. Tried to generalize how Simply Accessible can best be leveraged. Suggested they focus on keyboard interactions with blocks.

Discussed labeling some 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) issues as high priority to try and focus efforts.

@afercia commented that one coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. problem is that technical solutions have gotten decided without a preliminary accessibility evaluation which have had significant impacts on accessibility.

Open Floor

@rianrietveld will be on holiday for the next four weeks, and asked for a volunteer to lead meetings during her absence. @samikeijonen volunteered for at least next week’s meeting.

#accessibility-team-meeting

Accessibility team update, July 24, 2017

Transcript of meeting.

The discussion of the handbook was punted to the July 31st, 2017 meeting, as @samikeijonen was unable to attend this week’s meeting. As this discussion was originally intended as the primary focus of this week’s meeting, the entire meeting was open floor, with no agenda.

Topics discussed

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/: 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. output

@afercia recommended we set up a test to review the output of all Gutenberg content blocks, as many of the new block types generate different output than the equivalent in the existing editor, such as the image gallery block.

@rianrietveld requested that @afercia create a post for testing that contains all relevant options.

We determined that we need to first perform an expert review of the general issues, request modifications as necessary, then gather user feedback once any major errors have been worked through.

The team briefly discussed the reasoning behind creating content blocks that generate features that exist in the current WordPress ecosystem using different output HTMLHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites.; further conversation on this topic should probably land in relevant Gutenberg issues.

Gutenberg: user testing

@nicbertino volunteered to manage moderated user testing for Gutenberg, to start with general user testing, then proceed to specific testing with users requiring 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.

#accessibility-team-meeting

Accessibility Team Chat Summary November 16, 2015

Documentation

Discussion of adding information about accessible content management to either the Codex or 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) Handbook. Decided to add it to Handbook. Keyboard shortcuts will go in the Codex with a link from the Handbook.

Tickets

#34681 Consider removing the “Disable the visual editor when writing” option.
Decided to gather user experience data. Four questions to ask:

      Do you know how to switch between the visual and HTMLHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. editor in WordPress?
      If no, please try and figure out how, and tell us how that experience was for you.
      If yes, give us your thoughts about your experience using that feature.
      Do you use the option “Disable the visual editor when writing” in your profile?

#34625: wp-login.php site title link points to wordpress.org.
Suggested fix: removing the title attribute, changing the text to ‘Powered by WordPress’, and leaving the filterFilter Filters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output. on that text.

#accessibility-team-meeting, #team-reps, #weekly-updates

Team Chat Summary August 31, 2015

Headings

More work is being done on headings in admin. Jeffrey de Wit created some tickets some of which are already patched and committed. Follow the headings discussion in #accessibility 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/..

Handbook

Devised a strategy for building out the Make WordPress Accessible Handbook. Page leaders will help others build out the handbook.

Twenty Sixteen

Twenty Sixteen is on Github. Twenty Sixteen is also available in the theme directory. It’s not in trunk yet. According to David Kennedy ” I did a 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)-ready review before it went on 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/ and the directory to make sure nothing was way off accessibility-wise. It’s solid. Takashi knows the drill.” We will ask the testers to test it. David Kennedy did an #accessibility-ready audit of Twenty Sixteen.

Select2

We continued a discussion about Select2 as an alternative to the autocomplete/tagging input field types. There are two main accessibility issues: it doesn’t do a good job of providing feedback to screen readers and it requires the ‘enter’ key to begin typing for autocomplete, a non-standard interaction. The testers have tested Select2 and it is not very accessible. Rian Rietveld will collect all the data and report next week.

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. US

Several of us are submitting proposals for talks at WordCamp US and depending on funding assistance some of us will be attending. Today is the last day for submitting proposals.

#accessibility-team-meeting, #team-reps

Team Chat Summary August 10, 2015

New Structure Proposed

Rian Rietveld wrote a proposal on how to structure our work better and plan ahead longer and we discussed it. What follows is examples from the proposal.

Goals and Issues

This will be a separate page on make/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) and also a main menu item. It gives an overview of our goals for the accessibility of WordPress, the work we (want to) do, how this is organized, how we test, a roadmap for the next year and how we track the progress of issues we are working on. An example of the roadmap for release 4.4:

Release 4.4 (December 2015, Scott Taylor)
  • Finish still open issues focus from 4.3
  • Semantic heading structure Admin
  • The customizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.
  • Handbook
  • Twenty Sixteen (?)

Central Ideas

Some central ideas also included in the proposal are keyboard focus, work on the handbook, color contrast, system to better follow tickets including splitting up tickets among team members on which to concentrate, and continue to develop code pattern library. Much more is included in the proposal and for now we will continue to work on the proposal to make it a more formal document to cover our activities over the next year.

We also talked about the fact that having a planning document to refer to does not obviate the need to address all new features since there is a tight turn around towards the end of a cycle because that’s when the features going into the release are announced. If we don’t follow all new features we might miss one or more that advance to release at the very end.

#accessibility-team-meeting, #team-reps