Last weekend, Bich – our head of design, tried to help her 60yo aunt from afar, to book a slot with the doctor. During the hour, dozens of OTPs were sent, but the elderly lady missed all of them because they quickly expired after a minute. That’s when our discussion broke out this Monday. Is it realistic to build an accessible website for everyone? Why? And how? After researching the whole week, we realize this is feasible, helpful for people, and beneficial to businesses as well. So we want to share this with you.
In this blog:
Why inclusive web
Vision issues
Hearing issues
Physical issues
Intellectual issues
Why inclusive web design matters:
- Ethics and morals:
- According to WHO, an estimated 1.3 billion people experience significant disability in 2023. This represents 16% of the world’s population, or 1 in 6 of us.
- In a study by WebAIM, 98.1% of homepages analyzed had at least one WCAG 2.0 failure, making the website inaccessible to individuals with disabilities.
- Business benefits:
- People with disabilities represent a significant market segment, with a combined disposable income of more than $8 trillion.
- A study by the UK Government found that 71% of people with disabilities will leave a website immediately if it is not accessible, and 82% will not return to the site.
- In a case study by Microsoft, the company estimated that the accessible design of their Xbox Adaptive Controller, which was designed specifically for gamers with disabilities, generated $4.6 million in incremental revenue in its first year.
- Legal compliance:
- In the US, the Americans with Disabilities Act (ADA) requires that places of public accommodation, including websites, be accessible to individuals with disabilities. In
- 2019, Guillermo Robles, a blind man, filed a lawsuit against Domino’s Pizza for not providing an accessible website and won the case.
If you’re also a digital designer like us, a start-up selling something online, or even an aged business enhancing your website, take a 10-minute glance at 12 tips below, and see what you could apply for customers with different disabilities.
Vision issues
Vision issues refer to any condition that affects an individual’s ability to see or perceive visual information such as partial or complete blindness, low vision, or color blindness. Consider these suggestions to cater to their needs:
- Make text readable: Use a font size of 16 points or larger, and avoid using script or cursive fonts. Avoid using text in image format as screen readers cannot read it. It’s also recommended to maintain a high-contrast level, at least 4.5:1 between text and background. _ Bich – Creative Tribe Leader
- Select the Captcha: Captcha typically involves presenting users with a visual challenge, like defining distorted text or images to prove that they are human. To prevent people with vision impairment from being a robot, provide another technique to verify users such as audio challenges or math challenges as well. _ Truc – UX/UI designer
- Use audio: It provides an alternative way to access the content. Besides creating audio content ourselves, why don’t we try to add the Text-to-Speech API that converts written text into spoken words? Some popular providers include Google Text-to-Speech, Amazon Polly, Microsoft Text-to-Speech,… _ Tien – Graphic designer
Hearing issues
Individuals who are deaf or hard of hearing face challenges accessing audio content on websites and applications. Therefore, here are some tips for designing for people with hearing impairments:
- Prevent jump scare: Some individuals with hearing impairments may have hearing aids or cochlear implants that amplify sound. Don’t scare them by auto-playing audio which can make them uncomfortable or even painful. _ Bich – Creative Tribe Leader
- Consider sign language: For individuals who use sign language as their primary means of communication, providing sign language videos can be helpful. These videos should be clear and easy to understand. _ Truc – UX/UI designer
- Avoid phone verification: Many websites and applications use verification by phone calls as a means of confirming the user’s identity. Instead, utilize text-based methods like SMS or email. _ Tien – Graphic designer
Physical issues
Anyone with physical issues may have obstacles accessing web content and applications due to mobility or dexterity issues. Therefore, here are some tips for designing for individuals with physical disabilities:
- Consider one-finger tasks: Minimize the need for simultaneous actions such as pressing two buttons at once, pinching to zoom or scrolling a long page. Instead, why don’t you utilize Drop-down menus, Anchor links or Navigation with Slide-out, Breadcrumbs and Tabbed? _ Bich – Creative Tribe Leader
- Allow customizable menus: Allow users to create a personalized menu of frequently used actions at convenient positions, which can be a Floating menu (appears on top of the screen and can be moved around by the user) or a Contextual menu (appears when a user performs a specific action). _ Truc – UX/UI designer
- Leave some space: To ensure that touch targets are easy to interact with, designers should use a minimum touch target size of 44 pixels by 44 pixels, keep a minimum margin and padding of 8 pixels. At least 30% white space (also known as negative space) is recommended also. _ Tien – Graphic designer
Intellectual issues
As many as 3 out of every 100 people have a cognitive disability. They may face challenges in understanding complex language, social cues or distractions by being hypersensitive or hyposensitive to certain sensory stimuli, such as loud noises, bright lights or fast movements. Therefore, here are some tips for designing for them:
- Get to the point: Avoid using jargon (technical terms, acronyms, slang,…), abstract concepts (metaphors, idioms, wordplay,…). Moreover, make the content short, break them up into smaller chunks, use bullet points and visual aids to convey information. _ Bich – Creative Tribe Leader
- Provide Chatbots: A study published in the Journal of Autism and Developmental Disorders noted that chatbots are effective for children with autism, as they offer a structured and predictable environment and can be customized to individual users. _ Truc – UX/UI designer
- Less is more: Minimize the use of animations, flashing elements, pop-ups, auto-play videos, sound effects and too many contrasting colors. Some better replacements could be banners, static images, diagrams, flat illustrations, inline messages, tooltips, etc. _ Tien – Graphic designer
Many companies have dedicated teams or departments that focus specifically on accessibility and inclusive design for people with disabilities like Microsoft, Google, Apple, Facebook,… Do you want to tap into a product with full accessibility for everyone?