Opening hours HTML table template

The week at a glance for shops, cafés, salons and studios — days as row headings, hours beside them. Simple enough that the markup barely matters, except that clean markup is what search engines read your hours from.

The table

Opens the generator with this exact table loaded — change the numbers, add rows, copy your version.

<div class="ht-wrap">
<table class="ht">
  <caption>Opening hours</caption>
  <thead>
    <tr>
      <th scope="col">Day</th>
      <th scope="col">Hours</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">Monday–Friday</th>
      <td>9:00 – 18:00</td>
    </tr>
    <tr>
      <th scope="row">Saturday</th>
      <td>10:00 – 16:00</td>
    </tr>
    <tr>
      <th scope="row">Sunday</th>
      <td>Closed</td>
    </tr>
  </tbody>
</table>
</div>

<style>
  .ht-wrap { overflow-x: auto; }
  .ht { border-collapse: collapse; width: 100%; font-size: 0.95rem; }
  .ht caption { text-align: left; font-weight: 600; padding-bottom: 0.5rem; }
  .ht th, .ht td { text-align: left; padding: 0.3rem 0.6rem; border-bottom: 1px solid #d9dce0; vertical-align: top; }
  .ht thead th { border-bottom: 2px solid #9aa3ad; }
  .ht .ta-r { text-align: right; }
  .ht .ta-c { text-align: center; }
</style>

Tips for a opening hours that works

• Group identical days ("Monday–Friday") — a seven-row table where five rows repeat the same hours is harder to scan, not more precise.
• Write "Closed" as a word rather than leaving a blank cell — an empty cell reads as an error, and screen readers skip it silently.
• Holiday hours change; the table shouldn’t lie. Put exceptional dates in a line under the table rather than editing the weekly pattern back and forth.

Under the hours, give visitors a way to reach you outside them — a contact form or booking form works around the clock.