How to Verify if Your Blog is Accessible


Writing inclusive articles for all your readers

Some would debate that blogging died out many years ago. But take a look around at all the businesses you interact with. I would venture to say that more than 80% of them still run a blog, whether they call it that or something else. Writing regular content about your products and services is still a huge part of growing your business and customer base.

A blog post can be the basis for all your other content, be it social media posts, podcasts, YouTube videos, and e-mail marketing (yes that is still a thing too😃).

So, to build a blog post that all potential clients can access and interact with is key to its success. That is why I am going to break down for you how to verify if your blog posts are accessible and help you write inclusive articles for all your readers.

*Disclaimer: This blog post is directed towards people using website builders (drag-and-drop or no code editors) for their blog. I am not going to get into the weeds about semantic HTML or CSS. This article is geared towards the average blogger wanting to learn how to create more accessible content. You will need to understand some basic terms like H1, H2, etc. but I am going to keep this very simple so you can start your journey towards writing accessible blog posts.

What is covered in this post….

Why Does Accessibility Matter & How Will It Benefit Your Business?

The Most Important Elements to Address

Structure & Formatting

Readability

Color Themes

Links

Guaranteeing Your Blog Images Are Accessible

Verifying Your Multimedia’s Accessibility

The Legal Side of Blog Accessibility

Tools to Help with Digital Accessibility

Community & Education

A woman working on a blog post with the words "Accessible blog posts grow your audience.  Stay ahead of your competition by learning about digital accessibility" overlaying the image .

Why Does Accessibility Matter & How Will It Benefit Your Business?

Why Digital Accessibility Matters

Chances are when you decided to start a business you had to do some market research to figure out who your ideal customers were going to be. All that great data you collected like their interests, where they hang out, salary base, family demographics, where they live, problems they need solved – within all of that there is a hidden entity you are likely NEVER to know – whether they have a disability or not.

One in five people have a permanent or temporary disability. This is an extremely tight ratio, so there is no escaping the fact that many of your customers do indeed have a disability.

Many disabilities are considered ‘hidden disabilities.’  What does that mean? Well, it means you can’t necessarily tell that someone has a certain disability just by looking at them. When we are talking about marketing an online business with a blog, every disability is hidden because you are not physically seeing them.

So, to answer the question why does digital accessibility matter is simple, your customers need it to be. If your website, blog, and other digital content are not built to be accessible, your customers can’t interact and buy from you.

It is also your ethical responsibility. The disabled population is a protected class by the Americans with Disabilities Act (ADA), and it is seen as discrimination to operate a business without putting consideration into how all your potential clients are able to access your products and services.

 

How Creating an Accessible Blog Will Benefit Your Business

The exciting news is that when your blog and other digital content is built with accessibility in mind, it will grow your audience and profits without needing to develop a whole new marketing plan.

Some of the top benefits include….

  • Enhanced User Experience

    When you implement accessibility into your blog posts it will improve the user experience for everyone, despite their abilities. Better navigation and a consistent layout and design will offer a more positive and inclusive interaction with your business.

  • Better Search Engine Rankings

    Your accessible blog will be easier for search engine bots to crawl and index.  Using proper heading structure, lists, descriptive links, and alt text give search engines more context about your blog and helps them understand it better, improving your chances of ranking higher.

  • More Organic Traffic

    Accessible websites tend to rank higher in search engine result pages (SERPs), leading to increased visibility and more organic traffic. This is because search engines prioritize user experience, and accessibility is a key component of that.

  • Lower Bounce Rate

    Accessible blogs tend to have longer dwell time. If people can access all of your content and interact with it as expected they are likely to stay on your site longer and become loyal followers. This can also improve your search ranking because search engines view longer dwell time as valuable content to share with more people.

  • Positive Engagement

    Readers who benefit from a great user experience with an accessible blog are more likely to engage and share positive feedback about your content. Your blog will continue to grow with increased sharing on social media, more page views, longer session durations, and higher interaction rates.

As you can see, an accessible blog can have an amazing impact on your blog’s growth and thus your business.

