Accessibility Compliance (WCAG 2.1)

eConsent automatically evaluates the accessibility of your consent disclosure at the time of capture. Every certificate includes a WCAG 2.1 accessibility attestation that reports whether the consent language met AAA, AA, or fail-level contrast and readability standards. This provides objective, timestamped evidence that your consent disclosure was legible and accessible to the consumer.

Why accessibility matters for consent

Courts and regulators increasingly scrutinize whether consent disclosures were clear and conspicuous. A TCPA disclosure rendered in light gray text on a white background, or in a 6px font buried below the fold, may not constitute valid prior express written consent.

eConsent’s accessibility checks provide:

• Objective evidence that the disclosure was readable at the time of consent
• Defense against claims that consent language was hidden or illegible
• Proactive compliance with ADA and state accessibility requirements

Tip

Accessibility attestation is automatic. There is nothing to configure. Every certificate includes a WCAG assessment based on the actual rendered page at the moment of consent.

What eConsent checks

Contrast ratio

eConsent evaluates the contrast ratio between the consent disclosure text and its background color, following WCAG 2.1 Success Criterion 1.4.3 (Contrast - Minimum) and 1.4.6 (Contrast - Enhanced).

Level	Normal text (below 18pt / 14pt bold)	Large text (18pt+ / 14pt+ bold)
AAA	7:1 or higher	4.5:1 or higher
AA	4.5:1 or higher	3:1 or higher
Fail	Below 4.5:1	Below 3:1

Font size

The attestation records the computed font size of the consent disclosure text. Courts have found disclosures in very small font sizes to be insufficient for “clear and conspicuous” requirements.

Assessment	Criteria
Adequate	12px or larger
Warning	Between 9px and 12px
Fail	Below 9px

Visibility

eConsent checks whether the consent disclosure element was actually visible in the viewport at the time of interaction:

• Element dimensions --- was the element rendered with non-zero width and height?
• CSS visibility --- was the element hidden via display: none, visibility: hidden, or opacity: 0?
• Viewport position --- was the element within or near the visible viewport?
• Overflow clipping --- was the element clipped by a parent container’s overflow?

Reading the attestation report

Every consent certificate includes an accessibility section in the attestation data. Here is an example of what is captured:

{
  "accessibility": {
    "contrast": {
      "ratio": 8.59,
      "level": "AAA",
      "foreground": "#333333",
      "background": "#FFFFFF"
    },
    "fontSize": {
      "computed": "14px",
      "assessment": "adequate"
    },
    "visibility": {
      "visible": true,
      "inViewport": true,
      "dimensions": { "width": 580, "height": 42 },
      "cssDisplay": "block",
      "cssVisibility": "visible",
      "cssOpacity": "1"
    },
    "wcagLevel": "AAA"
  }
}

Interpreting the results

AAA (Enhanced)

The consent disclosure exceeds WCAG 2.1 enhanced contrast requirements. This is the strongest level of accessibility compliance and provides the best legal defensibility.

AA (Minimum)

The consent disclosure meets WCAG 2.1 minimum contrast requirements. This is acceptable for most compliance purposes but improving contrast is recommended.

Fail

The consent disclosure does not meet WCAG 2.1 minimum contrast requirements. This may be used to challenge the validity of the consent in litigation. Fix immediately.

Certificate page display

On the public certificate page (accessible via the certificate URL), the accessibility attestation is displayed in a human-readable format:

• WCAG Level badge (AAA, AA, or Fail) with color coding
• Contrast ratio shown as a numeric value with pass/fail indicator
• Font size of the consent disclosure text
• Visibility confirmation that the disclosure was visible on screen

This allows attorneys, auditors, and compliance officers to quickly assess whether the consent disclosure met accessibility standards without needing to interpret raw JSON data.

Improving your accessibility score

If your certificates are showing AA or Fail levels, adjust your consent disclosure styling:

Contrast

/* Poor contrast --- may fail WCAG */
.consent-disclosure {
  color: #999999;        /* light gray on white = 2.85:1 ratio */
  background: #FFFFFF;
}

/* AAA-compliant contrast */
.consent-disclosure {
  color: #333333;        /* dark gray on white = 12.63:1 ratio */
  background: #FFFFFF;
}

Font size

/* Too small --- may be challenged in court */
.consent-disclosure {
  font-size: 8px;
}

/* Adequate and legible */
.consent-disclosure {
  font-size: 14px;
  line-height: 1.5;
}

Visibility

Ensure your consent disclosure is not hidden behind expandable sections, modals that may not open, or scrollable containers that require user action to reveal:

<!-- Avoid: disclosure hidden in collapsed accordion -->
<details>
  <summary>Terms</summary>
  <p class="consent-disclosure">By checking this box, you agree...</p>
</details>

<!-- Better: disclosure visible inline with the form -->
<p class="consent-disclosure">By checking this box, you agree...</p>
<label>
  <input type="checkbox" name="tcpa_consent" />
  I agree to the above terms
</label>

Caution

eConsent records the accessibility state at the exact moment of consent. If your page dynamically changes styles (e.g., dark mode toggle), the attestation reflects whatever was rendered when the consumer interacted with the consent element.

Next steps

• Consent Certificates. Full certificate documentation
• Consent Attestation. How the attestation system works
• TCPA Compliance Guide. TCPA requirements for clear and conspicuous disclosures
• Consent Selector. Configure which element triggers consent capture