Here's One Solution

Letter to Startup Britain website

The UK Government are sponsoring a website to encourage Startup Britain.

As with 90% of UK Government websites, there are basic accessibility issues that would take somebody 5 minutes to put right. Here’s the email I sent explaining a couple of quick and easy fixes.

Hi there,

Your website looks like it could be a useful tool, but I spotted a couple of problems that could make it difficult for those with disabilities to use.

Firstly, there is no way to know where you are on the page if you’re using a keyboard and not a mouse. You have the following line in your CSS.

/resource/css/site/base/site.css line 91

a {
    text-decoration: none;
    outline: none;
}

If you remove it, then links that people have focused on by using the tab key will have an outline and they will know where they are on the page.

The next big issue is to do with the email signup form.

<fieldset>
	<input class="clear-input textbox" id="register-email" name="entry.0.single" value="Your email address">
	<a class="submit button" href="/"><span>GO</span></a>
</fieldset>

There are a number of problems here that make the form difficult for people using a screenreader to use.

1) No <form/> element. This makes it hard for people to know where on the page the form is.
2) No <label/> associated with the <input/> element.
3) An <a/> element with ambiguous text instead of a <input type="submit"/> element.
4) Form won’t work without JavaScript.

Much better would be to use something like this:

<form action="/register" method="post">
<fieldset>
	<label for="register-email">Your email address</label>
	<input class="clear-input textbox" id="register-email" name="entry.0.single" value="Your email address">
	<span class=" button"><input type="submit" value="Go" class="submit" /></span>
</fieldset>
</form>

With this code the JavaScript enhanced form would still work, but it would fall back to a regular form if JavaScript is not available for any reason.

Hopefully your web design team can implement these changes quickly and make the site easier to use for people with disabilities. It may be worth asking them to check the rest of the site as there may well be other problems that I didn’t immediately notice.

If you have any questions then drop me a line.
Best regards
David

About My Vote accessibility issues still not fixed

So its a week since I wrote to the About My Vote website about the accessibility of their forms and I haven’t heard any reply. I sent them another email today.

Hello,

I sent you an email last week regarding the accessibility of this website, but have recieved no reply. I see today that the problem still hasn’t been fixed.

The issue is to do with the forms on the website. The labels for each field are currently not associated correctly with the corresponding fields. This can make the website difficult to use for people with disabilities such as poor eyesight.

Under UK law, all websites which provide a service should be made accessible. You can read more about this on the COI website (http://coi.gov.uk).

Fixing this problem would be a fairly trivial code change and would make the website more usable for a particularly disenfranchised section of society.

You can associate the form elements and labels using the “for” attribute. This should be added to the “label” element and should be have the same value as the “id” attribute on the corresponding “input” or “select” element.

Once again, if you would like to discuss this problem and it’s solution please get in touch.

Best regards
David Owens

Always give constructive accessibility feedback

It’s very often all too easy to point out other people accessibility problems without doing anything constructive. If you spot an problem on somebody’s website don’t just bitch on Twitter, help them to fix it.

Here is the feedback I sent to the Electoral Commision’s About my vote website today. With hindsight, I could maybe have used simpler language but this is at least a step in the right direction.

Hello,

I noticed today that the labels on your forms are not properly associated with the corresponding inputs in the HTML. This can make it much harder for people with a range of disabilities to interact with the forms.

You can associate the form elements and labels using the “for” attribute. This should be added to the “label” element and should be have the same value as the “id” attribute on the corresponding “input” or “select” element.

If you would like to discuss this problem and it’s solution please get in touch, although your usual web team should be able to easily fix this.

Best Regards
David Owens