What does this accessibility issue mean?
Issue summary: meta refresh tags are used on the page
Meta refresh tags tell a web browser to automatically refresh a page or frame at a given time interval.
Using meta refresh to automatically reload a page or section of a page can create problems for users who use assistive technology as well as for users who have cognitive or attention impairments as it can interrupt their reading or interactions on the page.
A meta refresh delay doesn’t provide any control to users and they may not have sufficient time to read or complete tasks on the page before it refreshes. This lack of control can be frustrating and exclusionary for some users.
Solution: Ensure meta http-equiv=”refresh” is not used.
Example HTML violation: Meta refresh tags used on page (WCAG Level A Issue)
<!DOCTYPE html>
<html lang="en" class="no-js">
<head></head>
<body>
<h1>Welcome to our website</h1>
<meta http-equiv="refresh" content="72000; URL=https://www.yourwebsite.com">
</body>
</html>The above HTML violates the meta-refresh accessibility rule.
How to fix "Meta refresh tags used on page (WCAG Level A Issue)" issue
<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
<!-- Meta refresh line has been removed to meet accessibility standards -->
</head>
<body>
<h1>Welcome to our website</h1>
<!-- Rest of your page content -->
</body>
</html>According to the W3C Web Accessibility Initiative (WAI), using <meta http-equiv=""refresh""> can prevent control over when the refresh occurs for users with disabilities, therefore it is recommended to not use it.
Alternatively, if refreshing the page is a requirement, consider using JavaScript to handle the refresh and provide users with the ability to pause the refresh, extend the time between refreshes, or turn off the refresh entirely.
Keep in mind that accessibility standards, such as the Web Content Accessibility Guidelines (WCAG), aim to make web content more accessible to people with disabilities.
Here are some additional resources on accessibility:
