Title: Theme Pattern Library – Make WordPress Accessible --- # Tag Archives: Theme Pattern Library [ ](https://profiles.wordpress.org/davidakennedy/) [David A. Kennedy](https://profiles.wordpress.org/davidakennedy/) 12:01 am _on_ March 24, 2015 Tags: Theme Pattern Library    # 󠀁[Accessible Theme Pattern Library Update for March](https://make.wordpress.org/accessibility/2015/03/24/accessible-theme-pattern-library-update-for-march/)󠁿 Another month has passed, and work 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) 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 JavaScriptJavaScript JavaScript or JS is an object- oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. [https://www.javascript.com](https://www.javascript.com/) and ARIA. * Two more patterns in progress: responsive menu and mobile menu modal. We’ve moved from separate repositories 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 by the repository owner. [https://github.com/](https://github.com/) to just one. All the patterns live in sub-directories within that repository. It’s called [a11ythemepatterns](https://github.com/wpaccessibility/a11ythemepatterns). Within that, we also have a basic [readme file](https://github.com/wpaccessibility/a11ythemepatterns/blob/master/README.md) and a [contributions file](https://github.com/wpaccessibility/a11ythemepatterns/blob/master/CONTRIBUTING.md), explaining how to contribute. You can see the in-progress patterns in the [issues on Github](https://github.com/wpaccessibility/a11ythemepatterns/issues). **Note**: The patterns are also still available via their own separate repositories, which you can see [on our Github account](https://github.com/wpaccessibility). Don’t use/fork those, as they’ll be removed soon. Use the [a11ythemepatterns repository](https://github.com/wpaccessibility/a11ythemepatterns). If you have questions, don’t hesitate to ask in the comments. [#theme-pattern-library](https://make.wordpress.org/accessibility/tag/theme-pattern-library/) [ ](https://profiles.wordpress.org/davidakennedy/) [David A. Kennedy](https://profiles.wordpress.org/davidakennedy/) 4:27 am _on_ February 11, 2015 Tags: Theme Pattern Library    # 󠀁[Accessible Theme Pattern Library Update for February](https://make.wordpress.org/accessibility/2015/02/11/accessible-theme-pattern-library-update-for-february-2015/)󠁿 About a month ago, I announced that work on an [accessible theme pattern library had started](https://make.wordpress.org/accessibility/2015/01/15/wordpress-theme-pattern-library-for-accessibility/). Progress has moved forward steadily since then. Six people have volunteered to create patterns and code has been written! 🙂 The volunteers are myself, [@cheffheid](https://profiles.wordpress.org/cheffheid/), [@joedolson](https://profiles.wordpress.org/joedolson/), [@chrisdc1](https://profiles.wordpress.org/chrisdc1/), [@arush](https://profiles.wordpress.org/arush/) and [@rianrietveld](https://profiles.wordpress.org/rianrietveld/). You can see the [list of patterns on this Google Doc](https://docs.google.com/spreadsheets/d/1k27lS034KN0PNd9oQyxdRTmRMZrxO8OB_XHweDoT_Go/edit?usp=sharing). I’ve also created the appropriate [repositories on Github](https://github.com/wpaccessibility) for the patterns that people volunteered to lead and/or create. I’ve kicked things off with [code for Read More links](https://github.com/wpaccessibility/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](https://docs.google.com/spreadsheets/d/1k27lS034KN0PNd9oQyxdRTmRMZrxO8OB_XHweDoT_Go/edit?usp=sharing). For contributions, we’ll use the [fork and pull method](https://help.github.com/articles/using-pull-requests/#fork--pull). * If you have an idea for a new pattern, comment on [this page and leave your idea](https://make.wordpress.org/accessibility/accessible-theme-pattern-library-ideas/). * If you want to lead the creation of a pattern, [ping me in Slack](https://make.wordpress.org/chat/)( 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](https://make.wordpress.org/accessibility/tag/theme-pattern-library/). [#theme-pattern-library](https://make.wordpress.org/accessibility/tag/theme-pattern-library/) [ ](https://profiles.wordpress.org/davidakennedy/) [David A. Kennedy](https://profiles.wordpress.org/davidakennedy/) 5:08 am _on_ January 15, 2015 Tags: Theme Pattern Library    # 󠀁[WordPress Theme Pattern Library for Accessibility](https://make.wordpress.org/accessibility/2015/01/15/wordpress-theme-pattern-library-for-accessibility/)󠁿 We want to make creating [accessibility-ready themes](https://make.wordpress.org/themes/handbook/review/accessibility/) 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 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 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](https://make.wordpress.org/themes/handbook/review/accessibility/required/). 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 CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. markup and expand on that.) * Outline/:focus style examples * Tabs * Accordion ## Implementation After feedback from the Accessibility team, especially in a [recent meeting](https://wordpress.slack.com/archives/accessibility/p1421261701000056), I think the best way to implement is: * **Giving each pattern its own repository**: Each pattern (including whatever 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., CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site., JS and PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. [https://www.php.net/manual/en/index.php](https://www.php.net/manual/en/index.php) needed) would be in a self-contained repository under this [Github organization](https://github.com/wpaccessibility). 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](https://make.wordpress.org/accessibility/). * **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 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 by the repository owner. [https://github.com/](https://github.com/) 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](https://help.github.com/articles/using-pull-requests/#fork--pull). **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](https://make.wordpress.org/accessibility/tag/theme-pattern-library/)