Accessible Theme Pattern Library Update for March

Another month has passed, and work on the Accessibility Theme Pattern has chugged along.

What’s Happened? We have code committed for four additional pattens, beside the read more links one that got us going. They are:

  • A skip link.
  • A skip link for Genesis themes.
  • Dropdown menus with jQuery and without jQuery.
  • Comment form, enhanced with JavaScript and ARIA.
  • Two more patterns in progress: responsive menu and mobile menu modal.

We’ve moved from separate repositories on Github to just one. All the patterns live in sub-directories within that repository. It’s called a11ythemepatterns. Within that, we also have a basic readme file and a contributions file, explaining how to contribute.

You can see the in-progress patterns in the issues on Github.

Note: The patterns are also still available via their own separate repositories, which you can see on our Github account. Don’t use/fork those, as they’ll be removed soon. Use the a11ythemepatterns repository.

If you have questions, don’t hesitate to ask in the comments.

#theme-pattern-library

Accessible Theme Pattern Library Update for February

About a month ago, I announced that work on an accessible theme pattern library had started. Progress has moved forward steadily since then.

Six people have volunteered to create patterns and code has been written! 🙂

The volunteers are myself, @cheffheid, @joedolson, @chrisdc1, @arush and @rianrietveld. You can see the list of patterns on this Google Doc. I’ve also created the appropriate repositories on Github for the patterns that people volunteered to lead and/or create. I’ve kicked things off with code for Read More links, modeled after Twenty Fifteen.

What’s Next?

  • We’ll start writing more code. If you want to contribute, fork one of the existing repositories and make a pull request. If you code exist yet, get in touch with the lead for that pattern. You can find that in the Google Doc spreadsheet. For contributions, we’ll use the fork and pull method.
  • If you have an idea for a new pattern, comment on this page and leave your idea.
  • If you want to lead the creation of a pattern, ping me in Slack (davidakennedy) and let me know. I’ll add your name to the spreadsheet in Google Docs.

If you have questions, just comment on this post. You can follow along with our progress via the Theme Pattern Library tag.

#theme-pattern-library

WordPress Theme Pattern Library for Accessibility

We want to make creating accessibility-ready themes as easy possible. To do that, we’re working on building a library of accessible patterns for themes. That way, theme authors can learn about and implement accessibility in their themes with ease.

Goals

The goals are simple:

  • Become a central resource for WordPress theme developers to learn about and how to implement accessible patterns for accessibility-ready themes.
  • Patterns should be self contained and have as few dependencies as possible.
  • Be a codebase that gets tested rigorously, evolves constantly and keeps it simple.

Pattern Ideas

I have a handful of pattern ideas that should be included, most of which help meet the current accessibility-ready requirements. This isn’t an exhaustive list, of course, and other patterns would be needed and welcomed.

  • Skip link (in Underscores)
  • Mobile menu toggle (in Underscores)
  • Menu drawyer, expand from side
  • Menu overlay
  • Continue reading links (in Underscores, partly)
  • Form label and field patterns (start with Core markup and expand on that.)
  • Outline/:focus style examples
  • Tabs
  • Accordion

Implementation

After feedback from the Accessibility team, especially in a recent meeting, I think the best way to implement is:

  • Giving each pattern its own repository: Each pattern (including whatever HTML, CSS, JS and PHP needed) would be in a self-contained repository under this Github organization. Theme authors could just download the repos, drop in the code and go.
  • A page that explains the different patterns and their purpose. This would probably be a page in our future handbook or on our Make site.
  • A link to a demo. Showing the working pattern would be nice, but not a requirement. I would like to see different patterns created first before we worry about this aspect. To me, this comes later.

What’s Next

This is only a rough list of basic steps:

  • Start working on patterns needed for accessibility-ready themes.
  • Establish a code contribution policy.
  • Develop a testing policy.
  • Test patterns as they get created.
  • Release patterns.

We can release one pattern at a time really, as we create and test them.

Questions

I have an idea for a pattern. Can I work on it? Yes, just let me know in the comments, so I can keep track of who’s doing what and make sure we don’t have people working on the same pattern. That way, I can connect people for collaboration.

How do I get access to the WPAccessibility repositories so I can commit code, etc.? You should develop the pattern on your own Github account or locally first. Once I have a list of patterns being worked on, we’ll create repositories for them and go from there. We will likely adopt the fork and pull method.

What about theme frameworks? Can I submit a pattern for it? Yes, we’d like to cover as many methods of theming as possible.

Can I include Sass, Less, Grunt, Gulp, build tool, etc.? For now, please create patterns with as few dependencies as possible. Accessibility can be intimidating and we want keep the barrier to entry as low as possible.

If you want to be involved, make sure you’re following this blog. You’ll see updates here. If you have other ideas or questions, let us know in the comments.

#theme-pattern-library