Accessible Blogging Content Creators Guide
Since the birth of social media, blogging has remained one of the most popular and widely accessible forms of digital content. Each month, approximately 409 million people view more than 20 billion different blog pages. As of 2021, there are over 455 million websites on WordPress and that number is only going up.
Starting a blog can seem like a highly lucrative hobby and career path. Not only can blogs make good money, but they can be super cheap to start. With such a great selection of free blog hosting websites these days, all it takes is a laptop and a fresh idea.
Due to its simplistic nature, the traditional blog layout can be surprisingly easy to make accessible. Many blog-hosting websites provide a wide selection of free templates that are pre-made with accessibility in mind. You just need to know what to look for. Digital accessibility is about ensuring that there are no barriers between individuals with disabilities or impairments and web access.
The UN states that digital accessibility is a human right. You not only have a moral responsibility to make your blog accessible, but it comes with benefits if you do! Worldwide, there are over one billion people with disabilities. That’s around 15% of the population. Which also translates to 15% of your potential audience. It was reported that 71% of users that find a piece of content inaccessible will simply leave. An inaccessible blog will instantly block out a massive amount of your potential audience. Similarly, a huge percentage of individuals with disabilities will be prevented from enjoying blog content due to its inaccessibility.
We want to make the most of our content’s potential, and accessibility is a step in the right direction. So, we’ve made an easy-to-follow guide of simple tips that will give your blog an accessibility-friendly edge.
Good Website Layout
Accessibility is all about ease of use for people with different disabilities and impairments. To make our blog as easy to use as possible, we need to think about the basics. Step one in making your blog accessible is having a clear and simple layout.
Everything on your blog should be easy to navigate and placed in a predictable spot. This includes menu items, text items, links, and forms. An accessible layout reduces the risk of people clicking on things unknowingly – particularly for people with screen readers. A clear layout is also needed for people with cognitive disabilities as they rely on patterns and repetition. Keeping things straightforward is also more likely to attract an audience that is less familiar with technology.
It can be difficult to know where to put everything. Especially if you’re starting with a blank template. List style menus are easier to operate for people using assistive technology. When a menu is shown as a list, the number of menu items can easily be identified. These lists should usually be found on the top of the page. However, it’s important to note that for people with reduced dexterity, fly-out-style menus can be difficult to operate. It’s always a good idea to make a large format of your menu items available from somewhere else on your homepage.
All components of your website should be accessible solely through keyboard features like tabbing navigation. Tabbing is the ability to navigate a website and its focusable elements through the tab key on your keyboard. Pressing the tab key will usually focus on the next element whilst pressing tab + shift will focus on the previous element.
Your website’s layout should be consistent. The body text font should remain the same throughout the website. The font should be clear and big enough to read easily. Headers should be in a similar font but discernibly bigger.
A simplistic color palette will give your blog a sleek look whilst helping with its accessibility. Your blog has been made to be read. A strong contrast between background and text ensures that your posts have maximum visibility. Following WCAG guidelines, the minimum text-to-background color contrast ratio should be 4.5:1. This number won’t mean much to the majority of people. If you’re in doubt, just put the color codes into an online color contrast ratio checker – they’re free to use and it takes less than a minute. However, using color can be a fine line. Overuse of color can not only be overwhelming to look at, but it’s almost impossible to perceive for people with color blindness. Use color intentionally and sparingly.
Many popular blogging websites provide a great variety of pre-made templates, many of which already come with these features. Changing the layout can seem like the most overwhelming step, but if you choose a good template then it’s often the quickest fix.
Let’s Link Up!
If you’re running a blog that’s been monetized, it’s likely that you’re using affiliate links. Your income is reliant on these links. Making them inaccessible is not only unfair but unprofitable.
When creating links, make sure that they are long enough. 23% of people with disabilities have dexterity problems. Links that are one or two short words can be tricky to click on. HTML links can be difficult to discern for people with screen readers, so it’s always better to label them instead. Make sure that links are around two inches long. This equates to about three or four short words or two longer words.
People with color blindness can’t discern color signals. Solely using color to indicate that something is a link is never a great idea. Instead, underline the link. This will indicate its purpose and bring more attention to it.
Clarity is also very important when creating links. The purpose of the link and where it takes you should be made very clear. Ensure that all your links work correctly and take you to the intended place. Faulty links are both confusing and risky. A blog with faulty links is less likely to get hits as it will be perceived as untrustworthy.
Put a Label on It
There are four main pillars on which WCAG is based. Two of these pillars are that digital content must be perceivable and operable. A great way to make sure that you cover these bases is by labeling everything on your blog correctly.
When labeling buttons and links, accuracy is our primary goal. Describe exactly what they do and where they take you. Avoid vague statements such as ‘click here’ and ‘more’ as they are uninformative and unhelpful. To avoid ambiguity, all buttons should be labeled with a text description. Buttons should not rely solely on color or a symbol to display their purpose. Screen readers cannot understand graphics or any other visual context. So, correct labeling is essential for people that have visual impairments.
Labeling correct is particularly important for comment forms. Make sure that each box is labeled with its exact purpose. The name box, the email box, and the comment box should be labeled concisely as so.
Keep Things Crystal Clear
Blog posts are a creative space. It’s often tempting to write something that’s technically impressive rather than easily readable. Over-stylized writing can be confusing and difficult for many to read. Particularly for people with cognitive disabilities, people that rely on screen readers, and foreign language speakers. The best writing conveys its full meaning in the simplest way possible.
Write in clear and concise language. Generally, sentences should be no more than 25 words long. Any more than that, and your sentences can become convoluted and confusing. If you feel like your sentences are too long, consider increasing your use of full stops. Most of the time, a comma can be replaced by a full stop. Decreasing your sentence length will give your writing a better flow.
Utilize new paragraphs liberally. Every time you’re introducing a new topic or thought take a new paragraph. Reading big chunks of text is jarring and disengaging. On top of this, it’s more difficult to read for those with cognitive disabilities. Using clear breaks between text makes your blog easier and more enjoyable to read.
(Color) Opposites Attract
Color contrast is fundamental when talking about digital accessibility. According to WCAG 2.0 (AA) guidelines text to background should have a color contrast ratio of at least 4:5:1 apart from in the following situations:
- When you are using large-scale text. In this case, you should have a color contrast ratio of at least 3:1.
- Text or images that are part of an inactive user component, that are purely decorative, that are not visible to anyone, or that are part of a picture with significant other visual content have no minimum color contrast ratio requirement.
- When using a logo. Logos have no minimum color contrast requirements.
When writing text, it’s not only important to make sure that it has good contrast. We also must make sure that the text is in a clear font and is generously sized.
When looking up any list related to digital accessibility, one of the first suggestions will always be to provide alt-text for your images. This is because it is one of the most important suggestions! Almost 7.3 million Americans have impaired vision. Within this, a large percentage of these people are reliant on screen readers. Despite this massive number, many people still fail to utilize alt-text features.
Alt-text is a short set of copy that describes what an image is on a digital platform. Alt-text appears as a substitute when a page fails to load an image properly. However, alt-text is mostly by individuals who use screen readers. Alt-text allows people that use screen readers to visualize an image on an app or a website. As screen readers cannot understand graphics or images, alt-text is essential in aiding visualization. If your platform doesn’t support alt-text, then consider providing a short description below the picture instead.
Not only is it important that everyone is given a fair opportunity to interpret everything on your blog, but it also helps with engagement levels. If you make sure that you cater to everyone, then people are far more likely to stay or even return.
Test Device Compatibility
Forgetting to test your blog’s device compatibility is one of the most common mistakes first-time bloggers make. Not only is it important that your blog platform works with different devices for accessibility purposes, but also for general usability.
What works on a desktop won’t necessarily translate similarly onto a mobile browser. Test your blog page on all different browser formats: web, mobile, and tablet. If you have a header style menu on a web browser, make sure that this changes to a drop drown or sidebar menu on mobile and tablet browsers.