By: Nihar Khemani
As described by the United Nations Convention on the Rights of Persons with Disabilities (UN CRPD): “Access to information and communications technologies, including the Web, is a basic human right.”
Web consumption statistics show that as of 2021, there were approximately 36 million Canadians surfing the internet at any given time. That number is projected to grow to 99.1% in 2026. Canada has more than 96% of its population with internet access (not necessarily broadband) and therefore the imperative, and currently the political will, to make web accessibility a primary concern. We all know the web provides unprecedented access and engagement opportunities for all individuals alike. When it comes to websites, by adhering to accessibility guidelines, we can let the web perform its true function of removing barriers to communication and interaction that exist in the physical world. By complying with current accessibility standards, organizations and website developers enable access to a wider stratum of the population who are impaired. Doing so removes obstacles to make it easier to browse, understand, hear, and purchase. in short ‘engage’. Most of all, it enables meaningful participatory contribution to the online conversation in all ways as readers, influencers, customers, reviewers, and advocates.
While not a new concept, you may be surprised by how few businesses do enough about it. In this post, we will try to explain web accessibility standards in detail and cover the aspects that the standards define, the organizations they affect and how to implement changes to your organization’s website to make it accessible for everyone.
Through the growth of CMS websites & ecommerce services like Shopify, Wix, and even WordPress to an extent, there are many opportunities to automate or “solve” for many forms of web accessibility. Recall the original accessibility affordance, the HTML “alt” property in an image tag. Long before images were downloaded on your 56K modem, you could read the captions and descriptions.
Accessibility in 2021:
The Accessible Canada Act was passed in 2019 to help identify, remove, and prevent barriers to accessibility for persons with disabilities. Also known as the Act to Ensure a Barrier-Free Canada, it mandates compliance for digital content and tech for Parliament, the Government of Canada, and federally-regulated organizations in the private sector. This includes sectors such as the banking, telecommunications, and transportation industries.
When did it come into effect?
Web accessibility standards are addressed directly in the Standard on Web Accessibility created in 2011 to “Ensure the uniform application of a high level of web accessibility across Government of Canada websites and web applications”. While the act applies to all federal websites and related intellectual properties, each province in Canada has its own accessibility law act set up and in motion right now, including:
The Accessibility for Ontarians with Disabilities Act (AODA) was passed in 2005 and aims to create a barrier-free Ontario by the end of 2025.
The Accessibility for Manitobans Act.
The Nova Scotia Accessibility Act,
to name a few.
The guidelines put forth by the Standards on Web Accessibility are categorized into three levels of compliance in order to meet the needs of people with disabilities: A (the lowest conformance), AA (mid-range conformance) and AAA (the highest conformance).
Accessible Websites are essential for some and useful for everyone!
Before we dive deeper into the web accessibility norms and how to make websites accessible for one and all, it is important to know what issues & impairments web accessibility standards hope to mitigate for the purposes of usability, which are (but not limited to) the following:
Auditory
Cognitive
Neurological
Physical
Speech
Visual
Web accessibility also benefits people without long-term/permanent disabilities, such as:
Older people whose abilities change with age.
People who use smart TVs, smartwatches, mobile phones, or other devices with smaller/different screen sizes to access the web.
People with situational disabilities like those living in remote areas or areas with exceptionally bright sunlight.
People with temporary disabilities like a broken arm, broken glasses, etc.
People who have slow internet connections or limited/expensive bandwidth.
People using older technology/devices or unable to operate common interfaces like a keyboard.
To give web developers a new perspective on accessibility, a social media company sponsored hackathons and similar events and placed participant developers in the situation of having only older 2/3G cell phone speeds and connectivity issues. They were asked to assess usability in their apps on a variety of devices. Issues that they had never thought of suddenly became usability obstacles. This is a classic example of how known unknowns vs. unknown unknowns in the quality assurance testing approach and tactics come into play quickly.
Who is required to follow the Web Accessibility Standards?
Accessibility laws apply to publications, including educational material and website content, and some are specifically meant for digital media.
The AODA states all public and private sector organizations with 50+ employees must make sure that the website complies with accessibility standards.
4 main aspects which make a website (more) accessible:
Ease of operation: refers to navigation
Ease of perceiving: refers to the ability to see and read the website
Ease of understanding: refers to the content being simple and understandable for impaired users
Ease of integration: refers to a website / app / online service being robust in its functionality for all users
Web Accessibility best practices:
Typography:
Typography is one of the most important aspects of a website’s design, but when it comes to accessibility, its role becomes even more important. The following things should be kept in mind when designing an accessible website:
Use of consistent fonts and font sizes that are simple and large.
Use of text and not just graphics for contextual reference.
Avoidance of too many appearance variations like bold, italics, etc.
Establishing enough contrast between text and background.
Avoidance of text that blinks or moves.
Content Headlines:
By using carefully constructed headlines, website content can be easy to follow and navigate. Appropriate headline font sizes, their placement and usage go a long way in making web content accessible.
Colours, Imagery and Layout:
The importance of using an appropriate choice of colours when you have accessibility in mind cannot be stressed enough. Colour blindness is often the most common problem faced by visually impaired users, and therefore, it is important to design your website elements with this in mind. Since there are various forms of colour blindness, there is no fixed rule of thumb to address this on your website. However, by keeping the following as part of your site’s style guide, you can ensure to account for visual impairment through a proper website design process:
Keep in mind to use a proper contrast between the font and the background. This is important to make the text stand out vis-à-vis the graphic or the background, making it easier to identify and comprehend.
Make sure to use well-sized images with proper alt tags to describe their content.
When it comes to layout, make sure to use plenty of white space, bullets, consistent and legible font size, and proper headers to make it easy for any and every user to navigate through a website.
It is also important to ensure that content is responsive to any screen size without affecting functionality or creating usability issues on the layout of the page.
Video content:
If your website uses video content, it is important to pay attention to 5 things: captions, description, transcripts, file size, and feature-use.
Make sure that the captions are synced properly with what is being spoken in the video. Also, captions should be put in an auto-play feature with a button to turn them off if necessary. Construct the captions in a manner in which all-important cues, actions and words are accurate and to the point.
Consider not using the auto-play feature for your video content as people with impaired vision may not know how to stop it. For example, Chrome and other browsers automatically mute autoplay videos in most cases - which could add additional confusion.
Use descriptive audio to explain any actions that are not otherwise narrated so that people who are visually impaired enjoy the video content as much as all other users do.
File size & feature use: to ensure delivery of the video to users with low connection speeds, producing multiple resolution/file size videos and streaming in an accessible manner make a difference. Most platforms like YouTube and Vimeo allow for this almost automatically, but sites hosting their own video or using other platforms may need to dig deeper.
Keyboard accessibility:
It is important to remember that the keyboard continues to be the most commonly used way to input information. People with motor disabilities rely largely on a keyboard. Assistive technology also uses keyboards extensively. In addition, several users use modified keyboards or other devices which mimic a keyboard. Therefore, any information that is navigable only by using the mouse needs to be altered for better accessibility.
Accessible documents:
Documents present an important overlay in most websites. You can make your assets like text documents, spreadsheets, PDFs, and similar assets more accessible by making a note of the following accessibility best practices when it comes to documents:
Use proper headers to provide better content flow and make them concise and clear.
Use “alt” (alternate) text to identify images where possible.
Tag the document with language or other codes to make it easier for any screen user to access.
Use bullet points or numbered lists.
Use simple table structures.
Give all sheet tabs unique names
Delete blank sheets
Accessible forms:
No matter what line of business you are in, your website will likely contain one or many forms, such as a form to subscribe, buy/sell merchandise, create an account, etc. Forms can be one of the greatest points of friction for an impaired user. To make your website more accessible, be mindful to use large and distinguishable fields with appropriate labels wherever necessary, with clear and easy-to-find instructions, current form validation techniques, and functionality that is device and screen independent.
The good news is that accessibility standards are not very limiting, and in fact, create a more positive experience. Luckily, current implementations of HTML and CSS (the framework and style functionality of the web) are catered to address these very issues. Responsive CSS techniques allow websites to display properly (and if needed, differently) on a variety of screen shapes and sizes. It is easy to create accessible websites that are also aesthetically appealing. The more functionality a website or app requires, the more work might be needed to adhere to various guidelines. That too is being addressed via automation and iterating reusable code libraries.
Accessibility for one and all makes complete business sense. It almost always has. These requirements drive innovation and automation, enhance your brand and extend your market reach for minimal cost and maximum benefit. If the web was supposed to lift people up, we’ve never been closer to shining that light or lending a hand.
Want to know more about how to improve your website’s accessibility? Contact us at UpOnline for more information!