Accessibility and Your Website. Image Alt Text: What is it and How Do I Use Them?

Accessibility and Your Website. Image Alt Text: What is it and How Do I Use Them?

Here at Thinking Outside The Sandbox we are passionate about giving you the resources and information you need to successfully run your WAHM or small business. We try to do all this without going down the rabbit hole of technical jargon and overwhelming information.

To prevent us from crushing your brain with information we sometimes condense topics or gloss over some of the obscure not-as-important tidbits of information.

Except this time.

Image Alt text (sometimes referred to as Alt tag) provides information to a reader when and image is not displayed.

You *could* go your entire online career without knowing and utilizing Alt text but you would be doing your site a great disservice.

The reason?

Alt text helps blind/visually impaired readers ‘see’ the images you place on your web pages.

How?

If your visitor uses a text to speech or electronic Braille device the machine will read the HTML code behind and translate it so the reader can understand. Neat eh?!

Example:

You have a web page about elephants. As a person with pretty good eyesight I would be reading your information and would see a picture of an elephant with a beautiful red hat.

If I was using a text to speech program the experience would be a little different.

Without Alt text – Listening to your information about elephants and then hear a long pause. Is the web page finished? Oh wait there is more information. Continues to listen.

With Alt text – Listening to your information about elephants and then hear image – elephant wearing a red hat — continues to listen.

WebAIM has a great audio example.

Okay I am convinced. How do I add Alt text?

If you use WordPress you can add alt text to images right in the media editor.

image alt text wordpress example

The HTML code for Alt text is

<img src=”where your images lives” alt=”description of image”>

 

3 Comments

  1. Suzi Satterfield
  2. Malia
  3. Emily @ Words I Wheel By

Add Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.

google.com, pub-8596903668708912, DIRECT, f08c47fec0942fa0
Verified by MonsterInsights