Creating content
Best practices for building accessible experiences
- Write in short sentences. It makes content much easier to read
- Write one idea per sentence. Avoid long, complex sentences
- Keep paragraphs short and a similar length
- Use bullet points to break up large blocks of text
- Aim to make bullet points similar lengths so they're easy to read
- Create clear, scannable headers
- Use plain English. The average reading age in the UK is 9
- Don’t use puns or idioms as users may not understand them
- Create label copy on buttons that clearly describes the action
- Include destination names in links so it’s clear where they take the user
- Use emojis sparingly and aim to use them at the end of sentences
- Avoid using abstract iconography, especially without a descriptive label
- Avoid unexplained jargon. If you must use technical terms, define them.
Language
Use inclusive language
There are a number of approaches to consider when talking about disability. Identity-first language leads with a person’s diagnosis, such as ‘an Autistic person’ and person-first language puts a person before their diagnosis, such as ‘a person with Autism’.
We are a multi-cultural company so it’s worth noting that there’s nuance from country to country. Always check a country’s regional disability guidance.
Use respectful, positive and enabling language for and about disabled people:
- “has” or “was diagnosed with”, not “suffers from”
- “blind person”, never “the blind”
- “wheelchair user”, never “confined to a wheelchair”
Image descriptions
Add contextual information to meaningful images
Make any visual experiences accessible for screen reader users by adding a description for informational and emotional images. This is called ‘alternative text’ (alt text), which is information that describes the function or description.
Decorative images
A decorative image is often a graphic or icon that — if excluded — would have no impact on the experience. Alt text isn’t required for these and is best avoided to reduce noise.
Informative images
Add alt text if the image supports or adds a visual representation of the experience. For example, a background image on a homepage campaign.
Functional images and icon-only labels
It’s essential to add alt text if the image or icon is functional and helps the user to complete an action. For example, a magnifying glass icon could be labeled ‘Search’.
Images and graphics in emails
Although it’s best practice to avoid embedding text in images, it’s sometimes unavoidable in certain types of content. When creating email communications, add alt text to give clear context to screen reader users. It’s also good practice to surface important information written as text at the top of the email as some users may have images blocked.
Form fields
Make hint text clear for screen readers
Where possible, show any hint text before a form field, or specify that screen readers announce the content when a user navigates to the entry field.
Avoid using placeholders in form fields
Aim to avoid suggestive copy in form fields as it may lead users to think the information has already been entered. It’s often too pale for people to read, and it disappears on focus, meaning important information could be missed. If the copy provides information on how to fill in the field, it should be always present as hint text.
Captions and transcripts
Include captions and transcripts to make sure video content is accessible to everyone. There are many reasons users access transcripts and captions – hearing-impaired users may not be able to hear audio from videos or content, users with cognitive impairments may prefer to read information, and many situations make captions the preferred way of consuming content.
Fun fact: 40% of Netflix users have captions turned on, and up to 80% of online videos are consumed through captions.
Feedback Messaging
Positive Feedback
Positive feedback should be concise, direct, and timely, confirming a user's action and reinforcing their success without unnecessary words.
- Give a clear confirmation, not a verbose explanation. The user already knows what they did; the message just needs to confirm it was successful. Avoid redundant words like "successfully" or "completed."
- Provide a Solution, not a statement. Messages should guide the user on their next step. Rather than just stating an outcome, tell them what they can or should do next.
- Match User's Mental Model. Use language that directly relates to the user's action and their goal. If they clicked a button that says "Add to cart," the feedback should say "Added to cart."
Error Feedback
When a user encounters an error, the message should explain what went wrong and how to fix it.
- Be clear and concise. Don't use technical jargon. For example, instead of "Error 404," say "We can't find that page."
- Provide a solution. Guide the user on their next step. For instance, instead of "Username invalid," suggest "Username must be between 6 and 15 characters."
- Avoid blaming the user. Messages like "You entered the wrong password" can be frustrating. A more helpful approach is "The password you entered is incorrect. Try again."
Helper and Hint Text
This content provides guidance to a user before they take an action.
- Be a guide, not a demand. The text should gently lead the user and clarify expectations. For example, instead of "Enter your name," use a hint like "First and last name."
- Keep it brief. Users shouldn't have to read a long paragraph to understand what to do. Short, scannable phrases work best.
- Avoid using placeholder text as a hint. Placeholder text disappears when the user starts typing, making it difficult to reference. Always use a visible hint or label that stays put. For example, use a label like "Username" with a clear hint below it, like "Must be at least 6 characters."
Accessibility Text
This content is for users who rely on screen readers or other assistive technologies.
- Make it descriptive. Use clear and concise language to describe images and icons. For example, for a magnifying glass icon, use the accessible label "Search."
- Only add to meaningful visuals. Decorative images don't need a description. Adding one can clutter the experience for screen reader users and create unnecessary noise.
- For functional elements, be explicit. For example, a button that has only an icon should have a hidden label that says "Share this page" instead of just "Share."