Writers are bombarded with helpful hints for websites and advertising campaigns we hope will make us stand out and draw more traffic to our products. We are told things like:

  • There is a higher click-through rate on adverts with an image.
  • We should include animated gif adverts or embedded book trailers to grab a potential reader’s eye as they browse.
  • Parallax scrolling makes your page pop with a 3D effect.

While these ideas may very well work (I’m not convinced on the parallax thing), they exclude a portion of our potential readers, those who are visually impaired.
This is important, especially if you offer your writing in audiobook format.
Making your website or ad accessible to visually impaired web users is not difficult, and it is an issue that is close to my heart. For several years before her death, my mother was completely blind, unable even to tell night from day. She had been a voracious reader, and when she lost her sight due to diabetes, she struggled.

A rectangular cassette player for audiobooks for the visually impaired. Speaker area at top, cassette in the middle left, large tactile keys on the left bottom. Speed and volume control toggle on the right of the machine. A handle is shown at the bottom.
Old audiobook player for the visually impaired. Credit: keepandshare.com

This was back in the early 1990s when reading and writing material for the visually impaired was not exactly the best. She would receive audiobooks on cassette tape that would fit into a giant, clunky old player that looked like it came out of the 1950s.
My mother also had a DOS-based computer that was basically a speaking typewriter. It did little but announce what was written. This was great if you knew how to touch type already and only wanted to produce chunks of text, but useless for anything else. It was a Toshiba T1000 with voice synthesis and was cutting edge for 1991. It featured a whopping 512K of RAM.
My mother liked to get it to say swear words. Think of Stephen Hawking’s very early voice synth tech crossed with a Dalek and that’s what it sounded like. Even words that weren’t swear words sounded like swear words…like focus, I still hear that in my head sometimes…fukkus, fukkus, fukkus.

A closed and open view of the T1000 speaking laptop. The LCD monitor flips up and is the same size as the keyboard.
Toshiba T1000 speaking laptop.

Thankfully times have moved on, we have the internet for starters, and with specially designed navigation software and text to speech, the visually impaired can have a decent experience. But what happens if there are a lot of pictures on your website? What about your book covers? Have you tried to connect with your potential readers and give yourself a human face by including an About page with photos of you when you were a kid, or doing something silly? Perhaps you’ve had a promotional book event and have photos of that online, or you went to a writing convention? Maybe you want to show the world you hung out with Stephen King so you snapped a selfie and threw it on your page?
When web navigation software and text to speech hits your pretty picture, it does nothing, because it can’t read an image. Suddenly you are not as accessible as you thought you were.
The easiest way around this is to include alt text with your images. Not everyone understands what this is on their website builder and most people probably don’t even use it. But filling in that extra bit of info is very useful for a number of reasons.

  1. It allows web navigation software and text to speech to read out a description of the photo to the person browsing your site.
  2. It pops up if for some reason your image gets broken when displaying. So rather than seeing a broken image icon, your website will display the alt text.
  3. It gets picked up by search engines and SEO (but do not stuff the tag with keywords as search algorithms will think you are very naughty and penalise you in the rankings – see below for more info).

For the purposes of this post, I will fukkus…sorry, focus, on the first point.Katia standing in the doorway of a head high stone and mud hut.

This is where our descriptive talents as writers can help. I’ll use an example from my website. I have several photos on my About page. This is one of them on the right. The on-screen caption reads Abandoned village – Oman Peninsula 1994/5 (Credit: M. Ziolkowski). Not very descriptive for someone who can’t see it.
The alt text to be read out loud by text to speech software says: Katia standing beside an abandoned stone and mud built hut in the mountains of northern Oman. The hut is just above head height and has a flat roof made of date palm fronds. Behind her, the backdrop of a rocky mountain range looms large.
That text is not visible on the website.

hut web
It can, however, be seen if you use the right-click option Inspect, or Inspect Element. It looks like this in the website code:

alt code
When describing an image for alt text, you want it to be succinct but give as much detail as possible. Do not rely too much on using colours to describe things as the person listening may see colours differently to you, or simply not know what colours look like. So describing something as a blushing pink rose may not have as much of an impact as saying a rose with large velvet petals in full bloom with the stem devoid of thorns.
As I said above, avoid keyword stuffing as this will only penalise you and have the opposite effect of what you hoped. For those who don’t know, keyword stuffing is a technique used in Search Engine Optimisation (SEO). It involves placing multiple keywords into metadata or tags in an attempt to gain an unfair advantage in ranking. It is considered a bad practice and may be termed ‘webspam’. Slap yourself on the wrist if you have ever been guilty.

Alt text can also be added to the images on your WordPress blog. After adding media to your post, simply click on the image and select the edit image icon (the thing that looks like a pencil). When you do this, the following dialogue box appears:

Screen grab of the edit image dialogue box in WordPress with the Alt text box highlighted in a box.

All you need to do then is type your image description into the Alt text box and click the Update button.

As an aside, I’ve found writing alt text descriptions for my photos has improved my fiction writing. It has forced me to think with senses other than my eyes which has helped me create more engaging, three-dimensional prose.
So there you have it, alt text, one easy way to make your site (and your blog) more accessible.

Do you already use alt text? Tell us about your experience in the comments.


Visit my website at www.katiamdavis.com.

kmd email sig

Click here to join my mailing list now for updates and bonus material.
Advertisements

4 thoughts on “One Easy Way to Make Your Author Website More Accessible

  1. Very informative post! Betty says thank you! And now I’m wondering why I didn’t remember alt text. I’ll make a note to myself to make my site more visually-impaired friendly. Something I should have known to do with a blind wife.
    *hangs head*

    Liked by 1 person

    1. Thanks, Caro. Tell Betty “no problem!” I was doing some research for work on online training programmes for staff and came across web-site developments for the visually impaired. That made me think I should update our company website with alt text, which then made me think of my own site. After I’d done that this evening, I decided I should share so others could benefit if they didn’t know about it already.

      Like

  2. What a great post, Katia. My mom is visually impaired and her computer use is almost nil at this point, but even a few years ago this alt-text would have been helpful to her. Thanks for the info. I’ll have to start doing this with my posts. Shared!

    Liked by 1 person

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s