So, let’s take some time to talk about the first things to address when creating your accessible blog and digital content.

The Most Important Elements to Address in Your Blog for Accessibility

We are going to focus on the top 6 elements to writing accessible blog posts:

  1. Structure & Formatting

  2. Readability

  3. Color Themes

  4. Links

  5. Images

  6. Multimedia

Structuring and Formatting Your Blog

Proper structure

The basic outline of your blog post is crucial to establishing its accessibility. Starting with logical hierarchy will help all readers, including those using screen readers, understand the flow of your article.

Each blog post should have ONLY 1 heading 1 (H1), followed by heading 2s (H2) for each section title/subheading. Using heading 3 (H3), heading 4 (H4), etc. is good for further breaking down sections of a post, but are not always necessary.

People using various assistive technology to access your posts often search an article by headings.  Ensure your headings and subheadings are clear and concise. They should clearly describe the content that follows it. This makes it easier for all readers to quickly access the information they are looking for.

Once your headings are established you can focus on the formatting of the rest of your post.

Proper Formatting

Keep your paragraphs short and to the point. People digest information better in small spurts. And be sure to use plenty of white space throughout your post. Cluttered pages can be overwhelming to anyone, but especially those with cognitive challenges.

We all love a good list! Using a bulleted or numbered list can draw emphasis to key points or instructions. Lists are easy to absorb and can bring organization to your post. However, if you are simply using your keyboard to add your numbers or bullet points you are creating havoc for screen readers. Lists, whether numbered or bulleted, must be created using your platforms list element in order for it to be formatted correctly and be compatible with assistive technology. The screenshot below shows what the list element looks like in most editors.

 
Tool bar from a Word document with the list tools circled in red

The Readability of Your Blog

Before we even talk about the actual words in your blog posts, let’s get clear on how it visually looks.

Font Style

ALWAYS choose a readable font. It is fun to play with bubbly bold letters or dainty script fonts, but those should be used sparingly, and never for your body text. Choose a nice sans-serif font like Verdana or Arial for your content. These might seem plain and boring, but body text is no place to get creative with fonts – leave that for your infographics.

Text Size

Graphic of proper heading structure showing heading 1-4 and paragraph text with descending font sizes and high contrast

The size of your font is also important to consider. The new minimum for body text is 16pt but GO BIGGER if you can. Your headings should ‘waterfall,’ with the H1 (heading 1) being the largest on the page, slightly decreasing down a few pt for each following heading (H2, H3, H4).

Line Height

You also need to be aware of line height, or ‘leading.’  Setting your line height to a minimum of 1.5 the size of your base text will ensure plenty of space throughout your content to make it easy to read.

Now that we have made the text visually readable, let’s get onto the words you choose.

Clear and Simple Language

When you are writing your blog, forget technical, jargony language. The average person prefers a reading level of seventh to ninth grade. You want to make sure it simple and straight forward for everyone to be able to consume. There are of course certain industries where this can’t or should not be avoided, like the medical field. But at the same time, consider your audience. If you do happen to be a doctor but you are targeting your patients rather than your colleagues, keep it simple. Not everyone is going to know your industry’s acronyms or icons, so be sure to explain them when appropriate.

Choosing Accessible Color Themes for Your Blog

Example of good and bad color contrast - bad contrast has white text on a light yellow background with a thumbs down emoji and the good contrast shows black text on a white background with a thumbs up emoji

Adequate color contrast is crucial for readability, especially for users with visual impairments, such as color blindness or low vision. It ensures that text stands out against the background, making it easier to read.

Most blog posts are either in traditional light or dark mode, meaning black text on a white background or white text on a black background. This is perfect and the best contrast for accessibility.

However, if you tend to get super creative with your posts and use other colors, just be sure there is high contrast, so it is easy to read. Some creators really like to do white text on a baby blue background, or something similar, and though it might give you the warm fuzzies inside, DON’T DO IT! I am getting an eye strain headache just thinking about it.🤯

*Contrast Guidelines

