Skip to main content
Home

Main navigation

  • Apps
  • Forum
  • Blog
    • Podcast
    • Guides
    • Hardware & Accessory Reviews
    • Bug Tracker
    • Developer Resources
  • Log in

Breadcrumb

  1. Home
  2. Forums
  3. App Development and Programming

HTML development and VoiceOver

By slugolicious, 13 June, 2014

Forum
App Development and Programming

I didn't see a good forum group for questions specific to HTML. The "App Development" group is probably more about writing native iOS apps in objective-c (or swift) but I'm writing applications in html5, css, and javascript. I'll post here anyway because it's the closest match.

Has anyone found a list of why a VoiceOver touch target loses its "touchiness"?

Let me explain a little bit. I often use <svg> elements to overlay on top of images so that VoiceOver users have touch targets and can explore the image. (Not sure if "touch target" is the right term but with VoiceOver on, as you drag your finger around the screen, you can hear VO read the various elements. Each element that it can read I consider a "touch target".)

For example, if I have a bar chart image, I will have <rect> objects where the bars are and the <rect> will have a role=text and an aria-label. This allows you to explore the bar chart. You can get a sense for how tall or wide the bars are because your finger will move off the <rect> touch target. The aria-label usually has information about the height of the bar or what data it represents.

Sometimes my touch targets lose their touchiness. VoiceOver loses the element and you can't find it. So far, I've found 5 reasons why this might happen but I'm curious if there are more.

1. Role=text gets lost
2. Aria-label gets blanked out or removed
3. Display (CSS) gets set to none
4. Visibility (CSS) gets set to hidden
5. Aria-hidden gets set to true
6. Another object is on top of the touch target that is not a touch target itself (z-order problem)

I have a case where none of these conditions are true yet my touch target is still lost. The html application works fine for visual users and a mouse but VoiceOver loses the ability to navigate to the element. I'm hoping someone knows of other reasons or knows of another forum or website that talks about html and voiceover development.

Options

  • Log in or register to post comments

More Like This

Recommendations on learning PHP, Javascript, Ruby, CSS, and HTML. (Forum Topic)
Web development on the mac (Forum Topic)
Please help me report this Apple developer bug (Forum Topic)
objective-c syntax (Forum Topic)
View Source – HTML, JavaScript and CSS (iOS and iPadOS App Directory)
VoiceOver is not recognizing ARIA 'alert' and 'alertdialog' roles (Forum Topic)
VoiceOver direct interaction on web game? (Forum Topic)
programming concepts (Forum Topic)

Site Information

  • About
  • Club AppleVis
  • FAQ
  • Contact

Unless stated otherwise, all content is copyright AppleVis. All rights reserved. © 2023 | Accessibility | Terms | Privacy