How should I markup units of measurement in HTML5? (Centimetres, grams, etc.)

Question

I markup a table which contains values with units of measurement. I thought about how to mark up the document for the best accessibility. Is it important to respect variable values and constant names for values?

I did not find any <value>, <unit> element or an appropriate attribute for this case.

My three markup approachs

<table>
   <td>Brain weight</td>
   <td>3.8<em>g</em></td>
</table>

———————————— o r ————————————

<table>
   <td>Brain weight</td>
   <td><em>3.8</em>g</td>
</table>

———————————— o r ————————————

<table>
   <td>Brain weight</td>
   <td>3.8<abbr title="Grams">g</abbr></td>
</table>

Answer 1

Using em for the unit/value would be incorrect (typically; of course there are some cases where it might be appropriate, but not in general). The em element "represents stress emphasis of its contents" ("The placement of stress emphasis changes the meaning of the sentence.").

Using the abbr element for the unit would be correct (might be useful for various use cases).

In your examples you've used table with td as childs. This is not valid markup. If you'd only have such name-value pairs, you could use a dl:

<dl>
  <dt>Brain weight</dt>
  <dd>3.8&nbsp;<abbr title="grams">g</abbr></dd>
</dl>

---

There is a draft for a measure microformat.

---

In the WHATWG version of HTML ("Living Standard") you can find a data element. For some time it was part of the W3C HTML5 draft, too, but it has been removed.

Answer 2

I like very much your third approach of using an abbr tag for adding contextual information and improving accessibility. It's a great idea.

However, neither of your markups is fully compliant with the rules of the International System of Units. See http://en.wikipedia.org/wiki/International_System_of_Units

You must separate the value and the unit by one space character.

 <td>3.8&nbsp;<abbr title="Grams">g</abbr></td>