Article
Seven Factors That Make Websites Accessible to the Visually Impaired
Accessibility Features and considerations for designing websites that can be used by people with blindness and low vision.
I spend a lot of time on the internet browsing dozens of different websites every day. I read blogs, informative websites, government websites, websites for school, social media, and so much more. Because I have low vision, not every website is easy for me to access, because many website designers consider accessibility an afterthought. With a growing number of seniors and people having issues reading standard print, I’m surprised more websites haven’t embraced designing accessible websites. Today, I will be sharing seven factors that make websites accessible to the visually impaired.
Ability to enlarge text
By default, many websites use small font for body text, which can be difficult to read. To enlarge the page, it’s standard practice to use the ctrl-+ shortcut on the keyboard or pinch to zoom in on touch screen devices. However, there are some websites that don’t scale text or prevent users from zooming in on the page. While there are workarounds for this such as external magnification in accessibility settings, it’s best to make sure that text can be enlarged when designing a website. Read more about Windows 10 accessibility settings here and iPad accessibility settings here.
Images with alt text
With the exception of decorative or blank images, every image on a website should have alt text. This tells the computer what’s in a picture so this information can be read by a screen reader or other assistive technology. Another bonus to adding alt text is that it can also help with improving search engine optimization. Read more about how and why to use alt text here.
High contrast display
I have encountered many websites that were designed with the pastel trend in mind. All of the colors are light shades, and the text is a gray color. This is very hard to focus on and provides poor contrast, since the white background and gray text could become difficult to distinguish. Instead, choose high contrast background and text colors that can be read easily. Black text on a white background is a safe choice, but if you want to use color, make sure it can still be read. Read more about high contrast text in my post about PowerPoint accessibility here.
Clear sans serif font
Yes, the cursive font looks cool, but don’t make it the body text for a website as the letters may be difficult to distinguish. Take a cue from major tech companies and choose a simple to read sans serif font. My favorite font is Arial, because every letter is easy to distinguish and it looks professional. Speaking of text, read more about designing accessible documents in Microsoft Word here.
Compatible with screen readers
One time, I was using a screen reader to navigate a website that definitely was not optimized for screen readers, and it took over five minutes for the screen reader to get through all of the menus and side information before getting to the content. By using proper headings, the screen reader can figure out where the main content is and give the user appropriate information. Use h1 headings for the post title, h2 headings for subheadings, and h3 headings inside of h2 headings.
High resolution images
If I am looking at a picture, I like to zoom in and look at different details. This doesn’t work if the image is low resolution or a small size- my friends and I jokingly refer to these small images as “pictures for ants.” Allow users to be able to view full size, high-resolution images either within the webpage directly or by clicking on the image and opening in a new tab. Read more about high resolution images here.
No popups
If a website gives me a popup to sign up for an email list or other random information, nine times out of ten I will leave the website because I can’t see well enough to close the popup window, or I can’t navigate the website unless I give them my email. The same goes for random social media popups. If your audience uses assistive technology, consider avoiding popups and instead have a different way of getting people to sign up for your website. And for users that want to disable web services that cause these popups, consider adding the free Chrome extension Ghostery, which will block many trackers and advertisers on websites. Download Ghostery here.
With these tips, users with vision impairments will not be excluded from accessing a website, and designers can take steps to help make the internet a more accessible place for all.
By Veroniiiica
