JetBlue Incorporates App Accessibility

Dynamic sizing allows users to customize the text size on their device to either be larger or smaller than the default font size. This is accomplished with Dynamic Type on iOS and scalable pixels on Android. With dynamic sizing, our team aims to make sure all of the app’s content is available in all font sizes, that the content doesn’t overlap or get cut off, and that the layout of the content is still presented clearly in all font sizes. The booker within the iOS JetBlue app is one place dynamic sizing can be found, as seen below.

To support users who are blind or have low vision, iOS and Android both offer screen readers that speak out the content on the screen to the user. On iOS, the screen reader is also referred to as VoiceOver and on Android it’s called TalkBack.

For the JetBlue app’s screen reader, one of the key components we focus on is making sure we provide context to accessible elements. An example of this for the JetBlue iOS app can be found within the calendar, as seen below.

If we don’t consider the use of the screen reader for the app’s calendar, as the user starts to navigate through the view, they would hear very basic feedback such as “S, M, T, W, February 2020, 4 button” etc. However, if we provide more context within the app for the screen reader, the user will be given more details such as “Tuesday, February 4, 2020, Button.”

An accessibility label on iOS is usually applied to informative and actionable images. An added benefit of adding such labels is that this same copy can be used for iOS 13’s Voice Control feature. For example, the plus icon that is outlined below has an accessibility label of “Add,” so with Voice Control, a user could say “Tap Add” to have the device tap on that plus icon.

Colorblind and low vision users may have trouble distinguishing color differences within an application. To make certain that the JetBlue app considers this - we integrated other factors for identifying information. For instance, since JetBlue already uses shapes for visuals for their seat maps, we carried that visual cue into their mobile applications. As seen below, available seats are squares, selected seats are circles, and unavailable seats are Xs.

Another example of how the JetBlue app is accessible can be seen through error messages on forms. By adding icons and error messages to forms, errors are made more clear for all users as opposed to just indicating an error with a red color. Lastly, contrast is another factor that our team designs for, and by doing so, we confirm that the foreground and background colors meet the contrast ratio guidelines for the visually impaired.

One of the simplest ways to integrate accessibility into mobile applications is to take advantage of all that iOS and Android have built into their platforms. Native system fonts and system controls come with some great accessibility features already built-in. Within the JetBlue app, system fonts can be found throughout the majority of the app, one benefit of this on iOS is shown below, when the bold text accessibility setting is enabled on a user’s device, the system font becomes bold with no extra development effort.