Selecting keyboard shortcuts for your app

Featured Image

Does your app need keyboard shortcuts?

Keyboard shortcuts have come a long way from a tool for just power users to an essential input method for many knowledge workers. We don’t think every app needs keyboard shortcuts, but you should consider adding them if any of the following apply to you.

  • Your users should spend a lot of time in your app. This isn’t true of most apps. But a tool that benefits from frequent usage – like a note-taking product or task management system – likely involves users repeating the same actions over and over again. In these situations, keyboard shortcuts can speed up such operations and keep your users in flow.
  • Some of your users spend a lot of time in your app. For example, many B2B tools have a user permissioning model, where some users are admins with access to much more functionality than others. These users spend more time in your app and could benefit from shortcuts, even if they don’t represent the majority of your users.
  • Your competitors have keyboard shortcuts. Ok, this might not be a great reason if you think your competitor shouldn’t have keyboard shortcuts. But many apps highlight keyboard-driven navigation as a primary feature. If you don’t, your prospective users might raise eyebrows. If most of your competitors offer them, you don’t have much of a choice.
  • Your users should be accustomed to your app’s workflows. Providing a rich set of keyboard shortcuts enables lightning-fast execution of advanced workflows. Once your users have internalized the bindings of your app, they are invested in your app and workflows. In this scenario, switching to another app with different or no shortcuts would come with a severe productivity hit.

We dug into CommandBar data to look at how common keyboard shortcuts are and who uses them. We saw some fascinating results.

  • More users use keyboard shortcuts than you think. A stat that’s often thrown around is that only 1% of Gmail users use keyboard shortcuts. But in our data set, a staggering 64% of CommandBar users have used at least one keyboard shortcut and 20% have used keyboard shortcuts at least 10 ten times. This is despite the fact that only 6.2% of CommandBar commands have default shortcuts assigned to them.
  • Keyboard shortcuts get used a lot. For commands with shortcuts attached, a staggering 95% of command executions came from a shortcut. This value can be explained by power users who spend a lot of time in your app and are keen to adopt shortcuts.
A double bar chart showing (a) the % of overall users; and (b) the % of overall executions that come from a few groups of users -- those that have executed 0 shortcuts vs 1-9 shortcuts vs 10-99 shortcuts vs 99+ shortcuts. Only 36% of users have not executed a shortcut. For users that have executed 99+ shortcuts, while they represent only 5% of total users, they account for 90% of total shortcut executions.

Ok, so you want keyboard shortcuts in your app now. The single most important aspect in helping users achieve keyboard mastery with your software is coming up with a coherent, well-thought-out collection of shortcuts. We believe that many apps are lacking in this regard, so doing a good job can help differentiate your product.

Here we introduce five best practices (TRACK) to help you do just that!

Which commands need a shortcut?

Before getting into the details of TRACK, you need to know which functions and pages should be accessible via keyboard shortcuts. For complex applications that span hundreds of features and use cases, this is a hard problem in itself.

If your app happens to have a command bar powered by CommandBar, you are in luck. You will already have a well-defined set of commands to choose from. You might even have access to analytics data, highlighting commands that are used frequently and therefore prime candidates for being used via keyboard shortcuts.

Table of a "Command Summary". Includes, the command name, whether it is live, and how many times it has been executed.

In general, every action that is used often should be usable via the keyboard, ideally directly via a shortcut. To find these actions, try to use the most essential workflows of your app without touching the mouse. At this stage of the process, you shouldn’t worry about how efficient doing it with the keyboard is, but it has to be possible.

If you don't assign a shortcut for an essential action that is part of many distinct workflows, your entire shortcut implementation efforts will be devalued substantially.

An action graph. Shows flows for a user moving across different pages and actions in an app, differentiating paths that can be taken with and without keyboard shortcuts.

