A woman walking through an airport pulling a wheeled suitcase
Accessible airline websites make travel better for everyone.

It’s been quite the busy year travel wise, and I’ve had my fair share of online booking experiences. My travel included business trips to Boston, Chicago, and Austin, plus a fun, first-time ski trip to Colorado. In recent years airline websites have made major improvements in web accessibility. With these changes, booking air travel online is becoming a more enjoyable experience for me.

As a screen reader user for 20 years, a communications specialist with Knowbility, and a journalism professor at Cal State Long Beach, I’ve learned a thing or two about web accessibility. This post will highlight the features of an airline website that are crucial to an accessible experience. Note, as a blind person, I won’t be providing feedback on accessibility for low vision or color blindness. This is one traveler’s experience, but better web accessibility of airline websites in the United States is cruising at top speed. This leads to greater dignity and independence for people with disabilities.

American Airlines: A snappy homepage

Image of a plane with an American Airlines logo sitting on a runway.
How did American Airlines do on their website accessibility?

This isn’t an exhaustive review of all websites for U.S. airlines. So, for simplicity’s sake, I’ll touch on my experience with American Airlines (AA), the airline on which I most recently flew roundtrip from Los Angeles to Chicago O’Hare. I’ll stick to reviewing the homepage, but be assured that I independently completed all digital tasks, including booking my ticket, reserving a meal, and checking in for my flight using the website running on Chrome with JAWS and the AA iOS app with VoiceOver.

Using arrow key navigation, the first interesting element is a list containing six items. In addition to a search text input that lets customers search the entire website, there are skip links to the navigation section, the main content area, and the website’s footer. Skip links, especially when placed at the beginning of the tab order, are enormously helpful. They allow people who use a keyboard to quickly bypass large blocks of text and other elements and reach the section of the website with which they want to interact.

Screenshot of American Airlines site banner with a pink dashed rectangle around the skip to content link
American Airlines banner with skip to content link highlighted

Heading structure helps to stay organized

When used correctly, the HTML heading elements H1 through H6 give screen reader users a better idea of the layout and structure of a website. AA.com’s minimal use of headings is helpful because it allows one to easily understand how the website is organized. Screen readers can generate a list of headings that are easily navigated. AA.com’s homepage has only 12 headings. So, with just a few keystrokes I can review a list of headings and am aware of the key features of the page.

A visual display of the headings used on the airline web site.
List of headings generated by the VoiceOver screen reader

Good labels keep the passenger informed

The form used to book flights requires a sizeable amount of information. This includes departure city, arrival city, dates of travel, number of passengers, and more. Having an accessible and efficient way to input all this information greatly improves the user experience. Form fields and controls with good labels are key components for achieving this goal. American and other major airlines in the US generally provide good form accessibility. AA.com includes labeled radio buttons for type of search (flight versus vacation packages) and type of flight (roundtrip versus one-way).

A detail of the American Airlines flight booking form.
Flight booking form with the flight type choice radio buttons highlighted

Moving through the booking form, there are labeled text inputs for departing city and arrival city. They are labeled “From” and “To,” respectively. The fields for departing and returning dates are also well-labeled and specify the format in which dates should be input. When my screen reader announces, “mm slash dd slash yyyy,” for the date format, I know to type two digits for the month, two for the day, and four for the year.

The built-in calendar allows for easy keyboard navigation of dates, if that’s how the passenger wants to input them. The added hint “to navigate the calendar, use the control key with the arrow keys,” is a nice touch that clearly instructs how to use this particular date picker. Date pickers come in all sorts of varieties, and it’s not obvious how to use one without prior guidance. I’m happy that American has really thought this process through.

Airline flight booking form showing datepicker for selecting dates.
Depart date field highlighted and calendar displayed with the VoiceOver visible text output of the usage instructions

The Air Carrier Access Act

In 2013 the Department of Transportation amended the Air Carrier Accessibility Act to include website accessibility. Since June 30, 2016, all public-facing pages on an airline’s website must follow the internationally recognized Web Content Accessibility Guidelines version 2.0. The law also mandates the airlines conduct usability testing with people with disabilities. This ensures that websites are not only technically accessible, but also provide a good user experience for all.

Conclusion

Image of an airplane wing flying over clouds with a sunset in the background
Thank you for flying with us today!

My experience with American Airlines and other major U.S. carriers in recent years shows that airlines are making a good-faith commitment to web accessibility. On its Accessibility page, American writes:

Whether you use a screen reader, voice recognition software or another kind of assistive technology, we want aa.com to be your one-stop-shop for all your travel. From booking to check in and everything in between, we’re making it easy to navigate our site and find exactly what you need. (American Airlines 2019)

I’m heartened to read that the airline is inclusive of other assistive technologies beyond screen readers. It is my hope that the company continues its path towards accessibility and that others do the same.

Finally, thanks to Becky Gibson, accessibility strategist with Knowbility, for help with this post. If you have questions, comments, or want to add your perspective, please let us know via email or on Twitter @knowbility. And, if you need help with all the other tasks related to accessible design, development, and leadership support, we’re here for you.