Features

Ensure <meta http-equiv="refresh"> is not used for delayed refresh

Rule ID: meta-refresh User Impact: critical Guidelines: WCAG 2.0

The <meta http-equiv="refresh"> element should not be used to refresh or redirect pages, as it can cause accessibility issues for users with disabilities.

About This Rule

This guideline ensures that the <meta http-equiv="refresh"> element is not used to refresh or redirect pages, promoting better accessibility and user control. Adhering to this practice aligns with the following standards:

  • WCAG 2.1 (A): 2.2.1 Timing Adjustable
  • WCAG 2.0 (A): 2.2.1 Timing Adjustable
  • WCAG 2.2 (A): 2.2.1 Timing Adjustable
  • Trusted Tester: 8.A
  • EN 301 549

Why It Matters

Automatic page refreshes or redirects initiated by the <meta> element can be disorienting for users, especially those relying on assistive technologies. Such actions can disrupt the user's reading or navigation flow, leading to confusion and a diminished user experience. Additionally, users have no control over the timing of these refreshes or redirects, which can be particularly problematic for individuals with disabilities. :contentReference[oaicite:0]{index=0}

How to Fix

To enhance accessibility:

  • Remove the http-equiv="refresh" Attribute: Eliminate the http-equiv="refresh" attribute from all <meta> elements in your HTML.
    Copy code
    <!-- Remove this -->
    <meta http-equiv="refresh" content="10" url="http://www.yourdomain.com/index.html">
  • Use Server-Side Redirects: If redirection is necessary, implement server-side redirects (e.g., using HTTP status codes 301 or 302) to ensure a seamless user experience without unexpected client-side behavior.
  • Provide User Controls for Refreshing Content: If periodic content updates are required, offer users the ability to manually refresh the content or provide controls to pause, extend, or stop automatic updates.

Examples

Incorrect

Using the <meta http-equiv="refresh"> element to refresh the page after 10 seconds:

Copy code
<meta http-equiv="refresh" content="10">

Correct

Implementing a server-side redirect (e.g., using PHP):

Copy code
<?php
header("Location: http://www.yourdomain.com/index.html", true, 301);
exit();
?>

More Information

Other Rules

Interested in other web accessibility rules? Please see these other rules: