Tips for supporting accessibility in iOS Apps

Supporting accessibility features in iOS Apps can be tricky, but it’s important to do. In their Accessibility Programming Guide for iOS, Apple points out we should do this because:

  • It increases your user base
  • It helps meet guideline from governing bodies
  • It’s the right thing to do

And, as Jakob Nielsen points out, the overlap between making software useable and accessible is “remarkably large,” so thinking about and implementing accessibility features can help to improve the user experience for your entire audience.

When considering accessibility support in iOS Apps, it’s best to start with the fundamentals. Standard UIKit controls and views are accessible by default, but can be sensitive to any sort of customization. I highly recommend reading the “Making Your iOS App Accessible” section of the Accessibility Programming Guide for iOS, which does a great job of covering basic techniques for supporting accessibility. The WWDC 2015 video iOS Accessibility is worth checking out as well (covers a lot of the same topics).

Even armed with that knowledge, however, there area number of gotchas when it comes to implementing accessibility in iOS Apps. Here I’ve compiled a few techniques we’ve used to overcome some particularly tricky accessibility challenges:

Tableview cell sub-views spoken out of order

Tableviews tend to be tricky in general for accessibility. Even after following the general guidelines for making tableviews accessible, in cases where we’ve implemented custom tableview cells, we’ve often found that sub-views are spoken out of order by the Voice Over screen reader. To correct this you can set a tableview cell accessibility label in code to control the order the text is spoken in. This example overrides the accessibilityLabel property in a custom tableview cell sub-class:

- (NSString*)accessibilityLabel {
     return [NSString stringWithFormat:@"%@, %@, %@, %@ %@", 
         self.titleLabel.text, 
         self.locationLabel.text, 
         self.descriptionLabel.text, 
         self.stateLabel.text, 
         self.timeLabel.accessibilityLabel];
 }

Note here we’re also using the text properties (i.e. the visible text) for some of the sub-views, and the accessibilityLabel property in one case where we want the Voice Over text to be different than the visible value.

Weird Voice Over pronunciation of capitalized words

The casing of words can have a subtle, yet noticeable effect on the way Voice Over pronounces things. Using title case for things like names and locations is recommended, but can have unintended side effects for words that are not proper nouns. You may want a label value to appear capitalized, but if the value is not a proper noun, setting the accessibility label to the lower case value of the text may correct the Voice Over pronunciation, for example:

self.titleLabel.accessibilityLabel = self.titleLabel.text.lowercaseString;

Responding to Larger Text change for dynamic elements

Apple introduced Dynamic Type in iOS 7, which allows users to adjust the relative size of text with “Larger Text” in the Settings App. If you use standard Text Styles and auto-layout this mostly just works, but things get tricky when applying styles and sizing elements dynamically. We’ve found this particularly common with tableviews, especially because it does not cause the tableview cells to reload. Fortunately, you can observe UIContentSizeCategoryDidChangeNotification to change the size of views at runtime, for example:

- (void)viewDidAppear:(BOOL)animated {
    [super viewDidAppear:animated];
    
    [[NSNotificationCenter defaultCenter] addObserver:self
         selector:@selector(didChangePreferredContentSize:)
         name:UIContentSizeCategoryDidChangeNotification
         object:nil];
 }
- (void)didChangePreferredContentSize:(NSNotification *)notification {
    //Do dynamic sizing of elements
    [self.tableView reloadData];
 }

Make a Voice Over “announcement”

There are a number of accessibility notifications you can raise to alert the Voice Over screen reader that something has changed on the screen. This is useful for UI elements that change dynamically in response to some other user interaction or a background event. There are notifications you can post for when just part of a screen changes (UIAccessibilityLayoutChangedNotification) or when an entire screen changes (UIAccessibilityScreenChangedNotification).

However, sometimes you just need to make Voice Over “announce” something. Again, tableviews seem to complicate things, and cases of labels changing dynamically inside a tableview cell is an example where this technique has proven useful.

UIAccessibilityPostNotification(UIAccessibilityAnnouncementNotification, aLabel.text);

Leave a Reply

Your email address will not be published.

top