Android for Everyone: Part 2 — Designing Your Android App for Accessibility
Part 1 — Android & Accessibility
Part 2 — Designing Your Android App for Accessibility
Part 3 — Implementing and Testing Your Android App for Accessibility
This article series is for developers and designers interested in learning more about accessibility, particularly related to the Android platform.
The first article in the series aimed to clarify what accessibility is and which services the Android platform provides to make Android a platform for everyone. The second article seeks to explain the fundamental design principles for designers to make their work more accessible to a broader audience. The third article will educate developers on a few simple implementation details to consider when coding their Android apps. It will also introduce several tools that assist in testing the accessibility of apps.
Designing for Accessibility
Accessibility starts with design. A designer with a passion for accessibility can lay a solid foundation for creating an app with an exceptional experience for both abled and disabled people.
Designing for accessibility requires the designer to reconsider aspects such as copy, typography, colour, and imagery. In my mind, design is a delicate balance between form and function, between the need to be creative and unique and the need to be understandable and usable by everyone. Let’s look at each of the design aspects in turn.
Copy should be localised, concise, and descriptive. Localised copy assist users with limited English vocabulary to understand the app in their native language. Screen readers laboriously read all the copy associated with your assistive text, so concise yet descriptive text is vital. Note that many screen readers automatically announce control types and states using words or sounds, so it is not necessary to include these in the content description. When deciding on copy for a particular control, prefer verbs over nouns- what the control does over the literal meaning of the control. For example, the plus sign often implies “new” or “add”, which is preferable over “plus” or “plus sign”.
The purpose of typography is to provide you with content, so text needs to be easily readable.
Size Android produces a lint warning for text sizes smaller than 12sp (scale-independent pixels), providing a good rule-of-thumb for minimum text sizes. Be aware that mobile devices provide settings allowing adjustment of font scale to values like small/normal/large/huge that varies the scale between 0.8–1.3 times the standard scale. It is therefore essential to test your app with a variety of these settings to avoid text overlap.
Weight Prefer fonts with a heavier weight over the light weight often provided in font-families.
Alignment Centred text increases cognitive load since the starting point of each line of text begins at a different position. Similarly, justified text increases cognitive load since the spacing between words varies. Such text increases the difficulty of reading for folks with cognitive impairments. In her course, “Hacking Digital Styleguides for Accessibility: Type, Color, Imagery”, Mac suggests a good alternative — creating a centred container with left-aligned text.
All-caps While all-caps often implies a call-to-action control, it does increase cognitive load and difficulty reading for those with cognitive impairments. Furthermore, tools like TalkBack read all-caps text as abbreviations, which must be very frustrating and confusing for its users.
Colour is a powerful design element, but take care when selecting a colour palette for your app.
Contrast The contrast ratio between any two colours represents how different the one appears from the other. A good contrast ratio between the text and background colour ensures that the text is easily readable. Small text to background should have a contrast ratio of at least 4.5:1, and larger text to background should have a contrast ratio of at least 3:1. The Material Design Color Tool is a great help in choosing an accessible colour palette as it indicates when the text colour is illegible on a particular background.
Visual cues Take care not to rely solely on colour to provide visual cues. Those affected by colourblindness have difficulty perceiving the difference between specific colours and would miss critical visual cues. For example, do not rely on the colour red alone to indicate that a field has been incorrectly filled in. Instead, combine the use of red with a clear error message. Don’t rely too heavily on motion as a design element, since this affects folks with motion sickness. Some platforms even provide a setting to reduce motion, although I have been unable to verify whether this setting is available on Android.
Imagery / photography
Most designers and developers know that they should provide alternative text for imagery, but often even this is omitted or neglected. Once again, this text should be localised, concise and descriptive. Provide alt text as microcopy to the developer, ensuring that the text is well-thought-out and clear, not a quick rush-job by the developer.
Designing for mental illness
Designing for mental illness is unexplored territory. However, as someone affected by mental illness, I have thought and heard about a technique or two that may be effective. For example, those affected by anxiety need clear instructions, augmented by more information should they require reassurance. Those affected by impulse control problems, such as some people with bipolar disorder in a manic state, would benefit from cues to stop, slowly consider, and then act, when they are performing an action that is not easily cancelable or reversible, such as online shopping.
To recap, creating an accessible Android app starts with design. When assessing your design for accessibility, consider elements such as copy, colour, and imagery. Designing for mental illness is unexplored territory, but a thoughtful and educated designer can significantly improve the lives of those affected.
In the next article, I will be exploring how Android developers can make use of the accessibility features available on the platform, and also be showing you how to test for accessibility using some very cool tools.
Till next time!
Hacking Digital Styleguides for Accessibility by Tatiana Mac
Material Design Guidelines for Accessibility