If you aren’t factoring accessibility into your blog design and writing, you’re making a big mistake.
Vision impairments and other disabilities can affect a reader’s ability to enjoy your content. It’s your responsibility to make your blog as accessible as possible to the largest possible audience. Following accessibility best practices ensures even readers without a disability can easily read and understand your content.
In short, ensuring all readers can access your content is pivotal to your blog’s success.
But what goes into making a blog more accessible? The Web Content Accessibility Guidelines (WCAG) recommend focusing on four key pillars of accessibility, making sure your content is:
- Perceivable: Users should be able to identify content or elements on a page via their senses – which could be visually or by sound or touch. Messy navigation, missing alt text for images, and a lack of contrasting colors can create problems in this area.
- Operable: Users should be able to use buttons, controls, and navigation with tools like voice recognition and screen readers. All actions should be available via the keyboard and you should allow users enough time to read and use content (no auto-advancing slideshows or auto-playing videos, for example).
- Understandable: Site visitors need to be able to understand your content and navigate your site. If you’re heavy-handed with jargon or acronyms, this can hinder users’ ability to understand your posts.
- Robust: Content should be accessible with a variety of technologies available to readers, including different browsers, screen readers, magnification software, etc.
While accessibility details can be overlooked and lead to negative results for your site, the good news is there are some quick and relatively simple ways to get your site in line with best practices.
Tips for Improving Accessibility on Your Site
Here are some ways to boost the accessibility of your blog to ensure everyone can enjoy your content.
1. Make Images Accessible
Including images in your posts is a great way to break up the text, provide additional context, and present data in a unique format. But not everyone will be able to see the images on your page. That’s where alternative text (or “alt text”) comes in.
Alt text is a written description of an image. Screen readers will read this description for your site’s visually impaired and blind visitors to help them understand what’s in the photo. Overlooking it for your images is a major no-no when it comes to accessibility — and it has negative effects on your SEO.
Try to keep the alt text brief but detailed — describe what is included in the image. If an image includes text, include that in your alt text. For example, alt text for the photo below could read “Small dog wearing banana-print pajamas, sitting in front of a yellow backdrop.”
It’s also a good idea to avoid busy wallpapers or flashing images that could potentially trigger seizures or migraines.
2. Be Thoughtful About Videos
Don’t set videos to play automatically. When they start automatically, the audio from the video could play at the same time as a screen reader, making it difficult for visitors to understand the content.
Also, make sure to include captions or a transcript with any video embedded on the page.
3. Make Links Obvious
Anchor text (the text used for hyperlinks) should be descriptive and give readers a clear idea of where the link will take them. Steer clear of language like “click here” that is vague and unhelpful for those using a screen reader. Clear wording like “sign up for the newsletter” or “read the recipe” is more accessible.
4. Don't Forget About the Font
Color blindness, cataracts, and declining vision can all influence how well a person can see content on the page. Take visual impairments into consideration and make sure the text on the page is large enough to easily read (at least 16pt) and has a high contrast with the background color. Use a color contrast checker to determine if you need to make adjustments. Aim for a 4.5:1 ratio.
It’s also a good idea to avoid all-caps as much as possible since it can be hard to read – not to mention that it feels like you’re shouting at the reader.
5. Design an Easy-to-Navigate Page Structure
Make the page easy to scan and digest by writing shorter sentences and paragraphs and including section headers and quotes.
When it comes to headers, there should only be one H1 tag on the page and they should descend in order from there (H2, H3, etc.). These help a reader determine the page structure and easily find the information they need as they use keyboard shortcuts to navigate the page.
And don’t forget about white space — it’s your friend. Space elements out and optimize line heights, margins, etc. to keep the page from being too cluttered.
6. Write Clear Content
Avoid jargon as much as possible to ensure your content is understandable by the largest possible audience. If you have to include abbreviations or acronyms, explain them — screen readers can easily mispronounce these.
Test Your Site’s Accessibility
Once you’ve implemented some of these changes to make your blog more accessible, it’s important to perform tests to ensure you’ve caught all the issues (without introducing others). Here are a few ways to determine your site’s level of accessibility.
- Use a tool like https://wave.webaim.org/ (it will work as long as your site is public). Simply plug in your site URL and get a helpful analysis of your blog’s accessibility issues. We used it for the Beyond Bylines site and were able to identify and begin working to fix several accessibility issues.
- View it on a mobile device and different browsers to spot significant differences. The blog should be easy to navigate and view on all browsers and devices.
By making improvements to your blog's accessibility, you're ensuring the largest possible audience can engage with your content and be a part of the community. Don't overlook these critical elements of your site design.