Being inclusive in website design choices is critical for firms of all shapes and sizes. While it is easier to do while building a new site, it is also something you can accomplish over time as you update existing content.
Here are some of the elements we think about when designing a site using an “accessibility-first” approach. These are great places to start when thinking about your website design plan or to help you shape your next content update.
- Images: Alt tags: Adding alt tags to images and illustrations help people using screen readers or braille output devices. Alt tags should be used for all key images (i.e. not background textures) and be descriptive yet simple. Examples: “Diagram illustrating the 7 steps of our due diligence process” or “Woman presenting to people around a table.”
- Links: Link text should describe where the link is linking to. For example: “Download the PDF” is better than “click here.”
- Fonts: Font size and type is critical to accessibility. Make sure your site doesn’t use fonts that are too small and avoid using scripts or detailed fonts that are difficult to read.
- Headings: Use headings (H1-H6) to create an outline of the page. They help non-visual users understand how the page is organized (main topics vs, sub-topics) and make it easy for screen reader users to navigate.
- Videos: It’s considered best practice to include closed captioning on all videos and to make sure users can pause them if needed. The pause function is also important for animations. Providing video transcripts is also a great way to reach the broadest possible audience with your videos.
- Color: Foreground and background colors need adequate contrast/saturation to be legible. This is important with text color, particularly if it is going across an image.
- Forms: Use the HTML label element so screen reader users will know which labels or prompts are associated with which form fields.
- Icons & buttons: Icons with or without borders must be legible and have contrast. People can’t click a button they can’t see.
Website accessibility isn’t something that you set and forget about. There is always room for improvement and new technologies that can help. For example, there are widgets you can install on your website that can automate the accessibility for visitors (our favorite is accessiBe), giving you time to improve the code and functionality of your site.
If you are still unsure of where to start, run a free assessment tool on your current site. Then, put a plan in place to improve your score. Your creative services team or agency can help with the plan and implementation.