Creating accessible content
Digital accessibility guide for Marketers
Creating accessible content
As a marketer, you plan out both strategic and tactical campaigns. You map out customer journeys and thoughtfully create content to nurture your contacts from one point to the next. Then you get stuck into creating digital assets, with a vision of success ahead. The key to unlocking success? Making content accessible. After all, to convert your audiences, they must be able to engage with your communications.
With this in mind, it’s important to make sure your online messages reach and resonate with every reader. That means considering the experiences of people with disabilities.
People with physical, cognitive, literacy or language challenges access and understand information in different ways. Accessible design must be considered. Not only that, accessible language matters too.
But making content accessible doesn’t just fall to the marketing department alone. Every team creates content used to communicate with your audiences, especially beyond the marketing funnel. Making sure all teams keep the user experiences of a diverse audience in mind is important. Not only for your brand image, it’s also the right thing to do. It can be helpful to have an accessibility style guide.
Accessibility is more than code and colours
For content to serve its purpose it must be able to be accessed, and used. But what does this really mean? Have a listen as Clare explains it all in this short podcast. Gain top tips as Clare shares her advice as one of Content Design London’s Content Designer’s.
How to make information accessible
Making content accessible is about more than just following accessibility requirements, such as the Web Content Accessibility Guidelines (WCAG). It’s about making sure our readers feel truly included when interacting with us online. For example, including alternative text on our online images isn’t enough. We must carefully choose this text to provide screen reader users with the same visual experience as sighted readers.
Beyond visual elements and functional accessibility, is our choice of language. We want our readers to not only access our content, but understand it too. Not everyone has the same level of understanding. Using plain language and easy-read techniques are also important.
Below, we’ve created a guide to help you. It’s been created with accessibility best practice and web writing standards in mind. By following this guide, you’ll be improving the customer experience for everyone, including people with disabilities.
Discover advice to using and creating accessible:
1. Use accessible language
Accessible language is about writing in a way that’s easy to understand. This means keeping content simple, short and clear.
To achieve this:
- Write using plain language or ‘Plain English’. This means language that’s easy to understand the first time it's read. Using simple language that’s free from difficult words and jargon can help.
- Keep sentences short, or less than 21 words. Sentences that are 21 words or more are considered long and ‘fairly difficult’ to read. Our top tip would be to stick to 1 thought per sentence.
- Use words with a reading age that can be understood by your audience. In the UK, 1 in 4 adults have very low literacy levels. We recommend keeping the reading age as low as possible so your content reaches a wider audience.
The above are all factors that affect readability. That means how easy or difficult it is to read something.
Accessible writing helps people with low literacy and cognitive disabilities to understand your content better. It also helps the average reader. For example, when it comes to sentence length, the longer it is, the harder it is to understand - for everyone. According to the American Press Institute, at 8 words long, readers can understand 100% of the content. At 14 words, they understand 90%. But at 43 words long, understanding drops to below 10%.
Short, simple and clear is better for everyone. It’s also in line with web writing standards. It makes content easier to scan for online readers. And that’s beneficial in today’s fast-paced world.
Webinar: Writing in Plain English
Fill in the form to access this recorded webinar and gain an overview of Plain English best practice.
Explore how to write reports, guides, emails & more that are easy for all your audience to understand. Take part in interactive tasks and practice your new skills.
Find out more about this Plain English webinar.
2. Choose an accessible font style and structure
Making content accessible is also about optimising visual elements for accessibility. The typeface you choose, as well as the size and layout of your text, can impact how easy content is to read. Not only that, how text is laid out on the page also has an impact.
- Use a font that’s easily-parsed. In other words, the eye can quickly determine the shape and pattern of. It helps to use simple and familiar fonts such as Tahoma, Helvetica, Arial and Verdana.
- Make sure there’s a good amount of space between each letter and word.
- Use a limited number of font variations to reduce cognitive load across your website.
- Use bold text rather than italics or underline when emphasising a piece of text. Italics and underlines can appear 'busy' to people with dyslexia and vision impairments.
- Use left-aligned text where possible. Center and right-aligned should be used in moderation. Avoid fully justified text which can be hard for people with dyslexia to read because of the uneven spacing.
- Present content using an Easy Read format. In other words, combine text and images. This way, content is broken up and uses visuals to help understanding.
3. Use accessible headings and links
When writing for the web, headings, subheadings and links are an important part of the journey.
Headings and subheadings
Online readers tend to scan content until they find a section that’s relevant to them. Some may also use a screen reader to access content. For example, a blind user. Headings and subheadings help all users, including screen reader users, to scan a web page. For assistive technology to flow through content in the way you intend, accessibility requirements should be followed.
A web page is made up of HTML (Hypertext Markup Language). You may also have heard of the term ‘semantic markup’. This is a way of writing and structuring your HTML so that it reinforces the meaning of content. Your content must be marked up correctly, so that the hierarchy of your content can be understood. This applies to all text on a web page, including headings, paragraphs, emphasised text, lists
You should:
- Use heading tags, and use them in a logical order. For example <h1> would be used for your main page heading. <h2> might be an article heading, followed by a <h3> for a section heading. <h4> might follow for a sub-section heading, through to <h5> and <h6> for sections of sub-sections.
- Never skip a heading tag. For example, a <h2> should never be followed by a <h4>.
- Use paragraph tags to show the start and end of paragraphs of text. For example <p> to open, and </p> to close a paragraph. Screen reader users will receive a pause in between each paragraph when having content read out loud to them.
- Use tags to identify emphasised text. For example, <strong> for bold text, and <em> for italicised text.
- Define numbered and bullet lists using the correct tags. For example <ul> for underordered lists, <ol> for ordered lists, and <dl> for definition lists.
Accessible hyperlinks
As you plan out a customer journey, you’ll be directing readers through your funnel content. You’ll interlink between web pages, and have different conversion points along the way. In the same way that content should be marked up properly, hyperlinks should be too. There’s also good practice when it comes to writing link text.
To improve the accessibility of hyperlinks:
- Use the <a> tag with a Href attribute to define the link and identify its destination. Otherwise your link won’t go anywhere.
- Use link text that’s descriptive to where the link will take the user. Don’t simply use the webpage URL, or the words ‘click here’, or ‘visit this web page’. Write link text that tells the user where they’ll end up if the link text is viewed out of context. This will help all readers to navigate content easier, especially screen reader users.
- If you have to use the words ‘read more’, for example on your blog, make sure to use an aria-label.
- Make sure link text looks visually different to surrounding text. Use a combination of colour and style, like underline, to make link text stand out. Using a combination is important. It’s not enough to convey information using colour alone.
- Make sure all links can be reached using a keyboard alone. Test this yourself using your tab key, before you publish and promote a new web page.
All the tips we’ve given you above offer a better user experience for all your audience. It also makes it easier for search engines to understand what your web pages are about. And that’s beneficial for SEO. Improving accessibility can help improve your organic reach too.
Free guide: Accessible content for marketing, comms and IT professionals
A quick, practical guide to creating accessible content for websites.
Download for free and share with your teams. Help them to understand how to make information accessible.
4. Create accessible visuals
When it comes to accessibility, it’s important to remember visual accessibility. But, what is visual accessibility?
Visual accessibility is about making sure all users enjoy the same benefits from your beautiful designs. This includes someone that is colour-blind, or has visual impairments. Visual elements should be given alternative text so these users can enjoy them too. This is text that’s read out to screen reader users when they come across an image. Visual elements also help to improve understanding, so alternative text should also convey meaning.
Some tips to improve visual accessibility are:
- Add alternative text using the <alt> tag
- Use 125 characters or less. Otherwise, screen readers might not read out the full description.
- Make sure alt text clearly conveys the meaning of the image. If the image is hyperlinked, the alt text should describe the destination of the link.
- Make sure alt text doesn’t repeat what’s in the surrounding text. And that it doesn’t include the words ‘Image of’, of ‘picture of’
- Use a description for images of company logos and brand marks. Don’t simply say ‘company logo’.
- For complex visuals such as infographics or graphs, provide a full description on the web page. Or, link to a new page with a full description. Whichever you choose, use the alt text to tell screen reader users where to find the full description.
5. Create accessible video
To create accessible videos, think about universal design. That means creating videos with a wide range of people in mind. People with different abilities and disabilities, with different preferences, and in different situations. With this in mind, both visual elements and audio in videos should be accessible.
Visual accessibility
When it comes to visual accessibility, it’s important to think about viewers who have photosensitive epilepsy or are colour blind. As well as those with cognitive disabilities and visual impairments. Each interact with video content differently.
- Avoid flashing effects so that people with photosensitive epilepsy aren’t affected.
- Make sure content can be stopped, started and paused. This allows people to understand content at their own pace.
- Make sure there is good colour contrast between foreground and background elements.
- Provide an audio-based description of meaningful visual elements. This way, people with visual impairments can access video content.
Discover accessibility requirements in our checklist for designers.
Audio accessibility
Providing captions and a transcript can help people with hearing impairments to understand video content. It’s also a benefit for those who prefer to read rather than listen. And those with no means to listen to content.
Captions
Captions provide a text version of spoken words in video content. They’re intended for people with hearing impairments. They can be closed (with the option to toggle on) or open (always visible). Captions should cover all dialogue, music and sound effects in a video. They should appear on screen in time with audio and video content.
Text transcript
Transcripts provide a text representation for video and audio-only content. They’re useful for people with hearing and visual impairments. As well as those with cognitive disabilities. They’re usually made available on a web page beside the audio or video content.
Webinar: Creating accessible & inclusive digital content
From pdfs and graphics, to videos and social media, it's important that we open up every piece of digital content.
In this webinar, hear from the experts at AbilityNet, Content Design London and Texthelp. Gain practical advice to help you create content that’s available and accessible to everyone.
6. Create accessible PDFs
PDF documents have many benefits. They can be interactive, convenient, secure and compact. But, they aren’t always accessible to people with disabilities. Making content accessible in a PDF means taking time to set the document up with accessibility in mind.
Some actions include:
- Set the language for the document, so that screen readers can correctly read the document.
- Include a title, headings and subheadings.
- Provide a table of contents that uses bookmarks based on document headings. That way, users can easily navigate the document.
- Use tags to define all text, from headings and paragraphs to lists and table content. That way, screen reader users will be able to tell the difference between text types.
- Add alternative text to images.
- Use a logical reading order that makes sense to the user experience.
- Make sure the document isn’t locked. This prevents screen readers from accessing the content.
- Check your final document for accessibility using a screen reader.
At Texthelp, we use Adobe Indesign to create accessible PDFs. Using the latest versions of Adobe Indesign, it’s easier to carry out the actions we’ve mentioned. You can also:
- Define a style for each tag. Meaning you can attach a style to all Header 1 heading tag (<h1>) and paragraphs tags (<p>), for example.
- Set a desired reading order of your content, so that screen reader users will flow through the document in the order you intend.
- Export your final document with all tags in place. Meaning your document will remain accessible once it's exported.
We also use Adobe Acrobat. It allows you to do a broad accessibility check that will flag accessibility errors. You can also check the reading order and edit any tags that need updated.
If you’re an Adobe user, check out this Facebook Group on PDF accessibility.
If you don’t have Indesign, you can always use Microsoft Word. Their Accessibility Checker can help you find accessibility problems before you convert your document from MS Word into a PDF.
7. Create accessible social media content
With social media being a large part of our digital campaigns, a lot of the time that’s where a customer’s journey with us begins. Accessible social media plays a part in creating a good user experience for everyone. It also helps to create a positive brand image at the first impression.
Here’s 7 top tips to accessible social media content:
- Add alternative text to images. This function is available in platforms including Twitter, Facebook, LinkedIn and Instagram.
- Limit your use of emojis. If using an emoji, provide alternative text. This can be given within the post copy.
- Make sure videos you share on social media include captions or subtitles and a voiceover. If a video isn’t led by audio, make sure your message can also be understood by its visual content. If it doesn’t, add a description of what happens in the video within the post copy, as a comment, or as a follow up post.
- If you’re using GIFs, leave a good amount of time between each frame. It’ll give people with cognitive disabilities or literacy challenges more time to take in content.
- Capitalise the first letter of each word in a hashtag. That way, a screen reader will be able to tell each word apart. Otherwise, screen reader users will be read a string of letters.
- Limit links to one per post. And make sure it’s clear as to where the user will end up if they click through.
- Write your post content with accessible language in mind.
If you prefer to use a social media management tool, make sure it has accessibility features included. Not all allow you to add alternative text to images, for example. We recommend using Sprout Social or Hootsuite.
For more support, check out this Facebook group dedicated to Accessible Social.
8. Create accessible webinars
So far, we’ve talked about making content accessible in advance of it being used. But what about live content? How can you make your webinars and meetings more accessible?
3 tips to creating accessible webinars:
- Choose an accessible platform. Platforms like Zoom and Google Meet include accessibility features like live captioning and closed captions. They’re also fully accessible using a keyboard only, and support screen readers.
- Speak clearly and slowly. Make sure there’s a way for viewers to raise a question or concern. It’s also a good idea to offer notes ahead of time to allow viewers to follow along.
- Give your content in multiple formats, especially if you’re giving a presentation. Use a mix of text and visuals. Describe visuals that convey meaning.
In a recent webinar, our guest speaker gave a visual description of herself to kick off the session. This offered an inclusive welcome to all viewers. Check it out in the video snippet on the left.
Watch the full webinar: What makes content inclusive?
In this session, hear from Clare, our inclusive speaker featured in the snippet above. As Content Designer at Content Design London, Clare shares expert advice on creating inclusive content. Explore how readability, use of language, and inclusive design comes into play. Gain an overview of readability guidelines, and discover best practice around inclusive language and design.
9. Create accessible podcasts
Making content accessible on a podcast means taking into account many of the elements we’ve already covered. This includes using an accessible media player to host the episode. As well as providing a transcript.
At Texthelp, we use the transcription service on Rev.com.
With this service, a human transcribes the audio. This is better than relying on an audio transcription, which can often be inaccurate. There’s also the option to add timing to the transcript. This is a nice addition as it gives people the option to navigate to parts of your podcast as they read the script. It can help with understanding.
We also host our Texthelp Talks podcast on Buzzsprout. Buzzsprout allows us to add a transcript when we’re uploading a new episode. We also embed the episode onto our website, and include a full transcript on the web page.
Here’s an example: Podcast: 6 myths designers and marketers believe about web accessibility.
10. Use an accessible colour palette
Colour blindness affects around 1 in 12 men and 1 in 200 women in the world. Most people with colour blindness are unable to fully see red, green or blue light. The most common form of colour blindness is red/green colour blindness. The way this affects people means they can mix up any colour that has red or green it in. For example, people with this colour blindness could mix up blue and purple.
That’s why colour should never be used alone to convey meaning.
Your online visitors should be able to understand information if all the colours were removed. Not only that, choosing an accessible colour palette is important when designing any digital asset. The colours used should offer good colour contrast between background and foreground. WCAG* accessibility requirements call for a colour contrast ratio of 4.5:1 for text under 18pts. Or, 3:1 for text larger than 18pts. (*WCAG Level AA criteria).
Using a colour contrast checker such as WebAim’s contrast checker can help.
Tips to creating your own Accessibility Style Guide
We hope the information we’ve given you so far has helped shine a line on making content accessible. As you begin to take action in creating more accessible customer journey’s, it can be useful to create an accessibility style guide.
That way, you can bring your whole organisation with you. Feel free to use the above content to help you create your own accessibility style guide.
We’ve also included some extra tips and tricks below:
- Gain buy-in from Senior Leadership. If they’re on board, it’ll make it easier to implement an accessibility style guide. Share with them why creating accessible content is important, for everyone in the organisation.
- Start to open up the conversation about making content accessible. Speak to your Marketing team and let them know it’s something you’ll be focusing on.
- Collaborate with your Design team to establish guidelines on accessible language and accessible design. Together, you’ll create great guidance to set your teams up for success.
- Share your commitment across the wider organisation. Provide training using your new guidelines. Help everyone in your organisation to content that meets the needs of all people.
At Texthelp, we created a roadmap to improve digital accessibility and inclusion. Feel free to take inspiration from our commitments and promises.
Free accessibility checklists: WCAG checklist for Marketers and Designers
We’ve created checklists to help you kick start your efforts, and get the conversation going. They’ve been created with the accessibility requirements of WCAG in mind.
Further reading
Now you know how to make information accessible, it’s time to consider what else can impact an accessible user experience
Continue learning. Explore more areas of digital accessibility.