Link to potentially non-accessible document/app

[alvaromontoro]

Describe the new a11y feature or project enhancement

This is not an a11y mistake by itself, but it is something that I've seen in most accessibility checkers: showing a warning when there's a link to a Word, Excel, PowerPoint, or PDF document. Also, when there's a link to Youtube (because captioning is often missing or not well generated).

Those documents often have accessibility issues and need to be created with accessibility in mind. Also, they may be loaded on the browser, but they require plugins/extensions that can create navigation difficulties.

Describe the solution you'd like

Show a warning about potential accessibility issues when:

• A link to a PDF, Word, Excel, or PowerPoint document is present on the page.
• A link to Youtube is present on the document.

This can be done in CSS by checking the end of the URL looking for certain extensions (".pdf", ".doc", ".docx", ".xls", etc.), or the beginning of the URL looking for Youtube addresses ("https://youtu.be", "https://youtube.com", etc.)

Link(s)

• WebAIM Wave Guidelines (will link to Google Docs) <-- this list may be interesting to add more CSS-only features to Checka11y.css.

[jackdomleo7]

I love this idea for a feature! 👍

[alvaromontoro]

Based on the WAVE-WCAG Mappings, there are a few things that could be added to Checka11y.css as they can be detected via CSS:

Errors:

• Empty labels
• Empty table headers (th)
• <marquee> present on the document (I call dibs on this task :-P)
• <blink> present on document

Warnings:

• <video> present on document
• <audio> present on document
• Java applet, plugin, or Flash present on document (RIP Flash)
• <noscript> present on document

Each of them would need a ticket if you decide to go for them.

[SavvasStephanides]

Not an bad idea for a feature, but maybe this could be a lower severity level than a warning. Maybe advice or tip or similar?

For example:

Tip: Check that the video you're linking here contains closed captions.

or

Advice: Make sure the PDF document you're linking here can be fully accessed with a keyboard.

What do you think?

[jackdomleo7]

I'm not too sure. I feel Error and Warning keep it simple. If we were going down the tip/advice route then arguably we could change a lot of the warnings to be tips/advice as there is overlap between what a warning is and what a tip is, e.g. WARNING: Links that open in a new tab or window should be communicated to the user, ensure the user knows of this behavior.

I think for now keep it as just Error and Warning, but I'll keep it in mind for the future in case there becomes an obvious difference/need. 🙂

[alvaromontoro]

Personally, I find the warning a bit "excessive" (it is not for the actual page, but for the linked element). It would make sense to have it as a tip/advice, but as that's not available, a warning should do (if added).

[tannerdolby]

Hi 👋 @jackdomleo7 (p.s. great work on this project btw!)

If there isn't anyone already assigned to this, I'm happy to take it.

I spun up a CodePen demo to assist in my testing before making changes in the source.

[jackdomleo7]

Hey @tannerdolby, of course! Thank you.

[tannerdolby]

Your welcome @jackdomleo7! Thanks for setting up a clear process for contributing, this project is such a gem.

[jackdomleo7]

I appreciate the feedback. From what I've seen, this project is very easy for first-timers to contribute to - no one has had any issues which is great 😁