#365DaysIOSAccessibility

Day 55

Include icon state in labels and values

12 Jul 2022

accessibilityLabeliOS

By

Dani Devesa Derksen-Staats

When thinking about accessibility labels and values, it is easy to miss adding information or state that are represented by little visual cues and icons: a checkmark indicating something has been played, a down arrow indicating a downward trend...

5 examples. 1. A Ted Lasso episode with a checkmark should indicate that the episode has been played. Good candidate for the accessibility label of the element? 2. The Time Cook profile on Twitter has an icon, also with a checkmark indicating that the profile is verified and that should be conveyed to the user. The icon of a person preceding the Following word is decorative, so no other info needs to be added. 3. A download icon in a tab bar has a badge with a checkmark. We could add a value indicating that the downloads have finished. 4. Contravariance podcast episode. There is an animated bar equaliser indicating that the episode is being played. There are 30 mins left. There is also a progress bar. Redundant with the minutes left? I think the percentage left is still relevant information for the VoiceOver users. 5. For screen time in iOS, it indicates the percentage differing from last week with an up/down icon that should not be missed.

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 16

Better relative date and weekday labels

Two more examples on better accessibility labels for abbreviations. "4 days ago" is better than "4 D", with a RelativeDateTimeFormatter and a spellOut units style. "Monday" is better than "Mon", accessing the weekdaySymbols from a Calendar. Some useful links: Relative Date Time Formatter: https://developer.apple.com/documentation/foundation/relativedatetimeformatter Units Style: https://developer.apple.com/documentation/foundation/relativedatetimeformatter/unitsstyle-swift.enum/spellout Weekday symbols: https://developer.apple.com/documentation/foundation/calendar/weekdaysymbols

Day 226

Let users add alt text when sharing

If your app lets the user share images, consider implementing the possibility for them to add an alt text for the image, so it can be used as an accessibility label when consumed by other users. Twitter or Slack have nice flows for doing this.

Day 59

Please don't use accessibility labels as UI test IDs

Please, don't use accessibility labels as ids for your UI tests. It can completely ruin the experience for VoiceOver users. There is actually an accessibility identifier property that you can use instead to uniquely identify your UI elements.

Content © Daniel Devesa Derksen-Staats on Accessibility up to 11! is licensed under CC BY 4.0. License details

← Day 56
Day 54 →