The World Wide Web lets websites use semantic markup to tell exactly what they mean. This lets in both the computer and the user in
For eg in HTML you can say:
Did the dog <em>really</em> eat your homework?
where the <em>really</em>
part basically tells the computer that the “really” is emphasized. Your browser (Chrome/Firefox/..) will then showcase that emphasis as italics.
Did the dog really eat your homework?
If you were using a screen-reader, the screen-reader voiceover could change its intonation or inform you that the really was emphasized in the text.
Similarly, there is a way of telling the browser about Keyboard Shortcuts. Its called <kbd>
. So if I were writing about common keyboard shortcuts, I could write:
Please press <kbd>Space</kbd> to jump
and the browser would understand that I am talking about the spacebar here. The browser can then provide this as hint to the user. You could use "Crouch" as a voice-command for the game, perhaps. This is important for accessibilty reasons, especially with screen-readers who could see this as a hint, and “learn” these keyboard shortcuts and provide them to the user on a voice-command for eg.
WhatsApp Web instead puts these keyboard shortcuts in a HTML-soup (the screenshot in the tweet), which doesn't use <kbd>
tags and makes it unreadable to the browser.
They both look the same to the user:
Space
vs Space
but the latter is much more “meaningful”.