7 Ways to Make Your Website More Blind-Accessible
Did you know—not ONE of the 2020 presidential candidates has a website that is accessible to the blind?? 👀
Legit, look it up. Vox just ran an article about the IMPORTANCE of accessible websites and honestly? I feel called out.
Here I am, someone who’s worked firsthand with members of the blind community, and not ONCE have I thought of them when designing websites. 🤦🏼♀️
I’ve seen firsthand how AMAZING it is when simple accommodations are made for the blind. I’ve seen them scream with joy on a zip line, giggle uncontrollably while riding horses, and navigate complicated trails with a bit of guidance. I’ve seen their faces light up when they realize there is space for them in something that previously felt out-of-reach.
But if I’m not making sure my WEBSITES are accessible, I’m sending one message loud and clear: I don’t think people with disabilities should be able to access my websites.
And THAT is a punch to the gut.
So I did some digging and GUESS WHAT: Designing a user-friendly website for the blind is INCREDIBLY EASY.
1. START WITH THE IMPORTANT INFORMATION
When people with visual impairments are navigating websites, it can take forever to find the information they were promised when they click on new pages. While people with better sight might easily be able to scan through the page to find the information faster, hiding information further down on a page (intentionally or accidentally) can become a huge barrier to accessibility.
Much like a newspaper article, the pages on your website should begin with the most important information right at the start, and get more detailed as they go on.
2. KEEP YOUR TEXT LARGE AND READABLE
Ideally, the smallest your text should be is 18px, or 14px if the text is bold. Many people with varying degrees of visual impairments will still be able to identify letters on a screen, but only if they are in a large enough font.
On that note, make sure your font is easy to read. I am all for beautiful script fonts on websites, but not at the expense of losing viewers or hiding important information in difficult-to-read text. If you do use a script font, use it sparingly.
3. THE STRONGER THE CONTRAST, THE BETTER
Poor contrast can lead to a confusing experience when trying to navigate a web page. Make sure your text always has good contrast against its background, and all navigation titles are easily discernible from the colors around them. I’d recommend adding a simple background to a text block if you’re worried about the way it looks against a photo… and always, always check your mobile view for good contrast as well. That’s an area that’s easily overlooked; just because your desktop view looks good doesn’t mean your mobile view is totally free of problem areas.
4. BE CAREFUL WITH BUTTON COLORS
Especially for people with colorblindness, buttons need to be clearly labeled so readers aren’t reliant on colors to determine whether something is positive (“Submit”) or negative (“Cancel.”) Additionally, two buttons side-by-side can send mixed messages to readers if they can’t determine the colors of those buttons. It would be easier to navigate if one option (like “Cancel”) was a simple underlined link if it’s next to a button that reads “Submit.”
5. LABEL YOUR IMAGES
Alt-text is incredibly important when it comes to SEO, but it’s even more important for website visitors with visual impairments. Phone and computer accessibility programs can read the alt-text descriptions aloud to these readers, giving them a better idea of the images and the role they play on the page. Make sure all of your images are labeled clearly and helpfully.
6. MAKE LINKS OBVIOUS
Make sure every link on your page is clearly marked, and easy to click through. Instead of a small arrow for a link, try to make them a few words, a button, or a full image when possible. If a reader with a visual impairment is navigating your site, they will only be able to click on through links that are very clear about where they are, what they are, and have plenty of clickable area.
7. WHEN POSSIBLE, ENABLE RESIZABLE TEXT
Many blind and visually impaired people will enlarge the text or entire web page when surfing the internet. Make sure your website is set up to accommodate that adjustment, so you aren’t losing any letters, words, or links as the page is enlarged.
I HOPE THESE TIPS ARE HELPFUL FOR YOU AS YOU MAKE YOUR WEBSITE MORE ACCESSIBLE!
Rooting For You Studio is run by Samantha Weiler, a Midwest-based website designer with a huge passion for plants, peppermint tea, and launching websites for business owners who want the freedom to work from anywhere. Sam loves exploring National Parks and watching reruns of Parks & Rec, but she spends most of her time building websites for adventure photographers and outdoor entrepreneurs.