Accessible websites

Sites should be Perceivable, Operable, Understandable and Robust.
Pages should be Perceivable, Operable, Understandable and Robust.

Many people struggle to read a website for a wide variety of reasons. They may be badly written or have so many advertisements, that you can’t find the actual text – hello local newspapers. They may also be structured badly.  This might not always be apparent.  If you want to show that a specific bit of text is really important  there are many ways of doing it, but using a colour that some people can’t distinguish is not a good way.  One in twelve men and one in 200 women are colour blind.  That is a very large percentage of people who may not be able to understand your page. This is just one example. ‘Click away pound survey‘ reported that 71% of disabled users will click away from your site if it is too difficult to use.  

Online content quick checklist

This is just a headline list and by no means a comprehensive how to guide to writing digital content.

  • Do use text for words.  I know this sounds like a stupid thing to say but some sites and other materials may have images of words and not text – a photo of a newspaper report for example. 
  • Use headings don’t just add your own emphasis and use them in a logical order. This makes it easier for someone wanting to quickly review a site to see if it has the information they are looking for and is used by screen reader users to navigate. 
  • Add Alt Text to all your images if they are there to convey information.  If you have an icon or ‘squiggle’ to separate bits of text, just label them as decoration. Alt text is needed for screen reader users. You do not need to add ‘image of’ or ‘photo of’ in the alt text, the screen reader knows it is an image. Generally, you don’t need to describe the image  in detail but add the information that the image is conveying. Examples: 
    • ‘Shawl showing the full size and pattern variation’, rather than ‘person holding out a shawl to its full length with their arms out wide’. 
    • ‘Front of sweater showing rib and body detail’, and not ‘person standing by a table wearing sweater’.  
    • ‘front and top of socks with cable’ not ‘socks worked from the top down’ – unless the last bit makes a different to their appearance.  I’m not a sock knitter, can you tell?
  • Once you have added alt text to an image on a site, the alt text will ‘travel’ with it, so if you link to it on a different page, you don’t need to add it again. This is not the case with a caption.
  • Use plain English. This is categorically not dumbing down but making your text readable and understandable.  One of the biggest problems is the use of the passive voice.  If you are not sure here’s a simple example.  
    •  We cooked a healthy meal. (active)
    • A healthy meal was cooked by us.  (passive)
  • Break up your text so that you don’t post huge intimidating blocks. All users like to get a feel for the content of a page and tend to scan the headlines, the images and the bullet points before committing to reading the whole thing. Use all of these things. 
White rivers of text caused by double spaces after a full stop and fully justified text
White rivers of text caused by double spaces after a full stop and fully justified text
  • Only one space after a full stop. I find this the most difficult to follow. I was taught to type using a huge old manual typewriter and it was double space after every full stop. I still automatically do this now – and have to go back and remove the extra spaces once I have finished. The double space rule was designed for typewriters that had a uniform size for all of their letters. Now we use computers the width of a letter n is less than that of a letter w for example. This along with justified right margins can create white rivers going up and down the page. These add to the problems of some dyslexics as well as looking terrible for other readers.  
  • Emphasise text using bold, underlined or even added in capitals but be cautious of too many capitals – it looks like you are shouting. Don’t just use colour.
  • For online content, check the navigation. Can you get round the page using a keyboard only? Try the tab key and see how long it takes to get to the search box. Do you really want your readers to have to tab 93 times?  Many people can’t use a mouse well, or even at all and prefer to use a keyboard.

Finally, yes there are accessiblity faults with this site – the headings have too little contrast, but I am simply using a theme from WordPress. I am not a web designer but making the most of the system I have access to. Most sites have some accessibility issues. Being aware of them is a step in the right direction to overcoming them.

6 comments

    • Hi Regina, no I don’t really follow football, other than checking the scores. Having said that my husband has taken a liking to the Leeds United manager, Marcelo Bielsa. He is quite a character, so we do have a growing interest in their fortunes at the moment. One of my daughters is a huge Liverpool fan so is very happy as they have just won the premiership after 19 years and a break of 3 months for Covid.

      Liked by 1 person

      • That’s right, you are ‘across the pond’. Well, I asked because in the US, the NFL came up with this brilliant idea {{cough-cough}} to have the teams wear “color rush” uniforms for Thursday Night Games. These unis were solid, rather than mixed colors or stripes.,,kind of like the Power Rangers. Anyhow, one night, the two teams that were playing had uniforms in the two most common colors to affect those with color-blindness. To those viewers, the uniforms were indecipherable! It was an accessibility NIGHTMARE!!! Makes you wonder who informs these people. Clearly they don’t have a broad base of consultants.

        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