Visual inspection exercise
Seizure warning Heading link
Seizure Warning
This page contains an element that flashes multiple times per second, which may trigger seizures in individuals with photosensitive epilepsy. Viewer discretion is advised. If you have a history of seizures or epilepsy, please exercise caution before proceeding. The element, which is an animated GIF of a cat, appears at the bottom of the page.
Test your knowledge Heading link
Under each H2 on this page is an accessibility violation requires human visual inspection. Most of the violations on this page are either a non-WCAG Best Practice or a WCAG violation that cannot be detected via automated means. Using the techniques described in the “How to test using Visual Inspection methods” section, identify and repair the accessibility issues below.
Conveying link purpose
Links must convey clear purpose (WCAG SC 2.4.4)
Don't use generic phrases like "click here" or "read more" to describe hyperlinks. Link text should accurately describe where the link will take the visitor or why they should click on it. Remember, content requires context.
A more appropriate text label for this link would be "Collect your prize" or "Visit our site for more information".
Congratulations! You won an all-expenses paid trip to Jacksonville, Florida! This prize is valid until the end of the calendar year. Click here.
Space...the final accessibility barrier
Content should be presented in a meaningful sequence (WCAG SC 1.3.2)
In other words, don't use too much whitespace. This accessibility "error" is more in line with Cognitive Accessibility Best Practices (for users with cognitive issues), but a case for WCAG guideline 1.3.2 can be made. According to WCAG Success Criteria 1.3.2, a correct reading sequence is expected. However, even if the reading sequence is logical and appears as expected in the HTML, an inconsistent or unexpected change in visual presentation can negatively affect the viewer's ability to interpret context.
Something about color
Don't use color only to convey information (WCAG SC 1.4.1)
The two blocks of text below meet WCAG color contrast requirements, but they are still an accessibility issue. Why is that? According to WCAG SC 1.4.1, color cannot be used as the sole means of conveying information to the user. The main reason is to accommodate users who are color blind (who may not see a difference in color at all), but it's also to accommodate those with partial sight, older users, or people using monochrome displays.
Staff notice: all officers must follow holodeck guidelines listed in the red box below. Guidelines for enlisted personnel are in the green box.
Lip reading won't help
Audio content must have captions (WCAG SC 1.2.2)
All prerecorded audio - whether presented in video or audio format - must include synchronized text for dialogue. In addition, these captions must also "identify who is speaking and include non-speech information conveyed through sound, including meaningful sound effects."
If a video file contains speech but is not captioned (like the one in this example), the video is considered inaccessible and does not meet WCAG Success Criteria 1.2.2.
Elemental deprecation
Moving, blinking, or scrolling information needs pause capabilities (WCAG SC 2.2.2)
According to WCAG Success Criteria 2.2.2, any moving, blinking, scrolling, or auto-updating information must be accompanied by the ability to stop, pause, or hide the information. The infamous <marquee> tag - once a staple in the early days of the web - is a deprecated HTML element and is generally not recommended for use by anyone for anyone.
Flashing/blinking media
Do not include content that flashes faster than 3 times per second (WCAG SC 2.3.1)
Media that flashes more than a few times per second can trigger seizures in people with photosensitive epilepsy as well as other photosensitive seizure disorders. If in doubt, don't include the flashing content or prepend it with an epilepsy warning.
