The importance of iOS dynamic type

The importance of iOS dynamic type

Dynamic Type is not new. It has been around since iOS 7, but its adoption by applications has been somewhat patchy – until now. With iOS 11, Apple is making significant improvements to the feature that should lead to wide scale adoption. This article goes through these changes and considers how they will impact good app design and implementation.

What is Dynamic Type?

iOS has always included great support for text. The OS has dozens of high quality, scalable fonts and a sophisticated text rendering engine. Designers and developers have been able to leverage this rich feature set to produce attractive and functional UIs.

However, with a small screen, UI design is always a compromise between fitting content into the view and readability. And as the size of readable text varies from person to person, what works for one may be unusable for another. Text-heavy applications (such as news readers) might offer a text size setting but as such features need to be coded manually, most applications just don’t warrant the effort.

To solve this issue, Apple introduced Dynamic Type in iOS 7. It allows designers to utilize a set of seven (later increased to ten) text styles when selecting fonts. These styles are then mapped to different fonts and sizes according to the user’s text size setting. With Dynamic Type, any application can be responsive to the user’s size preference, which improves the experience for a broader range of users.

Dynamic Type supports seven size settings, allowing a significant variation in font size. For example, Body text style is 17pt at the default setting but ranges from 14pt to 23pt. However, this is not the limit as iOS includes an accessibility setting that adds five larger sizes, all the way up to 53pt for body text. (Note that, at present time, only body text size changes in the accessibility sizes – this will change in iOS 11.)

This flexibility comes with its own challenges. The dynamic range of body text is roughly 4:1, making even short sentences span multiple lines. Static layouts clearly will not function with Dynamic Text. Fortunately, Auto Layout will handle most of the heavy lifting, allowing the UI to adjust layout without the need for code.

Nevertheless, not all layout issues can be solved with Auto Layout alone. Also, retrofitting Dynamic Type into an existing application (particularly if it includes manual layout code) can be difficult. Finally, adopting Dynamic Type means abandoning the other OS-supplied fonts, not to mention custom fonts; not an easy choice for designers seeking a distinctive look.

These challenges have led many apps to be slow to adopt Dynamic Type, or to do so in a naive fashion, resulting in broken UIs, particularly for the larger settings.

However, all this should be about to change…

What is Coming in iOS 11?

At this year’s WWDC, Apple announced several improvements to Dynamic Type for iOS 11 that will have a big impact on the rate and cost of its adoption.

Perhaps the most significant is the ability to use other fonts with Dynamic Type. This allows designers effectively to redefine the text style palette (including typeface and point size) and the system will automatically scale them according to the user’s text size.

To understand the impact of this, just consider an educational application that wants to use Chalkboard SE (one of the standard iOS fonts) as its main typeface. Previously that would rule out Dynamic Type. In iOS 11, not only is this possible, but the designer could decide that the text should be slightly bigger (18pt, say, for body text) to look clearer with the handwriting typeface – and the fonts will still scale appropriately at other text sizes.

It also becomes easier to update existing UIs for Dynamic Text. Auto Layout gets the ability to adjust vertical spacing according to text size so text doesn’t get cramped at larger sizes. And for manual layout code, it is possible to scale pixel distances according to text size for similar effect.

Images can also scale to allow icons to be more visible in large accessibility text sizes. UIKit is even capable of keeping icons in vector form to avoid pixelation issues.

Beyond this, there is improved layout tuning as the text size is being made available as part of UITraitCollection, which is the standard way to track other factors affecting layout.

One final change is that now all text styles change point size with accessibility. This will greatly improve the reading experience for low-vision users as all text, not just body text, will scale. It also impacts design thinking as it means much more variation in content size.

What Does Apple Say?

Perhaps more important than the technical improvements to Dynamic Type is the push by Apple to promote accessibility in iOS 11. This includes applying “design for everyone” principles to the applications and utilities that ship with the OS. Amongst these principles are three goals for the use of text.

1. Text should be large enough for the user to read. (In other words, text should scale with Dynamic Type.)

2. Text should be fully readable. It shouldn’t be truncated unnecessarily and it shouldn’t be overlapped or clipping.

3. An app’s UI should look beautiful at all text sizes.

Achieving these goals requires UIs to be more adaptive than simply allowing text to grow. For example, table cell content is often organized horizontally with an image or icon on the leading side and text label trailing. This looks great for regular text sizes but the larger accessibility fonts lead to the label looking cramped (even to the extent of long words being broken across multiple lines) while the icon sits in a large vertical whitespace. Switching to a vertical layout with the icon above the text maximizes the horizontal space for the text while fitting more content onscreen.

In other situations, accommodating larger fonts may mean reordering vertical content to ensure that action buttons don’t get pushed down by multiline text, reorganizing tool buttons into multiple rows, or hiding ancillary content to make room for important text.

None of these adaptive designs come for free but Apple makes the point that they are worth it to deliver a great experience for everybody. And by delivering such an experience within the system applications, Apple is raising the bar for third-party apps. With iOS 11, users will be more willing to enable accessibility features to improve ease of use, and apps that fail to support Dynamic Type well will ultimately lose out to those that do.

Find out how we can work together to bring your ideas to life.

Find out how we can work together to bring your ideas to life.

Thank you for contacting us