How to represent "no data" cells in HTML tables?

In web presentation, I have those table cells which contain no data.

How to represent such an information?

Notes about the table:

  • its basic dimensions are roughly 10 × 20, but can grow to 15 × 50;
  • about half the cells contain data, so about half doesn't contain data;
  • when present, the data is either a number or a range (two numbers, separated by – (en dash));
  • the layout (horizontal/vertical borders shown/hidden) will depend on the answer here, so it's not set in stone yet.

Example:

┏━━━━━━━━━━┳━━━━━━━━━━┓
┃ Header 1 ┃ Header 2 ┃
┡━━━━━━━━━━╇━━━━━━━━━━┩
│   Data   │          │
├──────────┼──────────┤
│          │   Data   │
└──────────┴──────────┘

And the corresponding HTML:

<table>
  <thead>
    <tr>
      <th>Header 1</th>
      <th>Header 2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Data</td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td>Data</td>
    </tr>
  </tbody>
</table>

I've thought about using a dash, but in that case, which dash to use? I've thought about letting them empty, but with the table's dimension, this can lead to barely readable result. My final idea was to do something like on Wikipedia: having a "N/A" written in the cell and have the cell rendered with a different background color, but I fear the table easily becomes too colored.

Note: unlike this question, my table isn't meant to be read out loud.

Tags: