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

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>