We recently celebrated Global Accessibility Day at Primacy on May 20th because we feel it’s important to create experiences that everyone has access to.
This article breaks down those 5 tips we shared on Instagram in a little more detail.
Colors are important to any design; they add visual interest, create hierarchy and make products more usable. But for people with visual impairments, if there is not appropriate contrast between text and background colors, the usefulness of your color palette is lost.
When it comes to color, it’s not only about contrast. You also need to think about how you’re using it. Are you relying on color alone to create meaning? Don’t! People with color blindness might not be able to distinguish between colors. Always make sure you use color along with another indicator—such as an icon, pattern or words.
16px is the minimum size recommended for body text. For reference, that’s around the same visual size as text you would find in a magazine or book.
Anything smaller than 16px can affect the readability of your content. And if people can’t read your content, your message is not getting through to them. From ensuring your messaging reaches more people to allowing for greater accessibility, larger font sizes benefit everyone.
Provide short text alternatives (often referred to as “alt text”) for audiences with low or no vision that use screen readers.
You want to make sure that the alt text clearly describes what the image is trying to convey. Screen readers will read the alt text out loud, allowing people with visual impairments to experience and understand imagery.
Use nested headings to structure and establish content hierarchy on a page. There should only be one H1 heading on the page. Often used to describe the content on the rest of the page, your H1 should include the most important content. After the H1, your next heading should be an H2, followed by H3, etc.
You should never use headings to style your page. If content jumps from an H1 to an H3, it can create confusion—especially for audiences using assistive technology.
Do not use all caps when entering content into the CMS. Assistive technology reads capitalized text out loud letter-by-letter. Capitalization can be specified in design using CSS to stylize text but should not be done using your keyboard.
So next time you want to emphasize something, make sure you have it styled for all caps so that a screen reader doesn’t read back “E-M-P-H-A-S-I-Z-E.”
These are just a few ways to improve the accessibility of your content, but this isn’t an exhaustive list. To create a more inclusive world that creates content that everyone could enjoy—regardless of ability—we should always stay up to date on the latest accessibility best practices.
Looking for more ways you can improve your content and web accessibility? Check out some of the resources below:
You can also connect with our accessibility team to discuss ways you can make your content more inclusive (or just to say hello!)
The original version of this page was published at: https://www.theprimacy.com/blog/5-tips-web-accessibility
