Introducing the WordPress Component Library
Jon Bellah on
We’re proud to introduce the WordPress Component Library: a collection of front-end components constructed with WordPress and accessibility at the forefront.
Many of the HTML and CSS components we build for our clients are structurally similar, particularly for prolific features like menus, search forms, posts, and blogrolls. A common starting point offers efficiencies to our clients while simultaneously raising the bar on polish and compliance with standards like accessibility. In evaluating existing libraries, we found that the industry was missing a good, open source project built with WordPress’s often opinionated markup (e.g. menus) and basic layout structure in mind.
Since accessibility is a top priority for many of our clients, and critical to our mission to make the web a better place, each component in the library is WCAG 2.0 accessible. We think that this project will help engineers and clients who value accessibility, but may struggle to budget for it, achieve a higher standard with little-to-no added cost.
We are actively adding to and improving the components. Hosted on GitHub, we welcome feedback, questions, and pull requests.
Comments
Thank you very much for sharing.
Awesome work! ????
I have a question regarding the Responsive Navigation component.
https://10up.github.io/wp-component-library/component/responsive-navigation/index.html
Do you think it’s a good practice to use the parent link as a dropdown toggle/anchor as the alternative to the link of the parent page? I feel this could be addressed in more detail.
Thanks again for a great #a11y resource.
Hey Lucijan,
Thank you! And great question.
Our navigation component follows the guidelines and recommendations set forth here: https://www.w3.org/WAI/tutorials/menus/flyout/
If you have other questions, please feel free to open an issue on our GitHub repo!
I’m not able to display the dropdown portion of the navigation using my keyboard alone. Am I missing something?
Nice project! I’ll have a look! Thanks for sharing!
Awesome project, thanks for sharing.
Huge kudos on this.
Given that we are backend developers, I have been wanting to see someone with clout in the WordPress space launch something like this for a while. I really hope that it can establish itself as a compelling standard for reusable markup in the WordPress theming space, especially for custom projects.
This is awesome!!
Thanks for sharing these. They look like a nicer starting point that _s components and I think will be easy to integrate with our own existing Bourbon/Neat/Bitters based starter files.