WCAG Failureswcagfail.patternd.io

F3 · c02: Status conveyed only via CSS background sprites

Rule: Failure of Success Criterion 1.1.1 due to conveying information exclusively using CSS background images (status sprites)

Corpus WCAG 2.2Applies to WCAG 2.0, 2.1, 2.2Level AAutomatable: partial

Summary: conveying status information exclusively using CSS background images on empty elements

Why it fails: Screen reader users hear only “API gateway” and “Database” with no indication of up/down status because the meaning lives solely in background sprites on empty spans.

Failure technique

https://www.w3.org/WAI/WCAG22/Techniques/failures/F3

Understanding

Quickref

Intentional failure — audit this region

F3 · c02

Service status (meaning is only in background sprites on empty spans):

<p>Service status (meaning is only in background sprites on empty spans):</p>
<ul class="f3c02-list">
  <li><span class="f3c02-dot f3c02-up" aria-hidden="true"></span> API gateway</li>
  <li><span class="f3c02-dot f3c02-down" aria-hidden="true"></span> Database</li>
</ul>
Expected audit result

Manual check: Confirm up/down status is not available in text, labels, or accessible names—only background-image styling.