Use `<button>` inside `<th>` and `aria-sort` on the column so screen readers announce sort state. The button is the keyboard-accessible trigger; JS only handles the actual sort.
Real tables need `<caption>`, `<thead>` / `<tbody>` / `<tfoot>`, and `<th scope="col">` headers. Screen readers use these to announce column/row context on every cell.
Wrap any wide table in a horizontally-scrolling container. The table itself stays semantic (no display:block hacks that break screen readers); only the wrapper scrolls.