♿ Accessibility Issue
The leaderboard header and rows use plain <div> elements instead of semantic <table>, <th scope="col"> and <td> elements. Screen readers cannot associate header labels with data cells.
📍 Location
leaderboard.html — .leaderboard-header and #leaderboard-body
❌ Current
<div class="leaderboard-header">
<div>Rank</div>
<div>Name</div>
...
</div>
✅ Fix
Use semantic table markup or add explicit ARIA roles:
<div class="leaderboard-header" role="row">
<div role="columnheader" aria-sort="none">Rank</div>
<div role="columnheader">Name</div>
...
</div>
<div id="leaderboard-body" role="rowgroup"></div>
📁 Files
leaderboard.html, js/leaderboard/render.js
🏷️ Labels
accessibility level:intermediate
♿ Accessibility Issue
The leaderboard header and rows use plain
<div>elements instead of semantic<table>,<th scope="col">and<td>elements. Screen readers cannot associate header labels with data cells.📍 Location
leaderboard.html—.leaderboard-headerand#leaderboard-body❌ Current
✅ Fix
Use semantic table markup or add explicit ARIA roles:
📁 Files
leaderboard.html,js/leaderboard/render.js🏷️ Labels
accessibilitylevel:intermediate