Use Accessible Text Formatting
Use accessible text formatting
It’s important to make sure text on our site conveys information in a readable, easy-to-understand way. We need to follow web conventions where possible and avoid leaning too hard on visual formatting.
Ensure colors have good contrast
Low vision or colorblind users can have trouble reading text if the contrast isn’t high enough. When you’re using anything but black-and-white text and backgrounds, check the text’s contrast ratio to make sure it meets the WCAG standards.
It’s difficult to tell if color combinations will be readable for everyone, so WCAG gives us formulas to calculate contrast ratios between text and backgrounds. Any time you use a new color combination on your page, put the values through an online testing tool to make sure they meet requirements.
All you need are the hex codes for your background and text (foreground) colors. Then, use an automated tool like Color Contrast Accessibility Validator to make sure you’re meeting WCAG’s AA standard based on your text size.
Don’t rely solely on text colors or formatting
It’s okay to use formatting like bold, italics, and color on your page, but make sure it’s not the only way you’re drawing attention to important content. Screen readers don’t normally announce formatting, so use punctuation like *asterisks* to emphasize important info. If you don’t like using asterisks, restructure your content so that the most important information is presented to users first, and you shouldn’t even need to bold it.
Only underline text if it’s a link
Underlining non-link text can confuse people who have limited color vision, and it doesn’t really add any value or extra information to your text compared to other forms of emphasis. Screen reader users generally won't realize the text is underlined, either. It's best to draw users' attention by changing how information is ordered on the page.