Line Nymand Juliussen  |  17/09/2019

On the Forefront of Accessible Web Design

Did you know that as much as 15% of the world’s population has a disability? While this large group is generally not taken into account when building a website, the Mono Platform offers accessibility features that allow small businesses to support people of all abilities and disabilities in just a few clicks.

Websites designed for everyone

To be accessible means to give the same access to all people, including those with visual, hearing and physical impairments, cognitively challenged people, elderly people and other groups (SiteImprove). Many times, companies miss the opportunity to reach this population, but ensuring they are included can bring a great deal of benefits to your SMB clients, such as a positive reputation, increased website traffic and the acquisition of new customers. In fact, studies show that users who have disabilities are more likely to purchase from a website that incorporates their needs into the website’s design (UX Design). 

Another aspect to consider is that there could also be legal implications that could affect your SMB clients. In some countries and jurisdictions, companies with an online presence have a legal obligation to provide equal access to people with disabilities.

Accessible features on the Mono Platform

To help SMBs make their website easily accessible for everyone, the Mono Platform offers three simple features based on the Web Content Accessibility Guidelines (WCAG 2.0), that outline best practices for making websites accessible for everyone.

  • Aria tags are individual labels, such as subtitles, icons, image Alt texts, menus, submenus, and more that can be read out loud to help people with visual impairments understand the content of the website.
  • Visual indications show which element on the site that is currently active to help the visitor easily see where they are on the website. For example, a box can appear over highlighted text as users scroll through websites with their keyboard.
  • Skip to content allows users to bypass the screen reading navigation. This feature is for users who do not want the navigation to be repeated every time the user opens a new page on the website.

Tips from an experienced website designer

Beyond the use of accessibility features, we asked Mike Birkey -Senior Designer at Mono, for a few tips on how to reach the highest level of accessibility score on your website by also thinking in visual design features: 

“Enabling Mono’s accessibility features takes away much of the hard work of making your website accessible for everyone, however there are still visual cues you may need to consider to reach the highest score. Consider for example, do your links and buttons have accessible names? And do elements on your website have sufficient color contrast? Once you are able to identify these items on your website, you are able to easily adjust the styling and colors using Mono’s Global Design system so that they update on every page of your website. This ensures consistent design that importantly also meets the standards of accessible web design”. 

With Mike’s extensive background in website design, we also asked him to put together some best practice website examples as inspiration based on WCAG 2.0 website design principles. The following three website examples were optimized with Mono’s accessibility features:

For each example above, Mike did the following optimizations:

  • Enable all accessibility settings
  • Enable lazy loading of images
  • Run a test with Google’s Lighthouse tool
  • Change any link or color issues the report displays
  • Run the test again for a great result!

Curious to see how the site examples perform? You can check their performance in Google Chrome’s Lighthouse tool or even check how accessible your own website is. 

To learn more on how you can create a more accessible website on the Mono Platform, visit our article on Mono Academy (Note: This requires partner login).