Normal Text: A contrast ratio of at least 4.5:1 for Normal text (up to 18pt or 14pt bold).

Large Text: A contrast ratio of at least 3:1 for large text (18pt and larger, or 14pt bold and larger).

Non-Text Content: For graphical objects and user interface components, a contrast ratio of at least 3:1 is recommended.

Building Accessible Links Within Your Blog

There are four main things to consider when adding links to your blog.

  1. Link Styling

  2. Link Description

  3. Internal vs External Links

  4. Avoid Redundant Links

Style your links for accessibility

This one is a pet peeve of mine.😒

Historically, and in most cases automatically, links are styled by being underlined. This simple styling makes it clear to readers that they will be taken to new content if they click on it. This also means you should not go crazy underlining other content in your blog, which can confuse readers.

However, it is becoming more common for people to remove that underline for aesthetic purposes. If you do that, and I don’t recommend it, except maybe in your website header and footer, you need to be sure you style your links clearly with color.

Let’s define clearly.

Setting your links to default to your lightest brand color is likely not the best option. You need to verify the color contrast is sufficient enough for those with vision impairments to see and read your links. You can use the color contrast tools referenced later in this article to verify your link color has enough contrast compared to its background color.

Write descriptive links

When a reader comes across a link in your blog they should clearly understand where they will be taken if they click on it. If the other content around the link were to disappear, they would still know where that link was leading to.

This means no links that simply say, “click here” or “read more.”  Instead try something like, “Read the assembly guide” or “Download the template here.”  Descriptive links like these define the purpose of the link and its destination.

People using screen readers can often search a website or blog with a list of the links on the page. Ensuring the context of the link makes sense on its own will provide better navigation.

 
infographic showing examples of good and bad descriptive links as discussed in this blog post

Be careful with internal links vs external links

Interna links, or links in your blog that lead to other content on your website, can be your secret weapon. If you can incorporate links in your blog posts that lead readers to another related post, product, or service you offer, that will boost your sites engagement. It is important to reiterate that the links must be relevant to what someone is already reading. You NEVER want to mislead anyone about where they are going when clicking on a link.

What is the accessibility feature to consider with internal and external links?

Internal links SHOULD NEVER OPEN IN A NEW TAB.  For anyone using a screen reader or with cognitive or mobility challenges you are creating a navigation nightmare. Oh, and not to mention you would destroy your bounce rate, that we previously talked about improving with accessibility. If a new tab opened every time someone clicked on an ‘internal’ link on your site it looks like they left (bounced) and a new session was started on a new page. This is not only bad for accessibility, but it can ruin your analytics.

External links on the other hand (links leading to another website), SHOULD open in a new tab.  This will keep your page open, extending your session duration, and giving the reader easy access back to your content.

🌟BONUS ACCESSIBILITY POINT: Indicate to readers ahead of time that a link will open in a new window. This helps users of all abilities understand and expect significant content changes.

Avoid redundant links

Redundant links are generally one of two things – having multiple links on one page that all lead to the same place, often found on sales pages, or multiple links on a page that all say the SAME thing, but lead to different places, such as ‘read more’ links.

It is important to avoid redundant links in your blog whenever possible so readers, especially those using screen readers, don’t get confused and become unable to navigate your content.

Within a blog post itself this generally isn’t a problem. But your blog home page might have those “Read More” links all over the place. If your platform allows it, the best solution is to just have your post title be a link and forego the ‘read more’ link or button.

Guaranteeing the Images in Your Blog Post are Accessible

It is important to incorporate images, diagrams, and infographics into your blog post to break up the text and add extra value to your content.

However, it is not enough to just simply add these elements, you need to be sure and add alt text (alternative text) and/or image descriptions to them for accessibility, and SEO, purposes.

Writing good alt text is an artform in itself that we are not going to discuss here, but if you are interested in learning how to write effective alt text and image descriptions check out this article, How to Write Good Alt Text & Image Descriptions for Your Website.

