# Markup “YYYY-MM-DD” as input hint

I want to give users help in which format they have to enter a date. The label content is:

Date (YYYY-MM-DD)

I used the following markup:

<label>Date (<kbd><abbr title="four-digit year">YYYY</abbr>-<abbr title="two-digit month">MM</abbr>-<abbr title="two-digit day">DD</abbr></kbd>)</label>


Note: the new HTML5 input-type values (like date) might be used, but this label is a fallback for users with older browsers. Most of them use screenreaders and I try to give the most nitty-gritty markup.

I wonder:

-

There is little point in using code markup here. Technically, it might not be completely wrong “semantically”, since the YYYY-MM-DD notation is really meant for computers rather than human beings, but what would it achieve? Monospace font by default?

Using kbd is equally, if not more, pointless.

Using var might be “semantically” appropriate, since you are using placeholders of a kind. But, here, too, the question is: Why? Do you want some browsers to render the text in italics? What else would you achieve in practice?

Using abbr is “semantically” wrong, since e.g. YYYY is not an abbreviation. It is a conventional notation. In practice, abbr creates by default a dotted bottom border on some borders. Why use some markup when the only real implication is that you get some default rendering that you don’t want?

Using dfn would be equally wrong. You are not giving any definition for e.g. YYYY. Instead, you are implying a definition, i.e. assuming that the user knows what YYYY means.

The title element is poor usability, but if you wish to use it, you can use it for a span element, which has no defined semantics (so it cannot be semantically wrong) and has no impact on default rendering.

If you don’t think that the explanation ”(YYYY-MM-DD)” is not sufficient, the best approach is to explain it in normal content. E.g.,

Date (YYYY-MM-DD, i.e. 4-digit year, hyphen, 2-digit month, hyphen, 2-digit day):

Note that a label element that has neither a for attribute nor a form field as content is pointless. The label markup is useful only when used to associate a form field with its label text.

-