Skip to content

Commit 52e406b

Browse files
committed
Use <kbd> tag to describe keyboard shortcuts
When describing, in the guide, the keyboard shortcuts that we accept, let's use the `<kbd>` element. This causes the key to render in a box that people will recognize as conventional. The way that this is displayed helps to make it clear that, though we present the key in uppercase, we actually mean for the lowercase letter to be entered. Therefore, we present the key in uppercase since 1) that's how it appears on most keyboards and 2) for some characters such as `l`, presenting the character in lowercase might be ambiguous. We'll spell out "Escape" rather than saying "Esc" (even though many keyboards spell it that way) since the `KeyboardEvent.keycode`[^1] is called "Escape", and that's how it would appear in an `aria-keyshortcuts` attribute[^2]. [^1]: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode [^2]: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-keyshortcuts
1 parent 3e871d1 commit 52e406b

File tree

1 file changed

+2
-2
lines changed

1 file changed

+2
-2
lines changed

guide/src/guide/reading.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,14 +42,14 @@ Tapping the menu bar will scroll the page to the top.
4242
## Search
4343

4444
Each book has a built-in search system.
45-
Pressing the search icon (<i class="fa fa-search"></i>) in the menu bar, or pressing the `/` or `S` key on the keyboard will open an input box for entering search terms.
45+
Pressing the search icon (<i class="fa fa-search"></i>) in the menu bar, or pressing the <kbd>/</kbd> or <kbd>S</kbd> key on the keyboard will open an input box for entering search terms.
4646
Typing some terms will show matching chapters and sections in real time.
4747

4848
Clicking any of the results will jump to that section.
4949
The up and down arrow keys can be used to navigate the results, and enter will open the highlighted section.
5050

5151
After loading a search result, the matching search terms will be highlighted in the text.
52-
Clicking a highlighted word or pressing the `Esc` key will remove the highlighting.
52+
Clicking a highlighted word or pressing the <kbd>Escape</kbd> key will remove the highlighting.
5353

5454
## Code blocks
5555

0 commit comments

Comments
 (0)