CODEWITHSUNDEEP
htmlcsswcag
Dog
Dog

Reputation: 2906

Techniques for handling opening a new tab and ensuring web accessibility with WCAG 3.2

WCAG 3.2 indicates that content should be provided in a predictable format (https://www.w3.org/TR/2016/NOTE-UNDERSTANDING-WCAG20-20161007/consistent-behavior.html) and that subsequently when new a new tab is opened on a click that the user is made aware of this.

I have a webpage with a list of many links that open in a new tab. W3C recommends that either this is indicated in the link text or an indicator is provided on hover/focus. However, because of the extensive amount of links on the same page that require this, providing these options would significantly disrupt the design/UI. Are there are other less visually intrusive ways to achieve this conformance without providing a pop-up or text warning for each link?

Also, are there other accessibility issues related to opening new windows/tabs?

Upvotes: 1

Views: 650

Answers (1)

slugolicious
slugolicious

Reputation: 17535

That may depend on the level of conformance you're trying to achieve. Most companies (and most country laws) require AA conformance. In fact, the guidelines say that AAA conformance should not be required.

Note 2: It is not recommended that Level AAA conformance be required as a general policy for entire sites because it is not possible to satisfy all Level AAA Success Criteria for some content.

However, that does not mean you shouldn't consider some of the AAA requirements. For example, having color contrast that's greater than 4.5:1 (1.4.6 Contrast (Enhanced)) or making sure your link text makes sense by itself rather than relying on the context around it (2.4.9 Link Purpose (Link Only)) are both great enhancements above AA conformance.

With regards to links opening in new windows, that falls under 3.2.5 Change on Request, which is a AAA conformance. So depending on the level of conformance you're trying to achieve, you might not have to conform to it.

If you only had a handful of links scattered throughout your site that opened in a new window, it would be nice to have a visual indicator that shows the link will open in a new window, and to convey that same information to screen readers. (See H83: Using the target attribute to open a new window on user request and indicating this in link text (HTML) as an example. You could also use an icon instead of text, but make sure the icon has the alt attribute or that you provide context to a screen reader via aria-label, aria-labelledby, or visually hidden text).

But if you do that, and then you have a page where most of the links go to a new window, the page might look cluttered with all the extra information. This is where you'd have to be careful. If you decide to have a general comment on that one page that says that all links open in a new window so that you don't need an icon next to each link, then you'd be failing WCAG 3.2.4 Consistent Identification, which is a AA requirement. That is, you'd have some pages with "new window" icons next to the links and another page without it.

So you need to decide if you want to indicate that a link opens in a new window (a AAA requirement) or not. As mentioned earlier, implementing some AAA requirements is a good thing. Just be consistent.

Upvotes: 3

Related Questions