Technical Writing & Alt Text
Content strategy and alt text for maps, search filters, and page titles to provide a frictionless experience for screen reader users.
Role
UX Writer
Client
Airbnb
-
Problem:
Many pages of the Airbnb site use Airbnb’s generic page title found on the homepage (Airbnb: Vacation Rentals, Cabins, Beaches, Unique Homes & Experiences - Airbnb).
Additionally, the few unique page titles fail to reference Airbnb’s name, which can be a problem for users of assistive technology who may be using page titles to navigate through multiple tabs. (Imagine someone is comparing listings on Airbnb and Vrbo, and gets mixed up about which is which.)
Solution:
Create unique, descriptive page titles with a warm tone and action verbs, under 50 characters, preferably including a reference to Airbnb.
Examples of new page titles:
Manage your listings - Airbnb
Change your reservation - Airbnb
Deactivate your account - Airbnb
Insurance program intake form - Airbnb
Confirm and pay for your reservation - Airbnb
-
Problem:
When guests are searching through Airbnb for listings, VoiceOver does not communicate to AT users which search filters are being applied.
Solution:
Remove the aria-pressed function and instead apply aria-expanded pattern to these filters.
Then, depending on the type of filter, the copy solution will need to be slightly different.
If the filter has two options use this language: Filter applied, Filter not applied. (Use this copy solution for “Instant Book,” and “Price”).
For example, if the user is focused on the Instant Book filter but hasn’t applied that filter to their search, VO should read: “Instant Book, collapsed, filter not applied.”
If the filter has 2+ options, use this language: No filter applied, One filter applied, Two Filters applied, etc… (Use this copy solution for “Type of Place,” “Rooms and Beds,” and “More filters”)
For example, if a user is focused on the More Filters option after having selected 4 filters within that menu, VO should read: “More Filters, collapsed, 4 filters applied.”
-
Problem:
When users search for Airbnb listings using the map function, the Location, Dates, and Guests buttons with entered values are described in Voiceover with their entered values only, e.g. "Portland, OR, button" and "1 guest, button." This doesn't describe the buttons' purpose.
Solution:
Add more descriptive labels to these buttons.
Location Focus: add label “Location search”
Ex: “Location search, Houston, TX, United States, popup button, landmark. Dialog popup. Double-tap to activate the picker.”
Date Focus: add label “Travel dates”
Ex: “Travel dates, October 7th to 9th, pop-up button, dialog pop-up. Double-tap to activate the picker.”
Guest Focus: add label “Number of guests”
Ex: “Number of guests, 2 guests, Pop-up button, end search. Dialog pop-up. Double-tap to activate the picker.”
"Arthur is an outstanding writer who took to accessibility UX writing like no one else I’ve ever worked with."
— Tori Clark, Accessibility Specialist at Airbnb