WebKit scuppers skip-to-content links

JavaScript required to get anchors to work properly in Safari and Chrome

Web designer and developer Damon Muma has "stumbled on to the factoid" that skip links are broken in WebKit browsers. On his blog, he outlines the problem, which stems from an issue that has its very own four-year-old bug report.

Speaking to .net, Muma explained that in WebKit, when you navigate to an internal link on the same page (such as page.html#internal-location), the focus stays on the link you originally followed (not necessarily 'clicked'). If you then press Tab to move to the next link, it goes back to your original position on the page and your position at #internal-location is completely overridden. "The focus should move to the location of the anchor target, like in Firefox and Internet Explorer," he explained. "The way it is now in WebKit, internal links are practically unusable without scripting to fill in the proper behaviour."

Although the article was written from the context of skip-to-content links, Muma was keen to point out the problem is much wider: "It really affects anyone browsing a site using the keyboard. And this is important, because it's not just about people who hate moving their hands away from the keyboard while browsing. Many people use keyboards, or input devices that mimic keyboards, because it isn't physically possible for them to use a mouse. For these users, any unnecessary keystroke could be not just inconvenient but potentially painful."

Author of Adaptive Web Design Aaron Gustafson was also surprised by the bug, and told us that "while skip-to links are a common example of the problem, they're far from the only use – FAQs are probably the most common application". Gustafson said that the behaviour noted by Muma was bad for accessibility and has been "largely ignored by the WebKit team". This, he suggested, should be a big concern to those on the WebKit team: "It powers so many desktop browsers now – Chrome and Safari being the primaries, but Flock for Mac, Maxathon, Shiira, OmniWeb and iCab are other notables – and this bug therefore poses a major problem for the accessibility and usability of our websites. There are JavaScript workarounds, but they shouldn't be necessary – this is HTML 1.0 stuff!"

As for getting something done about the issue, Muma says you can visit and 'star' Chromium Issue 37721: 'Skip links do not work when using screenreader'.