1.8 Hint text not completely announced on iOS (Medium)

1.8.1 WCAG 1.3.1 (A), 4.1.2 (A) - iPad, iPhone

When navigating the site with VoiceOver on an iPhone or iPad, the hint text programmatically associated with the radio buttons is not completely announced. For instance, on the ‘Tell us about your client’ page, only the paragraph text is announced; the list items are not. So, the radio button is announced as “Yes, a partner is someone your client is, Do not include anyone who”, while the other content is ignored.

This is unexpected since hint text should be completely announced when the radio button receives focus. Users navigating via just form controls might lose out on this information.

FIGURE 1.11: VoiceOver announced text highlighted on Tell Us About Your Client page

FIGURE 1.12: Text highlighted on Dependant Income page

1.8.2 Code Snippet

<fieldset aria-describedby="applicant-form-partner-hint">
  <legend>Does your client have a partner?</legend>
  <div id="applicant-form-partner-hint">
      <p>A partner is someone your client is: </p>
      <ul>
      <li class="govuk-hint">married to</li>
      ...
  </div>
  <div>
    <input ...>
  </div>
</fieldset>

1.8.3 Recommendation

It is unclear why this behaviour is seen only on iOS devices, and we believe that is could be caused because certain versions of VoiceOver omit list items when announcing descriptions to avoid redundancy or overwhelming users with content. Further inspection of the code and classes may be necessary to fully understand and resolve this behaviour.

However, we do recommend refactoring this element to a collapsible field as highlighted in Radio hint announcements are quite verbose (Observation)to avoid verbose screen reader announcements.

---