2 column table or definition list for semantically correct HTML?

Question

I frequently have to display a series of name-value pairs, as I'm sure most web developers face. Typically in the form of properties. What is the semantically correct HTML way to do this?

<table>
  <tbody>
    <tr>
      <td>Name</td><td>Jimmy</td>
      <td>Age</td><td>33</td>
      <td>Gender</td><td>Male</td>
    </tr>
  </tbody>
</table>

or

<dl>
  <dt>Name</dt><dd>Jimmy</dd>
  <dt>Age</dt><dd>33</dd>
  <dt>Gender</dt><dd>Male</dd>
</dl>

Or is there another better way?

Answer 1

In HTML5, the most specific element for your use case would be the dl element (bold emphasis mine):

The dl element represents an association list consisting of zero or more name-value groups (a description list).

Name-value groups may be terms and definitions, metadata topics and values, questions and answers, or any other groups of name-value data.