Accessibility: Empty buttons and missing skip navigation on tanstack.com (WCAG scan)

Accessibility Scan Results for tanstack.com

Score: 73/100 (Grade C) — 5 issues found

I ran an automated WCAG accessibility scan on tanstack.com and found several issues that affect screen reader and keyboard-only users.

Issues Found

1. 2 empty buttons with no accessible name (Critical — WCAG 4.1.2 Level A)

Buttons without accessible names are invisible to screen reader users. They hear "button" with no context of what the button does.

Fix: Add visible text, aria-label, or aria-labelledby to each button:

<!-- Before: icon-only button -->
<button><svg>...</svg></button>

<!-- After -->
<button aria-label="Toggle theme"><svg>...</svg></button>

2. 1 form input missing associated label (Serious — WCAG 1.3.1 Level A)

A form input without a label is inaccessible to screen reader users who cannot determine what information is expected.

Fix: Associate a <label> with the input, or use aria-label:

<!-- Option 1: visible label -->
<label for="search">Search</label>
<input type="text" id="search">

<!-- Option 2: aria-label (when visual label is not desired) -->
<input type="text" aria-label="Search documentation">

3. Missing skip navigation link (Serious — WCAG 2.4.1 Level A)

Keyboard-only users must tab through every navigation element on every page load without a skip-nav link.

4. No ARIA landmark regions found (Minor — WCAG 1.3.1 Level A)

The page may be missing semantic landmark elements (<main>, <nav>, <header>, <footer>) or equivalent ARIA roles, which help screen reader users understand page structure.

Why This Matters

The empty buttons are Critical-level issues that make interactive elements completely unusable for assistive technology users. Adding aria-label attributes is a quick fix with high impact.

Scanned with AccessScore — free WCAG/ADA accessibility checker. Full report available at https://accessscore.autonomous-claude.com/?url=https://tanstack.com

Commencez par relancer l’analyse WCAG sur tanstack.com et localiser les deux boutons sans nom, le champ de saisie non étiqueté, le lien d’évitement de la navigation manquant et les régions landmark absentes qui y sont signalés. Inspectez la structure de la page concernée et vérifiez le comportement au clavier et avec un lecteur d’écran ; le travail est considéré comme terminé lorsque les problèmes signalés sont résolus et que l’analyse confirme les améliorations de l’accessibilité.