up vote 1 down vote favorite

Super User and the other SE sites have support for the HTML <kbd> tag, denoting keys that should be pressed. These are styled in order to look like a physical keyboard key.

On the W3C wiki page about <kbd>, three more advanced uses of the element are suggested:

  • When the kbd element is nested inside a samp element, it represents the input as it was echoed by the system.
  • When the kbd element contains a samp element, it represents input based on system output, for example invoking a menu item.
  • When the kbd element is nested inside another kbd element, it represents an actual key or other single unit of input as appropriate for the input mechanism.

So I propose the following styling for keyboard input in light of these recommendations:

  • <kbd>ls -la</kbd> represents a command the user should type. It should be more styled than `ls -la` would, but shouldn't look like a key.
  • <kbd><kbd>Enter</kbd></kbd> represents the user pressing a key, and should look like an actual key.

It seems the <samp> element is currently unsupported, but if it were, the other suggestions could be styled as well. Of course, there is a point where we could have simply too many different styles, and we'd get visual clutter.

The most evident concern I see with this plan would be the fact that most answers to date have been written expecting that <kbd> would look like a key. Assuming a global replacement of <kbd>...</kbd> with <kbd><kbd>...</kbd></kbd> would be impractical, we'd have to come up with some other solution.

link
2  
I think another good idea would be to mention somewhere that one can actually use the kbd element in posts. It took me a while to figure it out when I was new to the site. – slhck Jun 20 '11 at 4:39
Agreed. I found this while I was researching this question: meta.stackoverflow.com/questions/36785/… – jtbandes Jun 20 '11 at 4:57
1  
seems.. a little over excessive to me. – Sathya♦ Jun 20 '11 at 5:03
The basic problem I'm trying to solve is that there's no designated way to represent keyboard input like commands that should be typed distinct from specific keys that should be pressed. Perhaps you can come up with a nicer solution? – jtbandes Jun 20 '11 at 5:06
feedback

You must log in to answer this question.

Browse other questions tagged