Which approach do you lean towards when creating…

When creating tables in the interface, I tend to follow the next approach:

Using semantic HTML tags: I apply <table>, <thead>, <tbody>, <tr>, <th>, <td> tags for proper structural markup of data. This improves accessibility, SEO, and understanding of the table structure by browsers and assistive technologies.

<table>
  <thead>
    <tr>
      <th>ID</th>
      <th>Name</th>
      <th>Age</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>Ivan</td>
      <td>30</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Maria</td>
      <td>25</td>
    </tr>
  </tbody>
</table>

Separating styles from structure (CSS): I implement table styling (borders, padding, colors, alignment) using CSS. I avoid inline styles and <table border="1"> attributes.

table {
  border-collapse: collapse; /* Merging cell borders */
  width: 100%;
}

th, td {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}

th {
  background-color: #f2f2f2;
}

Responsiveness: I create tables that display correctly on various devices and screen sizes. For complex tables, I use approaches such as:
- Hiding secondary columns on narrow screens.
- Transforming rows into cards or lists on mobile devices.
- Using flex-wrap or overflow: auto properties for horizontal scrolling.
- Applying CSS Grid for adaptive cell layout.
Accessibility: I pay attention to accessibility for users with disabilities by using:
- Column headers (<th>) with the scope="col" attribute.
- Table caption with <caption> or aria-label attribute on the <table> element.
- Contrasting colors.
- Proper keyboard navigation.
Performance: For large data volumes, I use row virtualization or pagination to avoid loading and rendering all data at once on the client.
Using libraries (if necessary): In complex projects or when extended functionality is needed (sorting, filtering, editing), I may use ready-made UI libraries (e.g., DataTables, React Table, Ant Design Table), but with a conscious choice and understanding of their working principles.

Which approach do you lean towards when creating tables in the interface block?