← Back ⎮ Gabriela Véghová   ⎮   UX Designer

Designing for efficiency—keyboard shortcuts

There are many applications, websites, and digital media that strive to get your attention, allow you to be creative, and create a plausible experience. But more often than not, users don’t really care about building a relationship with a piece of software, they just want to get their job done. This is especially true for digital tools in the B2B world. There you don’t only want to work efficiently, but you also want your colleagues and employees to have the right tools for efficient work. Only then they can do their best.

Keyboard picture

Why keyboard interaction and shortcuts help with efficiency

Keyboard interaction helps you to be more efficient, since it takes less time to perform a keystroke over pointing and clicking on an object on the screen. Particularly, a keystroke seldom takes more than 0.3 second[1] while a point-and-click interaction heavily depends on the item to be clicked, but can often take a second or more[2]. Therefore we can assume that using a keyboard over a mouse can make us about three times faster. Also, moving hands from mouse to keyboard and back takes significant time.

Where it’s convenient to use shortcuts

There are several applications where it’s especially useful to allow keyboard interaction with shortcuts:

Types of shortcuts

As a product designer, you’ll probably be focused on the product shortcuts, but you should keep in mind how the other work, too.

OS and browser shortcuts

You are probably pretty familiar with many OS and browser shortcuts like CTRL+C, CTRL+V, CTRL+N, and CTRL+F. Keep in mind there are quite a lot of them and they may be useful and already functional in your application even if you weren’t fully aware of it (see shortcuts for Windows, Mac, Chrome, Firefox, Edge, IE, Safari).

Do not disable or change any of OS or browser shortcuts. If you are thinking of disabling or changing some of them due to security reasons (eg. disabling paste for enter password field) you may not only make the usage more annoying but also less secure in the end [3] [4]. Always try to find alternative ways to achieve your goal first.

You may think you should change these shortcuts in case you keep the existing functionality while significantly enhancing it (eg. opening a custom search field with additional functions when pressing CTRL+F in a browser). This may work, but make sure your solution is as robust as the default one. Also, for search, it’s better to use a separate search field on your site and use / as the shortcut for focusing the field.

Product shortcuts

Product shortcuts are specific for a product or a family of products (eg. Adobe products or Atlassian products). They can either work in the whole product or in a particular context or section and we can distinguish:

These can either be a single key, combination of keys (whether you need to press them all at once or in a specific order), or holding a key while you’re using the mouse.

Contextual shortcuts

As you can guess from the title, contextual shortcuts are only available in the particular context of the product. This can either be in a whole section of a product (e.g. an article in a content management system or invoices section in accounting software) or a specific UI element like text field, modal, wizard, calendar and so on.

How to create new shortcuts

When you are creating new shortcuts in your product, there are some good practices:

Shortcuts for text editing

When editing text, the need for shortcuts changes from the rest of the product, especially when many of the shortcuts consist of letters. There some options how to cope with that:

Commonly used shortcuts

Some of the existing shortcuts became so common that your users may automatically try them in your product without the need to learn anything.

Working with files and items

CTRL + N new file, folder, or main item
N then letter create new item, starting with letter, eg. N then M for new message
F2 rename selected object
D next item (sometimes delete)
CTRL + N new file, folder, or main item
F2 rename selected object
D then letter next item (sometimes delete)
K next item
X select (sometimes next or delete)
J next item
P previous item
# delete
S or SHIFT+S save
E edit
CTRL + next
CTRL + previous
/ jump to search field
G then letter go to a section, starting with letter, eg. G then M for go to messages
? open help menu or show shortcuts cheat sheet
ESC back


R reply
A replay all
F forward
C create or compose an email

Working with video

SPACE start/play/pause
1, 29 go to 0%, 10%, 20%… 90% of the video
F fullscreen
ESC exit fullscreen
M mute
or increase or decrease volume
or go forward or back 5 seconds


Once you have your shortcuts in place, make sure they are discoverable. They don’t need to be very visible, though, since you don’t want to disturb novice users. Most common places to show them are menus and tooltips on buttons. These are useful since the user can learn about them without actively trying to find any shortcuts.

shortcuts shown in tooltips and menus in Google Doc 1] shortcuts shown in tooltips and menus in Google Doc 2]
Examples on how are shortcuts shown in tooltips and menus in Google Docs

Less common, but similarly (if not even more) useful are tips in modals, pages and in context you may need to use a shortcut. They can also notify you on how to do the action you already did in a more efficient way next time.

shortcut in context in Github]
Tip on how to use a shortcut in context in Github
shortcut in context in Github]
Tip on how to get to this modal easier next time in Confluence

A cheat sheet can tell you about all shortcuts available in the software as well as in the particular context. It’s useful to have it not only available under ? button, but also from the UI where the user may find it without knowing about shortcuts at all.

Keyboard shortcuts in Slack in UI] Keyboard shortcuts in Slack
Keyboard shortcuts in Slack available on shortcut and from UI

But what about the experience?

Maybe shortcuts are not as visible as neat graphics, they actually really help with experience. When used well, they have the ability to turn the frustration from repeating tasks and complex systems into the feeling of capability and control. And at the end of the day, that often matters more than beautiful graphics and it’s often way easier to implement it, too.

See also

References and notes

[1] Dawn Xiaodong Song, David Wagner, Xuqing Tia: Timing Analysis of Keystrokes and Timing Attacks on SSH, page 6.
Note: This is not a research particularly on average keystroke but provides enough data on keystroke pairs where most of these pairs took less than 150 ms and almost all were under 300 ms. Therefore I believe it’s safe to assume a keystroke shouldn’t take more than 0.3 s.
[2] R. William Soukoreff, I. Scott MacKenzie: Towards a standard for pointing device evaluation, perspectives on 27 years of Fitts’ law research in HCI
Note: There’s even harder to get a proper reference on totally average point-and-click interaction time, but this study can give you an idea what such interaction can take, based on different results from studies based on Fitt’s law and alternative theorems:
[3]Sacha B, The National Cyber Security Centre: Let them paste passwords
[4]Troy Hunt: The “Cobra Effect” that is disabling paste on password fields
[5]In case your target user is somebody else than a pilot or a driver, there's quite a chance some of your users use a screen reader. Around 20% of people from US accesing web sites have some kind of disability and it cannot be easily tracked in analytics. Tim Frick: How Many People With Disabilities Use My Website?
[6]Andrew Nevins: Learning common keyboard shortcuts for screen readers
[7]Sasha Maximova: J, K, or How to choose keyboard shortcuts for web applications
[8]IBM developer guidelines: Checkpoint 2.1.4 Character Key Shortcuts
[9]IBM developer guidelines: Accessibility and Compatibility Features

Contact me