My iPhone application is built using Cordova and it for the most part native and I am having an issue with Accessibility. During my accessibility testing I noticed that when Voice Over is selected on some elements it reads out more than just the text of the label or button. For instance here is what a pages header looks like in my HTML:
<div data-role="header">
<div class="page-header">
<h1 class="header-title"><%= title %></h1>
</div>
</div>
When H1 is selected the following is read out to the user: Banner Title Heading Level 1 Landmark
Is there any way to restrict it to only speak out the title content?
Looks like you are using jQuery Mobile. jQuery mobile adds some markup to the elements based on where you have placed them and the attributes applied. In this case it is placing role="banner" on the div with the data-role="header".
The way that is being read out is fine. If you are in fact using the header as a header, then the screen reader user now has that useful piece of information. If they do not want it, they can tell their screen reader to suppress it. Think of it as the audio equivalent of the fact that the header is visually distinct from the rest of the page.