Hello, fellow microblogger! Today I’m going to share this one weird old trick with you.

It will make all your future blog posts more accessible to a lot of people.

But before that, I’m going to tell a short story from my life.

It’s a true story.

I’m Sven, by the way.

On microblog, I go by Sod.

Okay.

Storytime.

It was a dark and stormy night.

No.

No, it was a summer day, back in 2011.

And it was my first day working for a new client.

I’m a web developer, so I build web stuff.

It’s not essential to this story, but I was about to implement one of those pop-up boxes everyone hates.

Hey, we use cookies on this website.

Will you allow that?

What is important, though, is that this gig was on premise.

I had to work from the client’s office.

I’m usually remote, so I remember this was pretty exciting for me.

A change of scenery and a chance to meet new people, and so on.

Anyway, I showed up and was given a quick tour of the office before it was time to do my cookie thing.

And after a while, I felt the need for a break and a cup of coffee.

I passed this guy hunched over his desk on my way to the kitchen.

He was squinting his eyes close to the monitor, and on the screen was a single character.

Like the letter A or B or one of their friends.

What is he even doing, I thought, and I said hello.

Or I probably said hey, because that’s how we greet each other here in Sweden.

Either way, we started talking, and pretty soon I learned that this friendly person is visually impaired.

He has very low vision, but can make out some shapes and forms.

So when zooming in on a single character, he can read one letter at a time.

This is pretty impractical, so he uses a tool called a screen reader most of the time.

A piece of software that reads the text on the screen aloud using a synthetic voice.

So why wasn’t he using the screen reader when I happened to pass by?

It turned out he was troubleshooting a problem with his computer.

And as one tends to do, he turned to the almighty Google and found a promising blog post with a potential solution.

But unfortunately, this blog post had a couple of screenshots containing text.

And the screen reader wasn’t smart enough to make out the text and read it.

So the screenshots were inaccessible to him.

My newfound friend had to work around this by zooming in on the screenshots to read, letter by letter, painfully slow.

And now you might ask, could the author of the blog post have done something to avoid all this extra work?

And the answer is, yes, absolutely.

With a little bit of extra effort, we can make screenshots and other images more accessible to a larger audience.

And now I will show you how.

Let’s switch over to something familiar to all of us.

The micro.blog timeline.

Here’s one of my posts.

A short message followed by a screenshot.

It may look all right to a seeing person, but it’s problematic for everyone relying on a screen reader.

Let’s have a listen.

I’m so happy I checked this option.

My timeline is less busy now.

Did you hear how the screen reader just skipped over the entire screenshot and started reading the year and date instead?

It’s like the screenshot isn’t there at all.

So let’s fix this.

I’m going to make a repost, but this time I will add a text description for the screenshot.

I just have to find that new post button.

And recreate a message in the text area.

I’m so happy I checked this option.

My timeline is less busy now.

Let’s add the screenshot.

And now the thing you have been waiting for.

That one weird old trick that will change everything.

Are you ready?

By clicking on this tiny thumbnail here, I get this dialogue.

And accessibility description.

That’s exactly what I want.

Now screen readers will read whatever I type in this text field when they stumble upon the screenshot in my post.

So it’s better to be helpful and should make sense when read together with the rest of the post.

First a reminder.

The screenshot is a browser window with microblog open.

And this is my description.

A web browser with microblog’s account settings page open.

The heading timeline is followed by two options.

The second option is selected and highlighted with a bold green circle.

It reads show mentions only to people I’m following.

Includes fewer posts in busy timelines.

I think that’s a reasonable description of what’s going on in this screenshot.

Writing text descriptions takes practice.

And you want to capture the gist of the image.

It’s okay to skip relevant parts.

Like in this case, I could have gone on saying there’s an address bar and a back button and so on.

But that would not add any value to the person listening.

One could definitely argue that my description could be even shorter and more to the point.

But I’m happy with it like this.

I will paste it here.

And hit okay.

Follow by post.

Now let’s use the screen reader to listen once again.

This time with a text description of the screenshot.

I’m so happy I checked this option.

My timeline is less busy now.

Relieved face.

A web browser with microblog’s account settings page open.

The heading timeline is followed by two options.

The second option is selected and highlighted with a bold green circle.

It reads show mentions only to people I’m following.

Includes fewer posts and busy timelines.

Image 2022.

Did you hear how that additional text made all the difference?

People using screen readers no longer have to guess what I’m happy about.

The information in the screenshot is available to them as well.

Of course, I’ve talked about screenshots all this time.

But alternative texts are essential for every image you share on your blog.

Illustrations and paintings, scribbles and photos.

Every image deserves a good text description.

Well that’s it for my crash course.

But there’s a lot more to learn and do to make your blog more accessible.

And if you are curious, you’ll find a collection of links to explore on my site.

And finally, next time you share an image, remember this one weird old trick.

Click the thumbnail to add a text description.

It’s quick and easy and makes a difference to everyone using a screen reader.

Thank you so much for listening.

Bye bye.