Currently accepting inquiries for Webflow Websites and SEO Projects for Q2.

Designing for Web Accessibility

November 12, 2021
Updated:
May 1, 2023

Designing for Web Accessibility

Red Shark Digital

When designing your new website there are a lot of functions and design elements to think about. While designing a beautiful website is great, it’s pointless if people can’t understand the content that is on the page. We should always be working to ensure that everyone can fully understand and interpret our content, that’s why designing for accessibility is so important. All it takes is a few extra updates to ensure that all of our users will easily be able to interpret our content.

Color Contrast

For people who have vision difficulties, it can be difficult to establish text from a background color if there is low contrast. Having a compliant contrast ratio can help eliminate this issue. In order to meet accessibility guidelines, your contrast ratio should be at least 4.5 to 1, If your text is 18 pt or 14 pt bold the minimum contrast ratio is 3 to 1. You can use a variety of tools to check to see if your contrast ratio is compliant such as the Contrast App or WebAIM’s Color Contrast Checker. You should also try to avoid using the only color as indicators for important information. Users with color difficulties may find it difficult to distinguish important parts of your content if they are a specific color. Try using texture, bold text, underlines, or italics to make the content pop on the screen.

Be Cautious When Using Forms

Forms are a great way to find out information about the user as well as connecting them to you. Using placeholder text as labels can be a big inconvenience for users who use a screen reader. Screen readers normally navigate through a form using the tab key. Screen readers often only use the label elements to read the form directions and placeholder text is usually skipped over. By eliminating this element you are missing out on the opportunity to connect with a user due to their disability. You should also ensure that your form fields have clearly defined boundaries. For users who have mobility impairments or cognitive disabilities, it can be difficult to use an adaptive pointing device, knowing exactly where they should be clicking could greatly improve their experience.

Write Useful Alternative Text

Users with vision difficulty often use the help of a screen reader to “hear” the web. The tool will convert text from the site into speech so the user can understand what is on the page without seeing it. Alternative text is what appears in case the image can not be displayed. The screen reader will read the alt text to the user, so having quality and useful alt text descriptions for images will allow for users to understand what is on the page and improve their experience.When designing a user experience we should always be thinking ahead to make sure all users are able to have a positive experience. Taking the extra step and putting forth the effort to increase the accessibility of your website will pay off in the long run. At Red Shark Digital, our tailored UX Strategy will help you define your intended audience and the best way to connect to them. Contact us today to get started building your user experience and connect to all types of users.

Related Articles