Is your website accessible — or does it just meet accessibility standards? How do you know?
At Lifeblue, we believe an accessible website is one that ensures the experiences and stories told are available to the widest audience possible.
More than 80% of the criteria to meet Web Content Accessibility Guidelines 2.0 require manual testing to properly evaluate a website. For instance, an image must have meaningful accompanying alternative text to be considered accessible, but the mere existence of alt-text isn’t enough. A person must be the judge of whether the alt-text provided is a good representation of the image it accompanies.
The most common disabilities website designers typically consider include visual, auditory, physical and cognitive — but that list leaves out other circumstances such as economic hardships, geographical landscapes, educational levels, races or ethnicities and ages.
Here are some suggestions to help you experience your website from the perspective of someone who would benefit from a site that is designed to be inclusive — so you can better understand their experience and design your site accordingly:
Navigate by using your keyboard only.
Use the tab key to move to each item and Shift + Tab keys to move to the previous item. Press Enter to click on links, or use the spacebar to open drop-downs, or use the arrow keys to navigate between radio buttons in a form. Make sure all pages, links, menus, forms and pop-ups are easily accessible and that you can easily tell where you are on the screen.
Navigate by using a screen reader.
See if your website accurately describes what’s on the page and if your alt-text is informative, comprehensive and not redundant. Make sure icons have a text alternative as well. You can download this free screen reader, or use Mac’s built-in VoiceOver.
Fill out your forms.
Is it clear which field is active as you tab through the form? Are you providing immediate feedback to the user if they fill out the form incorrectly, and how helpful is that feedback? Make sure the action button is descriptive. (“Submit” or “Go” isn’t very helpful; tell the user what’s about to happen when they click the button.) Small steps like this can go a long way to ensure your forms are usable by a wider audience.
Watch a video with volume off and captions on.
Make sure your videos have accurate and easily understandable captions. See if a video transcript can be available as well.
Use a vision impairment simulator.
Want to see if your website has confusing colors? You can download extensions like Funkify, Fresh Eyes or Reader View to experience different websites through the eyes of individuals with different visual conditions or types of colorblindness. This will help highlight areas in your site where using color alone to convey meaning can cause issues for users with certain visual impairments. Adding icons or text along with color can help provide context.
Zoom in.
Make sure this can be done without loss of the site’s content or its functionalities. If any elements overlap, duplicate or disappear, adjust accordingly.
Use high contrast mode.
This helps make content more accessible for individuals who are more sensitive to light or those who have low vision. See if you can easily interact with your site using this mode.
Turn off all images.
Does your site still make sense without any images by only using the alt-text? Make sure none of the titles or menu items disappear.
+++
By aiming higher than just the legal standards of accessibility and pursuing truly inclusive design, you are likely to create a better experience for all people, even those not facing accessibility challenges. This should be the goal for web designers and developers: using the internet to bring more of the world together.
At Lifeblue, we believe that the internet is for everyone, and we aim to build websites that achieve the highest standards of accessibility; we also approach each project through the lens of inclusive design, which shows we value empathy as much as we value functionality. Contact us for more information on building a more accessible, inclusive digital presence for your brand.
