Quick Wins for Accessible WordPress Themes
You may not know where to start when trying to create an accessible-ready WordPress theme. It’s easy to become overwhelmed at the thought of tackling accessibility, but it doesn’t have to be.
You can knock out several quick tips along the way, which will help your theme be more accessible.
What is Web Accessibility?
First, what is web accessibility? Definitions vary. I like:
The practice of making websites and applications usable by people of all abilities.
Now that we have that out of the way, let’s get to the tips.
1. Start with Accessibility in Mind
Accessibility spans all the disciplines:
- Project management
- User Experience
- Design
- Development
- Testing
You have to start with it as an objective in order to reach it.
2. Find a Good Base
You don’t have do do it all. Look here for help when beginning a theme:
- Starter theme: Underscores
- Default theme: Twenty Thirteen
- Child theme: Accessible Twenty Eleven
- Custom theme: Blaskan
- Custom theme: Accessible Zen
3. Color Matters
High contrast helps everyone.
- Text and images of text have a contrast ratio of at least 4.5:1
- Large text (over 18 point or 14 point bold) has a contrast ratio of at least 3:1
Choose wisely:
4. Sweat the Small Stuff
Because it can make a big difference.
- Be mindful of your reading order
- Skip nav links = awesome
- Keep the underline on links and define focus styles
- Relative units on fonts = also awesome
- Keep titles with 'Read more…" links
5. Wait a Minute!
I know what you’re thinking. I didn’t really talk too much about WordPress themes. That’s true because accessibility is more about people than technology. When you’re building your themes, keep your users at the forefront, and know yourself and your team. That will help you more than anything.
_This blog post served as inspiration for a Lightning Talk at WordPress DC, called Quick Wins for Accessible WordPress Themes_. You can view the talk slides on GitHub._