Keyboard Warriors [A to Z a11y]

Image of a Samurai style emoji at a keyboard. The phrase "Keyboard Warriors" written on keyboard caps.

A long time ago…

When I was a lad a mouse was something that went “squeak” and you definitely didn’t want on your desk. Keyboard Warriors were people who could type, code, and make computers bend to their every whim. Not the cowardly so-called keyboard warriors of today who spew bile, but true magicians. OK, so I’m old… but back then all we had was a keyboard (and a joystick for games if you were lucky) to operate our computers.

As the mouse started to make an appearance we still coded to cater for keyboard navigation. At first only the graphics designers had mice after all, but even once they became an office infestation we still were keyboard jockeys at heart. We were the samurai, the Keyboard Cowboys…. (yeah, a quote from Hackers – amazing movie!).

YouTube clip from the movie “Hackers”

As technology has moved on, so has the way we interact with devices and so the keyboard as a navigation tool has become a relic of a bygone age. Yet it, along with other alternative ways of working, is an important consideration when we look at Accessibility. So, just for a few minutes, imagine if you could not use a mouse and relied on a keyboard.

This section applies to Power Apps, Power BI, Power Pages, Power Virtual Agents, and anything else that you may design/code for.

All hail the mighty Keyboard Shortcuts

When people started to design programs, we never called them Applications back then, they had to work out the most efficient and effective ways of accessing functions and parts of their program without impacting on what the user would need.

It’s no good using the Tab key to navigate around a word processor app as people need that key for writing their documents. In other places the Tab key was the best key because it was never used. We ended up with esoteric key combinations that still live on in part today. For example try using good old Lotus 123 keyboard commands in Excel – they still work!

As the Graphical User Interface started to make more of an appearance on our lives, and we started to build programs that embraced this new way of interacting, the Tab key became the Jump key. On every control there would be a Tab-Index property that would dictate where this control would appear as you pressed Tab to jump around.

For the old traditionalist keyboard jockeys, this allowed them to still work the way they knew best, but also welcome the new squeaky world order. Then, over time, people got so used to the WIMP (Windows, Icon, Mouse, Pointer) way of working that it’s only the dinosaurs like me who hearken back to days of old when offices reverberated to fast-paced clicking of mechanical keyboards.

Return of the Tab

In the mad dash for a shiny new UI we embraced devices that were so un-ergonomic that they created health issues for those early adopters. In my case I need to use a vertical mouse for my daily life as a standard mouse, if used too much, causes me major pain. Then there are those who cannot use a mouse at all. Folks who don’t have the ability to move a pointer due to restricted arm movement, but they are able to use adaptive keyboards etc.

For these reasons, along with others, we are seeing and increased focus on making apps and websites, along with operating systems and other digital media, work with keyboards.

Of course keyboard control has never vanished, we are all familiar with Ctrl-C and Ctrl-V for instance and then think about how many times you press the space bar to pause and play videos. We’ve just focused on convenience rather than thinking about a bigger picture. It’s now time to consider the importance of the Tab key!

Image of a Tab key from a keyboard

The Ordering of ThingZ

So let’s talk about bringing some order to this. Unless things are explicitly ordered the Z pattern is the big thing that dictates the directions that keyboard navigation and screen readers will work. Left-to-right and Top-to-bottom. This order applies to everything from User Interfaces, to Documents, to Portals/Websites, and Power BI Dashboards/Reports which makes this a major consideration when it comes to layout design.

Where this does become a bit murkier and less obvious is when we throw containers and groups into the mix. I won’t provide any spoilers here but this naturally flows into the next letter in this series!

The end result of this pattern is that we need to consider layout as more than just aesthetics and start to plan it out in terms of the way that we would want the flow to be if we laid it out in a straight line.

Time to become an OG Keyboard Warrior

As with all things to do with accessibility the best way to test this out is with people who do this every day, but in the case of Keyboard Navigation it is something that is easily tested yourself.

It is always worth putting the mouse to one side and trying to use your computer without it. Just use the keyboard and see how it works. This can have a twofold benefit as not only do you get to test out accessibility and gain understanding, but you may also learn some shortcuts and ways of working that will make your life easier.

You can click here to read more about how Keyboard Navigation fits in to the WCAG standards.

Thanks for reading A to Z a11y – Keyboard Warriors

Thank you for reading Keyboard Warriors. This post is part of my [A to Z a11y] series the “A to Z Accessibility: Power Platform Edition”. Click here to go to the introduction article where you can find a Table of Contents. You can also check out the Accessibility section of the website from the top menu or by going directly to the category page here.

Content in this series is ©Mike Hartley. I am happy for folks to quote or reuse snippets (with attribution), but this has taken a lot of work to compile so please do not copy whole sections. If there are any corrections or suggestions, then please use my social links to contact me. I am always happy to add additional content and remarks with full credit given. Likewise, these pages will evolve as my learning and understanding grows, so make sure to keep this bookmarked.