R I S K M O N I T O R

Loading

Intelligent Cybersecurity Check for vulnerabilities now

Avoid Meta Refresh for Accessibility

Rule ID: meta-refresh
Ruleset: axe-core 4.10
User Impact: Critical
Guidelines: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), Trusted Tester, EN 301 549


How to Fix the Problem

To make your web page compliant and accessible:

  • Remove all <meta http-equiv="refresh"> elements from your HTML, especially those with refresh times shorter than 20 hours.

  • If you need to refresh the page or redirect users, use JavaScript instead, and provide controls that let users:

    • Pause the refresh,

    • Extend the delay,

    • Or turn off the auto-refresh entirely.

Bad Example:

html
<meta http-equiv="refresh" content="10" url="http://www.yourdomain.com/index.html">

Accessible Alternative:
Use JavaScript with user controls:

html
<!-- JavaScript to redirect after user confirms -->
<button onclick="startRedirect()">Go to Next Page</button>
<script>
function startRedirect() {
setTimeout(function() {
window.location.href = "http://www.yourdomain.com/index.html";
}, 10000); // 10 seconds
}
</script>

Or, if you must perform a refresh-like behavior, always notify users and allow interaction before proceeding.


Why it Matters

Automatic refreshes:

  • Disrupt user flow, especially for screen reader users or those with cognitive impairments.

  • Cause unexpected shifts in focus, typically sending the user back to the top of the page.

  • Remove control from users, which violates key principles of accessible design.

People with disabilities may:

  • Lose track of where they are on the page.

  • Be interrupted before finishing reading.

  • Struggle to respond before the refresh changes the content.

These issues violate accessibility principles such as predictability, control, and timing (per WCAG 2.2.1 and 2.2.4).


Rule Description

Web pages must not use the <meta http-equiv="refresh"> element to refresh the page within 20 hours, as this prevents users from controlling content updates—leading to accessibility barriers.


The Algorithm (in simple terms)

  1. Find all <meta> elements in the document.

  2. Check if any have http-equiv="refresh" and a content attribute.

  3. If the content value sets a refresh time less than 20 hours, it’s flagged as a failure.

Leave A Comment