I spend a lot of time on the internet browsing dozens of different websites every day and have learned that there are things to do to make your website accessible. 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.
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.
- Writing Alt Text and Image Descriptions for the Visually Impaired
- How To Write Alt Text and Image Descriptions For Instagram
- Writing Alt Text For Digital Comics
- How To Write Alt Text For Memes
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.
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.
- My Eight Favorite Free Fonts For Print Disabilities
- Designing Accessible Documents With Microsoft Word
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.
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.
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.