xhtml tables - proper use

Question

Hi

I have a pretty simple question. Is it a good practice to write tables with 2 different headers and repeating sub-headers like in the example 1 or is it better/more semantic to split this code into 2 tables (see example 2) ?

Thanks

example1:

<table>
<tr>
  <th colspan="3">HEADER 1</th>
</tr>
<tr>
  <th>sub-header 1</th>
  <th>sub-header 2</th>
  <th>sub-header 3</th>
</tr>
<tr>
  <td>data</td>
  <td>data</td>
  <td>data</td>
</tr>
<tr>
  <td>data</td>
  <td>data</td>
  <td>data</td>
</tr>
<tr>
  <th colspan="3">HEADER 2</th>
</tr>
<tr>
  <th>sub-header 1</th>
  <th>sub-header 2</th>
  <th>sub-header 3</th>
</tr>
<tr>
  <td>data</td>
  <td>data</td>
  <td>data</td>
</tr>
<tr>
  <td>data</td>
  <td>data</td>
  <td>data</td>
</tr>

example 2:

<table>
  <tr>
    <th colspan="3">HEADER 1</th>
  </tr>
  <tr>
    <th>sub-header 1</th>
    <th>sub-header 2</th>
    <th>sub-header 3</th>
  </tr>
  <tr>
    <td>data</td>
    <td>data</td>
    <td>data</td>
  </tr>
  <tr>
    <td>data</td>
    <td>data</td>
    <td>data</td>
  </tr>
</table>
<table>
  <tr>
    <th colspan="3">HEADER 2</th>
  </tr>
  <tr>
    <th>sub-header 1</th>
    <th>sub-header 2</th>
    <th>sub-header 3</th>
  </tr>
  <tr>
    <td>data</td>
    <td>data</td>
    <td>data</td>
  </tr>
  <tr>
    <td>data</td>
    <td>data</td>
    <td>data</td>
  </tr>
</table>

Answer 1

It's better/more semantic to use as many or as few tables as you need to convey the information you want to convey. If you weren't using HTML, and say were laying out the data on a sheet of paper for someone else's understanding, would you use zero, one, two or more tables? That's how many tables you should use.