Unfortunately, capturing every common workflow with default shortcuts is not always possible. If your app is complex, your users might not even agree on what constitutes a typical workflow. Features rarely used by one group of users might be part of the essential workflows of another group. CommandBar solves this problem by enabling your users to set custom shortcuts for any command and to change existing default bindings.

What makes a good set of shortcuts?

Let’s say you have found all the actions that you want users to be able to invoke via shortcuts. That’s great, but unfortunately, much work is ahead of you. If you don't pick the right default key combinations, your users will not be able to remember the shortcuts. Even if they can customize them, good defaults matter. Many users won’t customize your shortcuts or will only do so after they’ve become committed users.

If your shortcuts are non-intuitive, most users will fall back on using the mouse. Unfortunately, this effect can trigger a feedback loop where only a few power users are using shortcuts, leading you to believe that spending time on improving your keyboard shortcuts isn’t worth it.

Having a CommandBar helps to soften the blow of bad default shortcut choices since users can always use commands through CommandBar and be re-taught the shortcut But keyboard shortcuts – especially certain classes we will discuss below – are much faster even than going through the CommandBar.

Before we get into what makes a good set of shortcuts, look at the figures below to become familiar with some terms we will be using. The following shows a typical keyboard shortcut consisting of several keys pressed together. Such a combination of keys may contain several modifier keys, but at most one non-modifier key.

Example composition of a keyboard shortcut: modifiers and non-modifiers. The example here shows the "command" key (modifier), the "shift" key (modifier), and the "H" key (non-modifier) being used at the same time.

A shortcut sequence can contain multiple non-modifier keys, but they need to be pressed in sequence.

Visual diagram of a "sequence" shortcut, where keys are pressed in succession. In this example, the "G" key is pressed before the "H" key.

It’s also possible to combine the two approaches, meaning that the individual sequence parts consist of multiple keys that have to be pressed together.

Having clarified the terminology, we can finally turn our attention to what makes a good set of keyboard shortcuts. We have defined five criteria. Together, they form the acronym TRACK

The five principles mostly play into each other. Unfortunately, sometimes, they are contradictory. The decision of which metric to optimize for depends on your app and target audience.

(T)yping Efficiency

Shortcut users value efficiency. If your keyboard shortcuts are clunky and require finger acrobatics, that will not leave a good impression.

Abstract image of a user's hands typing multiple keys simultaneously.

As a general rule, a shortcut shouldn't have more than two modifier keys. Holding down more than three keys at the same time is awkward. Ideally, a shortcut can be used with just the left hand, enabling right-handed users to operate the mouse in parallel. Also, the home row keys can be considered especially convenient as touch typists literally will not have to lift a finger to reach them.

Shortcut sequences typically take longer to type. We strongly recommend sticking to two sequence parts.

For this post, we have had the chance to leverage statistics from KeyCombiner, an app that facilitates learning and practicing keyboard shortcuts, maintained by CommandBar engineer Thomas Kainrad. KeyCombiner users have performed a combined total of 32,000 1-minute training sessions providing us with a trove of interesting data to draw from.

During practice, KeyCombiner measures how much time it takes a user to type a particular shortcut. On average, it takes a user 1.8 seconds to type a shortcut with one modifier from memory. That number goes up by 11% (to 2 seconds) for two modifiers and 17% (to 2.1 seconds) for 3 modifiers. Sequences with two parts take users 2.3 seconds to type on average.

(R)ememberability

Productivity gains from using keyboard shortcuts become apparent once a user can type them from muscle memory. Therefore, a fundamental attribute of a well-designed shortcut collection is that it is easy to remember.

So-called Go To shortcuts excel in this category. It is a convention to use this type of shortcut for navigation commands. Such a shortcut is a sequence of the G key and another key that is the first letter of the page title to navigate to. For example G Then I to go the Inbox in Gmail. Even if you are not using Go To type shortcuts, you should try to convey meaning by using appropriate letter keys.