It is important to understand the three main purposes alt text and image descriptions serve.

  • Accessibility: Alt text helps visually impaired users understand the content of an image when using screen readers. The screen reader reads the alt text aloud, providing a description of the image. If alt text or image descriptions are not provided these users will not have access to your content the way you intend them to.

  • SEO: Search engines use alt text to understand the content of images, which can improve your website’s search engine rankings. Properly described images can help your site appear in image search results, thus drawing more organic traffic to your blog.

  • Fallback Content: If an image fails to load, the alt text is displayed in its place, ensuring that users still get an idea of what the image represents. Keep in mind, images not loading are not only due to technical issues, but some users also choose to not have images load to improve page speed or reduce distraction.

 
visual example of good and bad alt text as described in the surrounding text.

Bad Alt Text

Woman reading

Good Alt Text

A brunette woman wearing black glasses is relaxed, reading a book in a modern bucket chair near a window. She is wearing a black top, blue jeans, and her legs are stretched out with her bare feet resting on the window sill.

 

Here are some of the key principles to follow when writing alt text and image descriptions for your blog:

  • Be Descriptive and Specific: Provide enough detail to convey the image’s content and context.

  • Keep It Concise: Aim for a concise description, typically no more than 125 characters. This ensures that screen readers can easily read the alt text without overwhelming the user. Focus on the essential information that the user needs to understand the image.

  • Context Matters: Ensure the alt text is relevant to the surrounding content. The description should complement the text and provide additional context where needed. Do not repeat information that is already provided in the surrounding text.

  • Avoid Phrases Like “Image of” or “Picture of”: Screen readers already announce that there is an image, so you can directly describe the content. For example, instead of “Image of a white dog,” use “A white dog sitting on grass.”

  • Functional Images: For images that serve as buttons or links, describe the function rather than the appearance. For example, “Search button” or “Link to home page.”

Verifying Your Multi-Media is Accessible

For the purposes of this article, when we talk about multimedia, we are referencing any videos or audio tracks you might add to your blog. We are also going to assume you are using a platform that has accessibility features built in. The two I recommend would be YouTube and Vimeo.

By using an accessible media player, you will have less manual work to do. Platforms like YouTube and Vimeo are built to be keyboard accessible, screen reader compatible, and have closed caption and transcript tools built in but note audio description tracks usually have to be added separately.

The three key things to consider when auditing your multimedia for accessibility are.

  1. Closed Captions

  2. Transcripts

  3. Audio Description

 
Visual to help people recognize common icons for closed caption, transcripts, and audio description

Closed Captions

Having closed captions, a text representation of what is happening in a video, available will allow anyone with a hearing impairment or anyone consuming your content in a noisy environment to understand what is happening in your video.

Closed captions must

  • Be accurate; word for word

  • Be synchronized with the video

  • Have a clean legible font

  • Contain non speech elements like music cues and sound effects

In many cases your captions will be generated automatically from the transcripts. This is a huge time saver but be sure to take the time to review them for accuracy and make any necessary changes.

Transcripts

Transcripts are a text representation of what is happening and being said in video and audio content. They allow people with hearing and vision impairments to access your content.

There are three main types of transcripts.

  1. Verbatim Transcripts: These include every word spoken in the audio, along with non-speech elements like sound effects and speaker identification. They provide a complete and accurate representation of the audio content.

  2. Clean Read Transcripts: These are edited for readability, removing filler words, false starts, and non-essential elements. They focus on conveying the main points clearly and concisely.

  3. Summary Transcripts: These provide a brief summary of the audio content, highlighting the key points and main ideas. They are useful for longer audio files where a full transcript might be too lengthy.

Regardless of the type of transcript you provide, it is important to verify accuracy, use headings, paragraphs, and punctuation for easy readability, and add time stamps at key points of the video or audio.

Good places to add your transcript are in a video or podcast description and in your blog, on the page as a link to a PDF, markdown file, or word doc either just before or after your multimedia.

📝NOTE

Search engines CAN index captions and transcripts, which in turn will boost your video, audio (podcast), and blog rankings.

Audio Descriptions

Audio description (AD) is an audio narration of a video’s visual elements. AD often includes scene changes, body language, on screen text, and speaker names and titles.

