Day 50

Labels, traits, and values for the same experience

7 Jul 2022

accessibilityLabel accessibilityTraits accessibilityValue iOS accessibility

A similar experience can sometimes be achieved in different ways using labels, traits, and values. Most times there are no right or wrong answers; it will be up to your users to say which approach they like the most.

Three approaches to show a like button that looks like a heart. Filled for selected, unfilled for unselected. First approach is to use the

Two great pieces of advice though:

> @Sommer: "Check and see how Apple's own apps handle similar scenarios. Not because our apps are perfect but rather to help build on consistent patterns."

> Tweet by @Sommer

> @dotjay: "Meet the platform expectations, and give users control rather than prescribing what you think users want."

> Tweet by @dotjay

Some of you have asked me how you can support what I do. This would really help, and would be hugely appreciated:

Find these posts useful? Share them at work, on social media, or with anyone that might find them interesting. Let's spread the word!
Check out any of my apps or games: Xarra!, RetroRapid!, or Mestre!.
- A download and a review go a long way. They're free by default. On the App Store, ratings and reviews really help more people discover them.
- Finding any of them useful? If so, and if you can afford it, purchasing lifetime access to all features or subscribing lets me buy the coffee that keeps me caffeinated. Caffeine keeps me going to maintain the apps, bring in new features that I hope you'll love, and keep writing.

You may also find interesting...

Day 200

Don't miss visual cues in accessibility labels

There are details conveying important information that are shown visually with little icons, badges, progress bars, and similar cues that can be missed when they are not added as part of the accessibility label or accessibility value of a UI component.

Day 56

Override labels for NSTextAttachment icons

It is possible to embed icons within text using NSTextAttachment and NSAttributedString. If you do, please remember to override the accessibility label, otherwise VoiceOver will announce it as "Attachment.png File". Example code in the image: ```swift let magnifyingGlassIcon = UIImage(systemName: "magnifyingglass")! let searchButton = UIButton() let searchTutorialLabel = UILabel() searchButton.accessibilityLabel = "search" let textAttachment = NSTextAttachment(image: magnifyingGlassIcon) let string = "Select the button to find elements in the list" let attributedString = NSMutableAttributedString(string: string) let attributedStringIcon = NSAttributedString(attachment: textAttachment) let iconPlaceholderRange = attributedString.string.range(of: "")! let iconRange = NSRange(iconPlaceholderRange, in: attributedString.string) attributedString.replaceCharacters(in: iconRange, with: attributedStringIcon) searchTutorialLabel.attributedText = attributedString searchTutorialLabel.accessibilityLabel = string.replacingCharacters(in: iconPlaceholderRange, with: searchButton.accessibilityLabel!) ```

VoiceOver accessibilityLabel iOS

Day 48

accessibilityValue conveys control state

Accessibility values are about state. Using them appropriately will make the experience better for Voice Control users. Think of a repeat button (values could be: off, one or all songs) or a notifications tab (value could be: x new items). For more on accessibility values, check out this fantastic blog post from @MobileA11y with info on the APIs (UIKit, SwiftUI), accessibility attributed values, WCAG, or some more examples (text in a text field, value on a stepper or slider). https://mobilea11y.com/blog/accessibility-values/

Voice Control accessibilityValue iOS

← Day 51

Day 49 →