Sequences other than G THEN X, such as Ctrl+h THEN Ctrl+i, are hard to remember. Instead of just one set of keys, users have to recall multiple sequence parts. Therefore, most keyboard shortcuts consist of a number of modifier keys and exactly one non-modifier key that all have to be pressed at the same time.

Remembering the required modifier keys is just as important as remembering the non-modifier key. If your app has a relatively small number of shortcuts, the easiest approach is to stick with a single modifier key for all shortcuts. Usually, this will be Command on macOS and Ctrl on Windows and Linux. Keep in mind that many browser default shortcuts use these modifiers, too. If you define keyboard shortcuts via CommandBar’s editor, it will warn you about potential conflicts.

CommandBar Editor warning on a keyboard shortcut, showing that the shortcut "ctrl+p" conflicts with the default browser shortcut for "Print page" on Chrome, Firefox, Edge, and Opera.

In addition to picking memorable key combinations, you should try to educate your users and onboard them to your shortcuts. Users that spend months navigating your app with the mouse are unlikely to switch to keyboard shortcuts later on. CommandBar solves discoverability for keyboard shortcuts by showing them in the bar next to each command.

An example CommandBar, where the user's query "go to" matches five commands that navigate to other pages. On each command, there is a keyboard shortcut with the pattern "G then X", where "X" is the first letter of the page title.

To back up these claims on rememberability, we will have another look at practice statistics from KeyCombiner. For each shortcut, the software calculates a confidence score based on the user’s practice performance. Above a specific threshold, the shortcut counts as learned. We can use this data to explore how long it takes people to learn different types of shortcuts.

As it turns out, arbitrary sequences are very hard to learn. It takes on average 12 practice runs for them to stick in a user’s memory.  Go To type sequences that start with a G followed by another letter are 57% faster to learn, requiring just 5.2 practice runs on average.

The same goes for shortcuts with just one modifier, which need to occur in 4.9 sessions on average for a user to remember them. However, this is heavily dependent on the modifier being used, as we will see in the next section. With two modifiers, the situation is already much worse as users need 6.3 runs on average.

Single letter shortcuts are the easiest to remember. It takes users 4.8 training runs to engrain them into their muscle memory. The downside is that users will not be able to use them within input fields.

Shortcut

Average training runs

Arbitrary sequence

12

Go to

5.2

One modifier

4.9

Two modifiers

6.3

Single letters

4.8

(A)dherence to Conventions

Your app’s users will already be familiar with a variety of keyboard shortcuts from their operating systems and other applications they are using. To put it bluntly, your users probably spend more time in other apps than in yours, and so use other shortcut combinations more than yours.

Therefore, they will have certain expectations regarding your app’s default shortcuts.

It is absolutely essential that you meet these expectations. Learning new shortcuts is hard enough, but having to learn bindings that conflict with muscle memory developed over years is something that your users simply will not do.

Unfortunately, these conventions can be problematic for international users. For example, the / key is often used for search even though it does not work on many layouts. We will go into more detail on this below.

Another pitfall with conventional shortcuts is that they are often used for browser actions already. Most of the time, it is fine to override browser defaults. However, some important shortcuts like Cmd/Ctrl+f should be left alone as users will expect those to work at all times. Other browser defaults, such as Cmd/Ctrl+t are reserved by common browsers and cannot be overridden at all. When setting a shortcut via CommandBar’s editor, you will be warned about both browser defaults and browser reserved shortcuts.

CommandBar Editor warning on a keyboard shortcut, showing that the shortcut "command+t" conflicts with the default browser shortcut for "New tab" on Chrome, Firefox, Edge, Opera, and Safari.

Once again, we can illustrate these observations using practice data from KeyCombiner. Shortcuts using Command as their single modifier on macOS and Ctrl on Windows/Linux take just 4.2 practice runs to learn. Typical bindings such as Cmd+s or Cmd+f even sit comfortably at 3.2 practice runs. On the other hand, unusual modifiers, such as Alt on Windows/Linux and Option on macOS come with a massive penalty, bringing the number of required practice occurrences up to 7.2.

