Why should you make your website accessible?

 
Making your website accessible is an important part of your website design. There are several important reasons why you should make your website accessible. 

Inclusivity

By making your website accessible, you ensure that everyone, including people with disabilities, can access and use your website. This promotes inclusivity and demonstrates that you care about providing equal opportunities for all users.

Compliance

Many countries and regions have laws and regulations in place that require websites to be accessible. By making your website accessible, you can ensure that you are in compliance with these laws and avoid potential legal issues.

Improved SEO

Accessibility can also improve your website's search engine optimization (SEO) by making it easier for search engines to understand and index your content. This can help improve your website's visibility and attract more traffic.

Enhanced usability

Accessibility features such as clear navigation, text alternatives for images, and proper color contrast can enhance the usability of your website for all users, not just those with disabilities.

Overall, making your website accessible is an important step towards creating a more inclusive, user-friendly, and legally compliant online presence.

How can you make your website more accessible?

There are many ways that you can make your website more accessible. Accessibility on a website relies on both the design of the website and the content.

Using alt text 

Adding alt text to images on your website allows screen readers to interpret what the image is about, making it easier for visually impaired users to access your content. Click on an image in your editor and head to the Image tab in your editing panel. Click on Accessibility and SEO to add a title and description to the image.

Utilize headings

Headings provide structure and hierarchy to your page, making it easier to navigate and understand. Click on text on your page to add an H1, H2, H3 etc. tag to your text.

High color contrast

High contrast colors ensure that users with color blindness can still read the text on your website.  

Use clear and simple language

Avoid using overly complicated jargon and language, as this can make it harder for users to understand your content.

Include transcripts

Transcripts allows users to understand the audio content on your website, making it easier to access if they are deaf or hard of hearing.

Design for keyboard navigation

Ensuring that all interactive elements on the page can be accessed by keyboard is essential for those with physical disabilities. 

Test with assistive technologies

Testing a website with assistive technologies such as a screen reader is a great way to make sure that the website is accessible to users. 

Use descriptive link text 

Descriptive link text makes it easier for people to understand where a link will take them when they click on it. This also helps people who use screen readers as they are able to better understand the context of the link. 

Follow accessibility standards

The World Wide Web Consortium (W3C) accessibility standards that should be followed when designing and developing a website. These standards help ensure that your website is accessible to everyone regardless of their disability.

Use ARIA tags

ARIA (Accessible Rich Internet Applications) tags are HTML attributes used to make web content and applications more accessible. ARIA tags provide additional information about the structure and purpose of an element on a website, such as a button or link, to assistive technologies. Learn more about adding data attributes to elements on your website.
 
Some common ARIA tags include:

• aria-label, aria-labelledby gives an accessible name to an element on your page
• aria-describedby gives an accessible description of an element on the page

ARIA roles provide semantic meaning to content which allows assistive technologies to present an interaction with an object on a website in a way that the user can expect every time. Some common aria roles include:

• 'banner' for page headers
• 'navigation' for menus 
• 'main' for the main content area of the page 
• 'complementary' for the content related to, but separate from, the main content
• 'search' to indicate a search box 
• 'form' to indicate a form 
• 'alert' to indicate an error message 
• 'button' to indicate a button

You can include ARIA tags on your website by clicking an element on your page, going to the Advanced tab in your editing menu, and adding the ARIA tag as a data attribute.

We pre-fills all ARIA tags mentioned in this article on your website so you don't have to.