Apple have worked really hard to implement really great accessibility features in iOS, from voice over which reads the text on your page, to the magnifying glass which can move to follow your typing. These features can be incredibly useful for individuals who have visual difficulties and allows them to get the most out of the apps they use everyday. However, there are some things that from a developers perspective are just a little bit odd, focusing on voice over and dynamic text.

VoiceOver

One of the biggest things Apple offers is VoiceOver, which when enabled Siri will read out the text and even bits of information on an image below your finger.

You can enable VoiceOver in settings – general – accessibility, however typically people customise their “accessibility shortcut” option (right at the bottom of the accessibility page) to VoiceOver. This means when you triple tap with the home button you can enable and disable VoiceOver.

You can also switch what’s being read by using a dial – by using two fingers and pinching like you were turning a dial on the screen (this could take a while to master). Options include reading out individual characters, words, or containers. Apple draws a box around what’s currently being read and if you swipe left or right it reads out the next or previous thing. This is almost identical to how Apple’s “Switch” system works however instead of you controlling when to move onto the next thing it automatically loops around all the items.

Whilst this all probably sounds really useful there is an oddity in that as a programmer I cannot set the order of which things will be read (or I couldn’t find a way) which led to some “interesting” results. For example if you select to open a tab item, you have to swipe back through all the previous unselected tab items, and swipe through from the bottom of the page to be able to read from the top of the page.

Another unintended feature we had within a recent app, and found in many others, is within the hamburger slide out menu. Most designers chose to show a slither of the remaining page so as to demonstrate the menu drawer behind the main app. This means when you’re swiping around the app begins to read out everything on the main window as well as the navigation drawer.

Combined with the previous issue of not being able to edit the order this meant when people tried to listen to all the options in the drawer in order they were interrupted by items on the main page. There is a rough work around where we disabled any accessibility help on the main page whilst the drawer was present, and re-enabled them again when the main screen was back in focus.

Dynamic Type

In iOS 7 Apple also introduced a feature called Dynamic Type which allows you to customise the size text appears so you can read better. People like my mother have theirs hilariously set to the largest size however only very few apps actually support it outside of Apple’s own apps.

You can change the text size you see by going to settings – general – accessibility – and selected larger text. Here you are presented with a slider to change the size of text in apps that support it. You can also enable extra larger text size by turning on a toggle for “larger accessibility sizes” and the slider extends with some even larger text sizes.

For developers, we can easily implement these by setting the font of any given text item on an app to the “dynamic font” and pick what type the text is e.g. Title, heading1 etc. This has some interesting results if you set up a label with one of each of the font types and change between small text, big text, and extremely big text.

As you can see in the diagram, the text doesn’t change all that much between the screens except noticeably the body text in the extra large text, which surprised us. The other major annoyance with using Dynamic Type is the inability to use a custom font, you simply have to use Apple’s Helvetica.

There is a way around both of these however by looking at a variable called preferredContentSizeCategory which shows you what font size the person has selected on their “larger text” accessibility slider. With this we can create our own class or category to get the desired font for a header or paragraph text, and update the font size. There is a full example at this Stack Overflow comment to see how this works.

Table showing font sizes for the various sizes and text types from Stack Overflow