Skip to main content

Using address in HTML won’t be problematic for much longer

Posted in Accessibility, Development and HTML

There’s a bug in Safari (WebKit). It adds an implicit role of contentinfo to any instance of an <address> element. This means that VoiceOver reads “content information” for an <address>, which is the landmark role normally associated with the main <footer> of a website.

So if your website has a footer (it almost certainly does!) and an <address> somewhere, this is going to be confusing for screen reader users. There should only be one contentinfo landmark on a webpage, so a second will make people wonder what’s going on. And when they navigate to the <address>, they’ll be given an address, rather than the full content they’d usually expect from a footer. Not a great experience.

Scott O’Hara has written about the problem of <address> having the implicit role="contentinfo", and even proposed a fix. If we override the built-in semantics by adding role="group" or role="presentation" to the <address> element, VoiceOver doesn’t treat an <address> as content information.

I did this to the address in my website’s footer, but as Scott points out in his article, it’s a hack.

But there’s good news! The WebKit team were listening, have recognised this as a bug, and the fix was made last month. I’ve tested this with the most recent version of Safari Technology Preview (release 110) and the implicit role="contentinfo" on <address> is gone!

So I’ll soon be removing role="group" from my website’s addresses. I just need to wait for usage of pre-fix versions of Safari to drop off a bit, but as it’s an ‘evergreen’ browser, I don’t see that taking too long.

Subscribe

I send a newsletter on the last day of every month, containing:

  • A roundup of the articles I’ve posted
  • A hot pick from my archives
  • Some interesting posts from around the web

I don’t collect any data on when, where or if people open the emails I send them. Your email will only be used to send you newsletters and will never be passed on. You can unsubscribe at any time.

More posts

Here are a couple more posts for you to enjoy. If that’s not enough, have a look at the full list.

  1. XHTML syntax is still worth using

    A few weeks ago I read an article on CSS-Tricks about writing HTML the HTML way, not the XHTML way, and it has been bothering me a bit.

  2. Booleans in ARIA

    HTML booleans are bit quirky but, as if just to complicate things, booleans in ARIA work slightly differently. It’s worth knowing how and why.