< Back to Demos | Learn more at PaulJAdam.com >

VoiceOver iOS Multiple Focus of Internal Elements Bug and Hack Fix

https://axesslab.com/text-splitting/

Normal example of a link with multiple internal elements that is only buggy for VoiceOver on iOS.

Screenshots

VoiceOver iOS focus on Back arrow VoiceOver iOS focus on Home text

*VO iOS will incorrectly focus on the back arrow image and the link text separately. The link text spoken is not meaningful when split into multiple elements.

Hack Fix example of a link with multiple internal elements that is no longer buggy for VoiceOver on iOS because it has a <span role=text> wrapper.

Screenshots

VoiceOver iOS focus on full link including back arrow and home text.

*VO iOS correctly focuses on the back arrow image and the link text as one single element spoken properly.