|
| 1 | +# Error - Page refreshes or redirects |
| 2 | +- WAVE Category: Error |
| 3 | +- WAVE Error: Page refreshes or redirects |
| 4 | + |
| 5 | +## Page Content Status |
| 6 | +- [X] WAVE Error guidance text |
| 7 | +- [ ] Example of a DOM Snippet Generated From WAVE Tool |
| 8 | +- Project Team Error guidance |
| 9 | + - [ ] Project Team Page Details |
| 10 | + - [ ] Project Team Issue and PR details |
| 11 | + - [ ] Project Team Solution |
| 12 | +- [ ] Credits/Authors |
| 13 | + |
| 14 | +## WAVE Guidance |
| 15 | + |
| 16 | +WAVE Tool's Reference material on Page refreshes or redirects may not specifically address your problem. We provide it here for optional reading. |
| 17 | + |
| 18 | +??? Info "Click to see WAVE Tool Reference" |
| 19 | + |
| 20 | + This content added 2026-04-09. Check for updated guidance at: <a href="https://wave.webaim.org/api/docs?format=html#meta_refresh" target="_blank">https://wave.webaim.org/api/docs?format=html#meta_refresh</a> |
| 21 | + |
| 22 | + > ### WAVE Category |
| 23 | + > Errors |
| 24 | + > ### WAVE Error |
| 25 | + > Page refreshes or redirects |
| 26 | + > ### What It Means |
| 27 | + > The page is set to automatically change location or refresh using a `<meta>` tag. |
| 28 | + > ### Why It Matters |
| 29 | + > Pages that automatically change location or refresh pose significant usability issues, particularly for screen reader and keyboard users. |
| 30 | + > ### What To Do |
| 31 | + > Remove the `<meta>` refresh and give the user control over time-sensitive content changes. |
| 32 | + > ### The Algorithm... in English |
| 33 | + > A `<meta http-equiv="refresh">` tag is present. |
| 34 | + > ### Standards and Guidelines |
| 35 | + > - [2.2.1 Timing Adjustable (Level A)](https://webaim.org/standards/wcag/checklist#sc2.2.1) |
| 36 | + > - [2.2.2 Pause, Stop, Hide (Level A)](https://webaim.org/standards/wcag/checklist#sc2.2.2) |
| 37 | + |
| 38 | +## Example of a DOM Snippet Generated From WAVE Tool |
| 39 | + |
| 40 | +> ```html |
| 41 | +> [HTML snippet showing the problematic code structure that WAVE detected] |
| 42 | +> ``` |
| 43 | +
|
| 44 | +
|
| 45 | +## Project Team Error guidance |
| 46 | +
|
| 47 | +The following material covers how the Project Team has provided a solution to the Page refreshes or redirects WAVE Error. |
| 48 | +
|
| 49 | +### Project Page Details |
| 50 | +- Project Page name: [INSERT PAGE NAME or "ALL"] |
| 51 | +- Project Dev URL: [INSERT URL or "N/A"] |
| 52 | +- Requires sign in: [TRUE OR FALSE] |
| 53 | + - Required User Role: [INSERT ONE OF: Visitor, Logged in user, Admin, Security Admin] |
| 54 | + - Can access page directly from URL: [TRUE OR FALSE] |
| 55 | + - Accepts URL parameters: [TRUE OR FALSE] |
| 56 | +
|
| 57 | +### Project Team Issue and PR details |
| 58 | +- Related GitHub Issue(s): |
| 59 | + - [INSERT ISSUE URL] |
| 60 | +- Related Pull Request(s): |
| 61 | + - [INSERT PR URL] |
| 62 | +- React Component(s) |
| 63 | + - [INSERT PATH: e.g. path/to/Component.jsx] |
| 64 | +
|
| 65 | +### Project Team Solution |
| 66 | +
|
| 67 | +#### What is the specific problem that was occurring? |
| 68 | +<!-- Author Instructions: Add a detailed explanation of the specific accessibility problem, including context about when/where it occurs, what elements are involved, and why it's problematic for assistive technology users --> |
| 69 | +[INSERT CONTENT] |
| 70 | +
|
| 71 | +#### What is the proposed solution to this problem? |
| 72 | +<!-- Author Instructions: Add a few sentences describing the fix. "Why the Fix Works" comes later (see below). If there are lots of instructions required to explain the solution, include them in Developer Resources below --> |
| 73 | +[INSERT CONTENT] |
| 74 | +
|
| 75 | +#### Step-By-Step Guide |
| 76 | +<!-- Author Instructions: Replace details dropdown with N/A if this does not apply --> |
| 77 | +
|
| 78 | +??? Info "Click to see step-by-step guide" |
| 79 | +
|
| 80 | + [ADD DETAILED INSTRUCTIONS HERE] |
| 81 | +
|
| 82 | +#### Other Technical Details |
| 83 | +<!-- Author Instructions: Write N/A if this does not apply --> |
| 84 | +
|
| 85 | +??? Info "Click to see other technical details" |
| 86 | +
|
| 87 | + [INSERT OTHER DETAILS e.g. Prop References, Return Value ] |
| 88 | +
|
| 89 | +#### Code Snippet With Solution |
| 90 | +??? Info "Click to see code snippets" |
| 91 | +
|
| 92 | + [INSERT PATH file/path/to/Snippet.jsx] |
| 93 | +
|
| 94 | + ```jsx |
| 95 | + [Code example showing the fix/solution] |
| 96 | + ``` |
| 97 | +
|
| 98 | +#### Why the Fix Works |
| 99 | +<!-- Author Instruction: Add an explanation of how the code changes resolve the accessibility issue and why this approach was chosen --> |
| 100 | +[INSERT CONTENT] |
| 101 | +
|
| 102 | +#### Where this solution is applicable |
| 103 | +<!-- Author Instruction: Add a bullet point list of scenarios that might trigger this error and would be fixed by applying the provided solution, e.g. particular groupings of html elements, user interactivity, code-specific edge cases --> |
| 104 | +- [INSERT SCENARIO 1] |
| 105 | +- [INSERT SCENARIO 2] |
| 106 | +- [INSERT SCENARIO N] |
| 107 | +
|
| 108 | +#### Screenshots of WAVE Error |
| 109 | +
|
| 110 | +<!-- Author Instructions: when including markdown images, ensure they are responsive by specifying EITHER width OR height. Do not provide both. --> |
| 111 | +
|
| 112 | +??? Info "1. Descriptive Title for Screenshot Set 1" |
| 113 | +
|
| 114 | + Description/text for image |
| 115 | +
|
| 116 | + [INSERT IMAGE HERE] |
| 117 | +
|
| 118 | +## Credits/Authors |
| 119 | +<!-- Author Instructions: Add bullet points with GitHub handles of all HfLA members who contributed to this wiki page and/or contributed to Pull Requests that provided solutions for this page --> |
| 120 | +- @MissBrandyLea |
| 121 | +- [INCLUDE Contributor 2] |
| 122 | +- [INCLUDE Contributor N] |
0 commit comments