Upgrade to Pro — share decks privately, control downloads, hide ads and more …

No Touch(screen) Required: Voice & Keyboard Acc...

No Touch(screen) Required: Voice & Keyboard Accessibility

Accessibility is a topic that I care deeply about. Making sure everyone can use a product is something we, involved in building products, should think about.

On Apple platforms, you may be familiar with features like dynamic type (different text sizes), dark mode, and maybe even VoiceOver and Switch Control. But things don't stop there.

With Voice Control and Full Keyboard Access, Apple has taken accessibility another step further, making interacting with your device without needing to touch it easier than ever. Let's take a look at these technologies — how they work, and how you can support them by leveraging accessibility APIs.

Bas Broek

May 19, 2022
Tweet

More Decks by Bas Broek

Other Decks in Programming

Transcript

  1. Bas Broek • iOS, Accessibility & more @ WeTransfer •

    Previously macOS Accessibility / VoiceOver @ Apple • Swift for Good co-author @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 4
  2. "Evolution" of Accessibility on Apple platforms • VoiceOver, Switch Control

    • Voice Control • Full Keyboard Access • ... and more; think zoom, Dynamic Type, Reduce Motion etc. • ... as well as Dark Mode, Back Tap, Siri, haptics @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 7
  3. UIKit accessibilityLabel - "Volume" accessibilityTraits - .adjustable accessibilityValue - "56%"

    accessibilityHint - "Swipe up or down to adjust." @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 11
  4. /// The default value for this property is an empty

    array /// unless the element is a UIKit control. /// In that case, the value is an array with /// an appropriate label, if different from `accessibilityLabel`. /// /// Use this property when the `accessibilityLabel` isn't appropriate for /// dictated or typed input. /// For example, an element that contains additional descriptive /// information in its `accessibilityLabel` can return a more concise label. /// /// The primary label is first in the array, optionally followed /// by alternative labels in descending order of importance. /// /// If this property returns an empty array or an invalid value, /// the system uses `accessibilityLabel` instead. @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 18
  5. /// The default value for this property is an empty

    array /// unless the element is a UIKit control. /// In that case, the value is an array with /// an appropriate label, if different from `accessibilityLabel`. /// /// Use this property when the `accessibilityLabel` isn't appropriate for /// dictated or typed input. /// For example, an element that contains additional descriptive /// information in its `accessibilityLabel` can return a more concise label. /// /// The primary label is first in the array, optionally followed /// by alternative labels in descending order of importance. /// /// If this property returns an empty array or an invalid value, /// the system uses `accessibilityLabel` instead. @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 19
  6. "TAP TO COPY LINK" "Tap 'tap to copy link'" @basthomas,

    #GAAD, May 19, 2022 @ CocoaHeads Sydney 20
  7. "TAP TO COPY LINK" "Tap 'tap to copy link'" "Tap

    'copy link'" @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 21
  8. "It's Complicated: Inside an A. Lange & Söhne Split- Seconds

    Chronograph" "Tap 'It's Complicated: Inside an A. Lange & Söhne Split-Seconds Chronograph'" @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 22
  9. "It's Complicated: Inside an A. Lange & Söhne Split- Seconds

    Chronograph" "Tap 'It's Complicated: Inside an A. Lange & Söhne Split-Seconds Chronograph'" "Tap 'article, 1'" @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 23
  10. UIKit copyLinkButton.accessibilityLabel = "Tap to copy link" copyLinkButton.accessibilityUserInputLabels = [

    "Copy link", "Copy" ] article.accessibilityLabel = "It's Complicated: Inside an A. Lange & Söhne Split-Seconds Chronograph" article.accessibilityUserInputLabels = [ "Article", "News", article.accessibilityLabel ] @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 24
  11. SwiftUI .accessibilityLabel( "Tap to copy link" ) .accessibilityInputLabels([ "Copy link",

    "Copy" ]) .accessibilityLabel( "It's Complicated: Inside an A. Lange & Söhne Split-Seconds Chronograph" ) .accessibilityInputLabels([ "Article", "News", "It's Complicated: Inside an A. Lange & Söhne Split-Seconds Chronograph" ]) @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 25
  12. /// The default value for this property is an empty

    array /// unless the element is a UIKit control. /// In that case, the value is an array with /// an appropriate label, if different from `accessibilityLabel`. /// /// Use this property when the `accessibilityLabel` isn't appropriate for /// dictated or typed input. /// For example, an element that contains additional descriptive /// information in its `accessibilityLabel` can return a more concise label. /// /// The primary label is first in the array, optionally followed /// by alternative labels in descending order of importance. /// /// If this property returns an empty array or an invalid value, /// the system uses `accessibilityLabel` instead. @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 28
  13. Loopin' back • VoiceOver support gets you most of the

    way there • Adding Voice Control support will get you ±all the way • ... to also support Full Keyboard Access on iOS! @basthomas, #GAAD, May 19, 2022 @ CocoaHeads Sydney 31