This new feature, Bubbly Berls Babbles (or BBB), is kind of an adaptation of my old feature, Fun Questions, back at Fantasy is More Fun. And the title tells it all. I’m Bubbly, I’m Berls, and I’m about to Babble about something! I hope you’ll babble along with me 🙂
Today Bubbly Berls is Babbling about: accessibility on your blog
So let me begin by saying I’m by no means an expert on this topic. However, it came up due to my position as web master on my school’s website and I’ve come to realize that people (including me) are really uninformed about internet accessibility. So, I figured I’d share what I do know.
I think the trick is, we often think about accessibility in terms of ability to move around in our real, physical world. But the internet is a world of it’s own and we want it to be accessible to everyone too, right?! What kinds of disabilities or impairments should we be aware of on our blogs? While this is no means a comprehensive list, here are some major ones to have on your radar and ways simple things can make a big difference.
Vision impairment
I’ve often thought of this as blindness, and while that’s certainly a major part of this category, it includes people with astigmatism, severe vision loss, and color blindness. How can you make your blog more accessible for the vision impaired? I think this is quite possibly the biggest area of accessibility options, so the list is long!
- Use your headings correctly. I know when I first started blogging I saw designations such as h1 and h2 as design features – and you certainly can code into your CSS different design elements that go automatically with h1, h2, h3, and so on. However, that is not their purpose and not how they should be used. When someone with a vision impairment uses a screen reader, the more advanced ones will read off this designations for them. So for example on this post it would read “h1 (or heading 1 depending on the reader) Bubbly Berls is babbling about accessibility on your blog.” Then, after my brief intro to the feature, it would go to “h2 Today Bubbly Berls is Babbling About: accessibility on your blog.” H1 should ALWAYS be reserved for the blog post title, the first subheading h2, and any headings within that should be h3 and so on. When it came to this section it would read to them “h3 Vision impairment” and that would signal to them that we’ve reached a sub-discussion point within my topic of accessibility. If, for design reasons, I had selected h2 instead, I would have been indicating a complete change of topic. This matters, not just for making sense of what their reading, but also for enabling them – like those of us without vision impairment – to scan a page quickly to find what matters to them.
- Images should always have “alt-text.” Think back to a time where you’ve been to an internet page/blog page where the images were broken on the page and you have these little white icons instead of the image. On some of those pages you would have seen words imposed over the top of that white icon, describing the image. Those pages are accessible, whereas the ones without the description are not. Again, this is about the readers. Where we see an image, the reader will read the description – if there is one. And that description is found in the “alt-text.” Alt-text is not a caption, which is meant to relate an image to the content; alt-text’s purpose is to describe. It’s brief though, for example with a book cover, I put “cover of book title” not “shirtless man standing by wave and hair flowing behind them.” It’s a phrase that helps them place the image, so don’t stress out thinking you have to be super detailed.
- Images should not have text that isn’t also found in the alt-text and/or caption. Again, we’re going back reader. If you have an image with the dates of an event for example, and then you don’t state those dates in the alt-text and/or caption, you’ve just excluded a visually impaired person! Yes, more may show up in the post, but just as the image was designed to give those without vision impairment a quick glance of details, so should the alt-text and/or caption. This is something I have to be much more aware of myself.
- Be careful with your colors, especially when using them to give meaning. In fact, it’s best practice not to rely on color alone to relay a message. Use it, but only when the meaning is clear without distinguishing colors. And this is an instance where less is truly more. The more colors you have, the more likely they are to overwhelm and blend for someone with one of the various forms of colorblindness. And there are some color combinations that are just no-no’s (and honestly hard for everyone, not just those with colorblindness):
- Green & Red
- Green & Brown
- Blue & Purple
- Green & Blue
- Light Green & Yellow
- Blue & Grey
- Green & Grey
- Green & Black
That’s all I have for vision impairment, but I’m sure there’s more out there!
Hearing impairment
This is an area that I don’t know a whole lot about in terms of accessibility, chiefly because I haven’t really used a whole lot of audio on my blog or school website. Which is actually a great way to be accessible – don’t depend heavily on audio for your content. And when you do have audio, the key is to make sure it’s accompanied by captions or a transcript that can be read. Captions are good, transcripts are better. Why? Because Hearing and Vision impairments are not mutually exclusive, meaning just because someone is hearing impaired doesn’t mean their vision isn’t also impaired. Captions are typically embedded within the video, accessible only to those without vision impairment. Transcripts exist externally, meaning that those using braille readers can access them as well. This is something I hadn’t thought a lot about before, as I was JUST saying how much I’d like to learn how to include audio clips in a review, but now I’m thinking that to do that, I’d really want a way to access the transcript and that would be a lot of work. So I’ll probably pass.
Motor impairment
Again, this is something that doesn’t come into play a whole lot for me because of how I’ve always blogged. But it has to do with people who may, for example, have difficulty using a mouse. Can they navigate through your site using a keyboard only? If they choose to use a mouse, is it a fancy pointer that is hard to click with? Decorative pointers look nice, but they can pose a real problem for those with motor impairments. Same with your buttons, are they tiny, providing a small click area? Do they require a complicated hoover, click pattern? What may be a minor frustration to some could be a lack of accessibility for others.
Other impairments
Like I said at the outset, I’m am no expert on accessibility. I’ve tried to hit the major issues I’ve become aware of, but I’m sure I’ve missed a great deal. For example, flashing backgrounds/images are a no-no – especially if they can’t be turned off – because of those who suffer from seizures. But I only know about that because my brother is epileptic.
I think the point is to make ourselves aware as possible and to make conscious decisions about now excluding anyone from our wonderful community. It takes minimal effort really and is just about teaching yourself to take a couple extra steps here and there. What’s minor for us can be a big deal for someone else, so I think it’s worth it!
Great tips! As a special education teachers I have worked with students who have lots of impairments and these are all things they have expressed frustration over. As someone with a hearing impairment I know how much I love closed captions!! I am thrilled when a video on fb has them so I can see what all the hype is about!
Thanks 🙂 I think people are just really unaware of accessibility online. We are so used to providing accommodations in the physical world, but forget about it on the web!
Great tips Berls. I was watching a webinar on accessibility in email (I build promotional emails for a living) and the one that I never thought about, but was brought up, ADHD. They mentioned about animated gifs, things that change when you hover and an email (or in your case site) just being really busy. That was something that I had never thought about before. I knew about the others (even if I don’t know enough about them). Again, great post.
Oh wow, yeah totally wouldn’t have thought of that either! But it makes sense. Thanks, I thought it was great to learn and wanted to share 🙂
Great tips Berls!! Thanks for sharing. This stuff is good to know.
You bet! I found it really interesting to learn about.
You know I don’t think I ever really gave that much thought so great post!
Thanks Stormi! I think it doesn’t come to our minds as often as bloggers, since we don’t have compliance issues to worry about. But I think it’s good to know 🙂
Great post! These are fantastic tips Berls.
Thanks Kimba 🙂