A news post

When you build a house, you start with the foundation. It becomes the base upon which you form everything else around. Without it, your house could crumble because of improper construction. Web accessibility shares some of the same principles. You need a solid foundation to have an accessible website and WordPress theme.

Keyboard accessibility can serve as your foundation for an accessibility-ready theme, helping you create a base that you can build on with confidence. Once you have it in place, accessibility becomes easier as you go.

Keyboard Accessibility Principles

But where do you start? You can tackle any of the four principles below one at a time. Pick one, practice implementing it in your next theme, and you’ll see the benefits. Bringing these to your project matters more than mastering them in any specific order.

Watch your Source Order

Keep your source order in mind. Source order means how your HTML is ordered and how it flows on the page. As you create your theme, make sure that it’s logical. Turning off CSS provides a good, simple way to test this. Once everything on the page becomes linearized, does it still make sense?

Links and Buttons are Links and Buttons

Use semantic HTML and controls that have accessibility already built in. This means that links Home and buttons Main Menu are your best choice. Only three elements in HTML can be focused on by default: links, buttons and form fields. If you use a

or to create an element that’s clickable via JavaScript, a keyboard user will not be able to reach that element. Sure, you can use JavaScript to make it focusable, but why would you if HTML already does the work for you? If you don’t like the default styles of a normal , then you can style it however you’d like with CSS.