-15

It seems people are not using <kbd> correctly, and its keyboard-like rendering is wrong too.

For HTML5 (as used on these sites and its mobile theme) the editor's draft at w3.org currently states:

The kbd element represents user input (typically keyboard input, although it may also be used to represent other input, such as voice commands).

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 note the nested <kbd><kbd>...</kbd></kbd> in their HTML5 examples:

Here the kbd element is used to indicate keys to press:

<p>To make George eat an apple, press
  <kbd><kbd>Shift</kbd>+<kbd>F3</kbd></kbd>
</p>

In this second example, the user is told to pick a particular menu item. The outer kbd element marks up a block of input, with the inner kbd elements representing each individual step of the input, and the samp elements inside them indicating that the steps are input based on something being displayed by the system, in this case menu labels:

<p>To make George eat an apple, select
  <kbd><kbd><samp>File</samp></kbd>|<kbd><samp>Eat Apple...</samp></kbd></kbd>
</p>

Such precision isn't necessary; the following is equally fine:

<p>To make George eat an apple, select 
  <kbd>File | Eat Apple...</kbd>
</p>

When people adhere to the above on these sites, this is what we see:

To make George eat an apple, press Shift+F3

To make George eat an apple, select File|Eat Apple...

To make George eat an apple, select File | Eat Apple...

(Screen captures of the regular site for MSO, Ask Different, mobile.)

I know someone could fix the CSS for that. But that would still not make people use <kbd> in the recommended way. So, I'd say:

  • If screen readers somehow benefit from using <kbd> (even if used in the wrong way) then at least use a different rendering for regular and mobile browsers. Even monospace would be better, I feel:

    To make George eat an apple, press Shift+F3

    To make George eat an apple, select File | Eat Apple...

  • If screen readers don't benefit at all, then just ban <kbd>.

Let the downvoting commence! ;-)

Improve this question
6
  • 8
    If you want to disable anything that users use incorrectly, I think SO would need to be read-only
    – Michael Mrozek
    Dec 7, 2011 at 15:01
  • 8
    So, if I understand you correctly, this is your thought process: "I hate the kbd style, but know that they won't get rid of it just because I hate it. Oooh, here's HTML5 guidance on the kbd tag that shows people are using it wrong! I'll present that as an argument that we should get rid of it." It appears you are playing political games. You should totally drop that and try jQuery. Of course, if my impression is incorrect you might consider rewording your argument so we can understand just how wrong not following the HTML standard is. Consider using a "think of the children!" line.
    – Pollyanna
    Dec 7, 2011 at 15:15
  • It's not Friday yet.
    – user102937
    Dec 7, 2011 at 16:39
  • It's always Friday in...
    – jball
    Dec 7, 2011 at 16:47
  • 2
    @Adam, I know I can easily have it render differently on my computer, and that would have taken less time than writing the above. No political games intended. But I truly do care about getting each post into the system as perfect as possible. Like I try to prevent link rot and image rot, try to make people use readable URLs, try to use meaningful <img alt=...> attributes, and try not to abuse <sup> for footnotes too often. (No, I am not saying I am a Saint myself!) To me, not using <kbd> the wrong way (unless that truly helps some users), falls into that same category. That's all!
    – Arjan
    Dec 7, 2011 at 21:30
  • 1
    (But, @Adam, I can see how my—irrelevant—opening paragraph could make people read it that way; I removed that now.)
    – Arjan
    Dec 8, 2011 at 10:24

2 Answers 2

Reset to default
5

This has been proposed before.

Accepted, then switched back.

The community cannot handle that again!

Improve this answer
3
  • Oh, where? I know it has been banned for some time as some felt it was abused. (And the castle was destroyed.) But we all want our semantics to be okay, right? (Not, I know ;-))
    – Arjan
    Dec 7, 2011 at 14:44
  • @Arjan yes. that was when it was removed. Then the rally came. then it was reinstated.
    – Naftali
    Dec 7, 2011 at 14:46
  • @Arjan no he was not.
    – Naftali
    Dec 7, 2011 at 14:47
2

I remain unconvinced.

  1. Sorry you don't like it. Consider using a userscript to change/alter/remove kbd tag usage as you see fit.
  2. We use a lot of things "wrong" - it's a markup language, not a dictatorship.
  3. You have failed to give a reason why the standard should be followed, other than to imply that it should be followed simply because it's the standard.
  4. There is a gap you gloss over - you suggest that the standard should be followed, but since people won't follow it, it should be discarded altogether. There are many other solutions to the issue of following the standard (if we chose to do so) which don't require that we eliminate the tag altogether. So if the issue is that we're not following the standard, you shouldn't be so quick to suggest we throw it out. Unless, of course, you are suggesting we throw out every tag for which we don't exactly follow the standard, which would effectively eliminate much of the HTML/CSS usage given the various browser quirks that we have to use workarounds for.

If you can articulate a pressing reason why this tag hurts the community, the questions, the answers, the search ranking, or anything else that actually matters to Stack Exchange, then there might be hope for this proposal.

Right now your argument lacks legs on which to stand.

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .