Writing for web accessibility: Five tips for getting started
Create accessible content for your website with five simple tweaks.
Create accessible content for your website with five simple tweaks.
The beauty of content creation is that anyone can do it, even AI.
In 2024, Semrush reported that 58% of marketers use AI tools to write blog posts. With an influx of content being created by AI comes an influx of inaccessible content, too.
When creating content online, there are a few tweaks content creators can make to be more inclusive, help assistive technology and grow organic interaction with your digital content.
How can I make my web content more accessible?
If improving the user experience (UX) and creating accessible content online is your goal, keep reading for our top five tips for creating inclusive digital content.
1. Add Alt text
Alternative text, alt text for short, describes the image displayed on a website.
If you have images on your website, you should add alt text to ensure anyone can interpret the images on your site.
Getting alt text right
Mastering alt text, and getting it right to meet web accessibility standards is easy once you understand the basics. For example, purely decorative images that are not easily described do not need alt text, as long as the alt attribute is present. Assistive technologies will skip past the image as long as the alt attribute is present.
Why should you add alternative text?
- Improve UX. Adding alt text improves the user experience for everyone.
- Help assistive technologies. Assistive technology uses alt text to describe what is on the page to visually impaired users.
- Provide context. Alt text adds context about the image if the internet connection is bad and the image does not load in web browsers.
- Avoid file names. Without alt text, assistive technology will read out the file name of the image, such as "IMG-390291.png."
- Improve organic SEO. Alt text also gives search engines context about what is on the page, improving your organic SEO.
Use Insytful to find missing alt text
With Insytful's accessibility scanning features, you can find all images on your website, intranet or microsite that are missing alternative text and update them to create an inclusive user experience.
2. Create descriptive hyperlinks
Hands up if you're guilty of ever writing "click here" for link text.
You're not alone. As harmless as writing "click here" to send someone to a link destination may seem, it is a serious accessibility no-no.
"Click here" is killing your website user experience and here's why.
What is discernible link text?
Why should you create descriptive hyperlinks?
- Improve navigation. For accessibility purposes, descriptive link text helps users navigate around a website.
- Better user experience. All users can understand the destination of the URL, regardless of how they interact with the content.
- Reduces barriers for impaired users. Links with no description, such as 'click here', are vague and can make navigation unclear.
Accessible hyperlinks checklist
Follow our checklist to create accessible hyperlinks:
- Create descriptive link text to tell users where they are going when they click the link.
- Avoid uninformative link text, for example, "click here", "read more" or "link to".
- Avoid URLs as the link text.
- Create unique link text, avoiding repetition and duplication.
- Links should display as a link.
Use Insytful to find links without a discernible name
Never miss a link without a discernible name again, rely on Insytful's accessibility audits to help your website meet WCAG criteria.
3. Swap 'e.g.' for 'for example'
When it comes to accessibility, even the words you use can make an impact.
Last year at Velocity, during a presentation from the Digital Accessibility Centre I learned that using "e.g." did not translate well with assistive technology.
Why is e.g. not accessible?
Writing 'e.g.' can sometimes be read aloud as 'egg' by screen reading software. Therefore for clarity and inclusiveness, you should instead use an alternative, whichever works best for you in the context.
Alternatives for "e.g." include:
- For example
- Such as
- Or 'like'
Find spelling mistakes with Insytful
Check the content quality of your website using Insytful's misspelling feature. Spelling mistakes and the number of occurrences are flagged to make updating easy.
4. Correct headings and styles
Formatting your content correctly also makes the difference between whether it is accessible or not. Heading structure organises the content on a web page and helps users distinguish between sections.
The benefits of heading structure include:
- Improved presentation of the content.
- Readers can skim-read, skipping past areas that aren't of interest to them.
- Headers provide context for search engines, improving your SEO ranking.
- Assistive technology uses headings for in-page navigation.
Accessible headings and subheadings
For screen readers, if the page code is correct, the correct use of headers and styles also improves the way users find information on lengthy web pages. According to WebAim, 67.5% of screen reader users prefer to find information on a web page via headings. Therefore using them correctly is important.
Why is correct heading structure important for accessibility?
Screen readers can navigate a page content based upon the heading structure and skip to content on the page.
When it comes to heading structure and styles, there are a few rules to remember:
- There should only be one H1 heading per page, this should be the page title.
- Headings range from H1 to H6 and after H1, the headings should follow in a sequential order for example, H1, H2, H3, H4, and so on.
- Do not skip heading levels for example, from H1 to H4.
- Don't misuse text formatting - check that you are using a header instead of bold text.
- Headings and styles should be used based on their function, not on how it looks.
- Use headings to convey meaning and add structure.
How can you check if your heading structure is correct?
Using an accessibility testing tool, such as Insytful, you can improve user experience by finding the pages on your website that do not have properly ordered headings.
5. Colour choices and contrast ratio
Choosing your brand colours and how they appear on your website is an important consideration for accessibility and usability. If background and foreground colour choices on your website do not have a sufficient contrast ratio, it can make it nearly impossible for users to interact with the content.
Why are colour choices and contrast ratio important for accessibility?
Many users find low-contrast text difficult or impossible to read. According to Deque University, nearly three times as many individuals have low vision as total blindness.
Accessible design benefits everyone
Whilst colour contrast primarily impacts users with permanent disabilities such as low vision or colour blindness, it also has an impact on users who have situational disabilities, for example using a device in bright and sunny conditions.
Designing for accessibility benefits everyone, with permanent or situational disabilities, to access digital content.
How can you check the colour contrast of your website?
Checking how accessible the colours on your website are is easier with an accessibility testing tool.
With Insytful it is easier for you to meet the Web Content Accessibility Guidelines (WCAG) AA compliance criteria.
Closing thoughts: Accessible content benefits everyone
You may be lucky enough not to rely upon assistive technology (AT) day to day, however accessible design will have benefitted you at some point in your lifetime without you knowing about it. Whether it is the use of voice commands so you are hands-free or subtitles to watch videos on your commute, accessible design benefits us all.
Small tweaks can make a big difference, and you can do your bit to be an accessibility ally by following our top content tips.
Get a free website health check
Using accessibility tools like Insytful can help spot areas for improvement, helping to create accessible content and improve accessibility for an accessible website.
Use Insytful to improve your web accessibility, and get the first 100 pages scanned for free.
Frequently asked questions
Who can use Insytful?
Anyone responsible for a website, from website owners to marketing teams, content editors to developers.
Where else can I find accessibility user guides and resources?
Other websites with useful web accessibility resources include:
What is Insytful?
Insytful is a four-in-one web accessibility tool, created to make your website better. It audits every page of your site, from web pages to documents, looking for ways to improve UX and digital presence by checking for accessibility, performance, content quality and SEO issues.
How much does Insytful cost?
You can get started with Insytful for free by scanning and auditing 100 web pages. For organisations with large websites, an intranet, or microsites, an accessible website can be achieved for as little as £60 per month. Compare our Free, Plus and Enterprise price plans to see which would work for you.