A nice little tool for making sure that you are not breaking any conventions is KeyCombiner’s keyboard shortcut search. It can search by keys or description over its database of keyboard shortcuts from 100+ applications. For example, searching for Ctrl/Cmd+a makes it clear that this shortcut is supposed to be used for bulk selection. If it does anything else in your application, users will have a hard time remembering it.

(C)oherence

For more complex applications and larger sets of keyboard shortcuts, it is essential to think about the coherence of your selected bindings and how they relate to each other. First and foremost, make sure that your keyboard shortcuts do not conflict with each other. Conflicts happen primarily with sequences or when specific shortcuts are only active in some areas of your app.

CommandBar flags such conflicts even before the respective change is shipped to users.

CommandBar Editor warning on a keyboard shortcut, showing that the shortcut "G THEN P" collides with the shortcut for another command.

Avoiding conflicts will become more challenging as your set of shortcuts grows to dozens or even hundreds of commands. User-customizable shortcuts remove the need to pick a shortcut for every niche action, elegantly solving this problem.

If you use Go To shortcuts for navigation commands, you should use them for all navigation commands. Ideally, your users can rely on these without ever consulting the docs.

Similar thinking applies to the usage of modifier keys. As discussed above, sticking with a single modifier key for all your app’s keyboard shortcuts is best. If that is not possible due to the complexity of your app, make sure to use the same modifiers for the same type of actions.

As your set of shortcuts grows larger, it can be challenging to keep up with potential conflicts and inconsistencies. To help with this, KeyCombiner has a visualization tool that maps a set of shortcuts onto a virtual keyboard.

A keyboard shortcut collection visualizer for XCode, showing single-, double-, triple-, and quadruple-key shortcuts.

(K)eyboard Layout Support

Many software users across the globe are unable to use a good portion of web apps’ shortcuts on their keyboards. The reasons are that their keyboard layouts simply do not contain the required keys and that processing key presses with JavaScript is complicated and error-prone.

A straightforward way to avoid this problem is sticking with letter and number keys that exist on almost any keyboard layout. You should try to avoid special characters, especially /,\, [,],`. Unfortunately, that’s not always enough. Some more exotic layouts can even be problematic with letter keys, depending on your shortcut processing code.

A better approach is letting users customize their keyboard shortcuts. Instead of you fixing the problem for a particular layout or key, users across the globe can set any shortcut to whatever works on their end. We have a blog post on how this feature works with a CommandBar.

Advanced Considerations

If you get the TRACK aspects right, there are still pitfalls that can severely impact your user's experience.

First, to reiterate, ensure not to miss any essential action when assigning keyboard shortcuts. Having to reach for the mouse in the middle of a frequent keyboard-driven workflow is frustrating.

Furthermore, even the best set of shortcuts is meaningless when users are not aware of it. Therefore, a full list of available keyboard shortcuts should take a prime spot in your documentation pages. In addition, you can experiment with in-app hints, such as tooltips, or rely on CommandBar’s display next to every command.

Implementing keyboard shortcuts is especially challenging when your app is focused on text editing. In this case, you need to make sure that important shortcuts work also while the focus is put on an input field. This means that using Go To shortcuts is no longer an option. Instead, you have to rely on modifiers other than Shift. If users can’t be certain that typing a shortcut triggers the desired action, they will quickly lose trust and fall back to the mouse entirely.

The same problem can appear when your app provides multiple views onto the same domain items. For example, consider a project management platform that can display tasks in both kanban boards and lists. Any operation that can be applied to a selection of tasks should work in both views.

Conclusion

This article covered five criteria to consider when choosing a set of keyboard shortcuts. Unfortunately, some of these criteria are conflicting, and the perfect set of shortcuts might not exist.

The most important takeaway should be to make a deliberate effort. For advanced users, it’s easy to spot when an app has shortcuts just for the sake of it. But, on the bright side, a well-designed set of shortcuts can motivate users to commit to learning your app.