These audio files can usually be turned off and on like captions and help people who are blind or visually impaired understand what is happening in the video.

AD is still not widely included in videos but should be considered as part of your accessibility process when adding videos to your blog. Being a leader in digital accessibility features like this can have a huge impact on your customer base.

The Legal Side of Blog Accessibility

I am not going to go into depth about the various laws surrounding digital accessibility, but I encourage you to follow some of the links below to learn more. The fact of the matter is, if you have a public facing business (and hello, you are on the internet, so I am talking to you), you need to ensure your blog posts, and any other digital content is accessible to people of all abilities.

What are the consequences?

You can indeed be sued. You don’t need to be a large company like Dominos, Hasbro, Sweetgreen’s, or any of the other high profile  companies sued for website accessibility. 

Non-compliance can not only result in legal action or fines, but it can also seriously damage your business’s reputation. Considering accessibility as you write your blogs, shows you care about ALL your readers and that you are committed to providing an inclusive experience for everyone.

Be proactive when it comes to your digital content. Implement necessary changes, such as those discussed in this article for your blog posts, conduct regular accessibility audits, and stay up to date with the regulations and laws. By incorporating accessibility best practices for your blog today, will help to future proof your content and make it easier to comply with the ever-changing laws surrounding digital accessibility.

Resources to learn more about the regulations and laws surrounding digital accessibility.

Title III of the ADA

Web Content Accessibility Guidelines (WCAG)

Section 508 of the Rehabilitation Act

European Accessibility Act (EAA)

 
Page showing initial insights for a website accessibility audit, including items like pages audited, color contrast results, errors and warnings to address, and icons showing who is affected by inaccessible content.

Overwhelmed with where to start?

If you work better with a to do list that you can check off, getting a website accessibility audit is the best place to start.

You’ll know page by page what to tackle, at a pace that works for you.

Get a FREE Project Quote

Tools to Help with Digital Accessibility

Below is a list of tools that can help with various accessibility testing and verification. All links will open in a new tab so you can learn more about how each one can help you write more accessible blog posts.

WAVE: A browser extension that can check any page on your website, including your blog posts, for accessibility.

axe: An accessibility checker used to test web pages and generate comprehensive reports.

Accessibility Insights: A Microsoft tool that helps identify and fix accessibility issues in web applications.

Tools for Checking Color Contrast

WebAIM Contrast Checker

Color Contrast Analyzer

Accessible Colors

Coolors Contrast Checker

Tools for Checking Alt Text

SEOptimer Alt Tag Checker

ContentForest Image Alt Checker

Transcription Tools

Otter.ai

Rev

Descript

 

Add accessibility to your monthly content creation process.

Easily keep track and ensure you are taking steps to make accessible blogs, social posts, ebooks, and other digital content every month.

Get The Checklist

Community and Education

Having a place to ask questions about digital accessibility is important. A lot of the resources out there are geared towards professionals, and thus are in a more technical language.

I invite you to join the Access Designs community. I aim to provide helpful resources and easy to implement steps to make your content and brand more inclusive.

The newsletter, The Digital Dispatch, will bring blog posts, videos, and other content about digital accessibility, web design, and small business right to your inbox.

 
 

The new Facebook group is an easy place to ask questions and get quick tips.

 

If you are looking for a course about digital accessibility that you can forever reference on a as needed basis, get on the list for my courses coming late 2024 and early 2025. These will include jargon free videos teaching you about creating accessible content, showing you good and bad examples from real sites we all know, and showing you how to use a variety of tools to check your website and other content for accessibility.

 
 
Nicole Nault

Thanks for visiting the blog. I love teaching others about digital accessibility, Squarespace web design, and offer tips and resources for small business owners. If any of that hits your fancy, join The Digital Dispatch, a monthly newslettter that will drop the latest posts right to your inbox.

https://accessdesigns.net
Previous
Previous

Ready Your Website for the New Year (Any Time of Year)

Next
Next

How to Write Good Alt Text & Image Descriptions for Your Website