Saturday, March 23, 2013

Silktide blog on website accessibility

RantWoman heartily endorses the following comments about website accessibility being more than W3C compliance.


Hearty endorsement is a big deal. RantWoman has been known to fly into a rage about gushy blindness tourism experiences recounted by someone who blindfolds themselves for a short interval and then does all sorts of cheats. Understand, RantWoman also has lots of ways to cheat but RantWoman at least knows she is cheating. But this guy has gone native more than sufficiently to restrain RantWoman. Read on.


http://blog.silktide.com/2013/01/things-learned-pretending-to-be-blind-for-a-week/



I’m a full visually-able user and I love looking at websites. I know though, that not everyone experiences websites in the same way. Browsing websites at different screen sizes is a hot topic at the moment, but lets not forget that it’s not just mobile users that experience websites differently, blind users experience them in a way you might not even realise.


So I started using a screen reader to see (I suppose I should say “experience”) how a blind user navigates a website. First I want to say accessibility isn’t completely new to me. I’ve been creating W3C valid websites for years, building to web standards, and always taken care to make sure all my images have alt tags, and any Flash has an appropriate text alternative.


However, when I started using a screen reader, I learned quite a lot.

1. A screen reader reads the entire desktop, not just the browser.

Somehow in my ignorance I assumed the screen reader was just the browser, but it’s not, it’s the entire operating system experience. From turning your computer on, you need to navigate using keyboard commands to the browser and open it.


If anyone tells you that a good way to experience websites as a blind user is to use obscure browsers like lynx http://en.wikipedia.org/wiki/Lynx_(web_browser)

or

w3m http://en.wikipedia.org/wiki/W3m

(as someone tried to tell us on our Facebook page http://www.facebook.com/silktide  ), just remember that it’s unlikely you’re getting the same experience as the majority of blind users.


2. It’s difficult

The learning curve is steep! Getting to know the keyboard shortcuts just to move around the page is difficult, as is remembering where those keys are on your own keyboard when you’re blindfolded! Oh yes, I did blindfold myself for the full experience, not at first, but gradually once I became more confident I knew what I was doing. Often I would navigate myself into a corner or option that I was unfamiliar with though, and had to take a peek to discover what had gone wrong.


Here’s a sample of what happens when you navigate to a page using a screen reader, it starts to read out every piece of content on the page, and I mean EVERY piece of content, and doesn’t stop until it’s melted your brain and the words merge together into a sea of electronic voice. If you want, you can listen to the entire page, but I learned from this screencast http://youtu.be/ymDf1CNMKzY   by visually-impaired user Robert William that it’s actually much better to wrestle for the control and navigate through the content yourself. Be prepared though to be baffled by hundreds of links and headings before you even get to the page content, or the link you want.

3. It’s different between browsers

The most popular browsers for blind users (according to WebAIM in May 2012 http://webaim.org/projects/screenreadersurvey4/  ) in Internet Explorer 8 (30.4%) and 9 (28.5) and Firefox (20%). My favourite browser is Chrome, which I started using, but soon realised the experience was very different between browsers, so switched to Firefox which actually does a very good job of accessible navigation.


It was when I viewed a page created by accessibility researcher Sina Bahram http://www.sinabahram.com/  to demonstrate good accessibility that I discovered that Firefox automatically adds a landmark HTML5

“when there’s an actual HTML5 element to do the same thing, I tend to use the element. More semantic.”

He’s right, but of all the browsers I tested, this only created a landmar in Firefox.


There’s a video of Sina demonstrating accessing the web using a screenreader here http://youtu.be/92pM6hJG6Wo  .


4. You have to learn to listen fast


I once realised when watching a DVD on my Playstation 3 that you can set the speed to 1.5x. Which means you can finish watching a 2 hour movie in only 1hour 30 mins and still understand what’s going on. “That gives me 30 minutes of life back!” I said excitedly at the time, and started to fry my brain listening to their speeded up chipmunk voices. Of course I couldn’t take the unnatural high speed pace, and changed it back to normal pretty quickly. But that’s nothing compared to the speed Sina Bahram listens to his screen reader (see the first 40 seconds of the video linked above).

Even at a relatively casual pace though, it’s a lot of information to take in at once and often I would have to go back and listen again to the page options I’m given.


5. Some popular websites are very difficult to use I was trying to use my screenreader to browse to the websites I use on a daily basis. Facebook, forget it. Despite articles telling me how accessible Facebook is http://www.facebook.com/help/141636465971794/   in theory, the JavaScript and infinite scrolling page caused my screenreader to slow my computer to a crawl before I’d even started. In visually-impaired user Robert William’s screencast  http://youtu.be/ymDf1CNMKzY, he has issues with Facebook too, so uses the much more accessible mobile site.


I also tried Amazon.co.uk   , but couldn’t get off the homepage which had over… wait for it…. 1000 links! But it was very difficult to navigate to the main search box to search for an item (I actually thought it was impossible for the first few times I listened to the page, before finding it nestled between two other options), and had absolutely no ARIA landmarks http://www.w3.org/WAI/GL/wiki/Using_ARIA_landmarks_to_identify_regions_of_a_page


Very disappointing. A quick chat though with a blind friend of mine convinced me to use the much more accessible mobile site which worked much better. Still, a very aggravating experience that I had to find and use the mobile site instead, something I wouldn’t have done without experienced user knowledge.


6. Link titles aren’t helpful

This is one of the most surprising things I found actually. I’d always assumed text added to a link using the “title” attribute was read aloud by a screen reader instead of the link’s normal anchor text, allowing you to write useful information about the link’s destination. But it turns out, it’s not used at all. Ever. Except the rare time there’s no link anchor text at all. So any supposed “useful” text written in a link’s title attribute is completely inaccessible to a screen reader.


So don’t assume you can get away with plain links like “click here” or “read more”, and provide descriptive title text, because it’ll never be heard.


I even asked HTML expert Jeffrey Zeldman http://www.zeldman.com/  on Twitter if there’s any reason to use the title attribute at all, and he replied “No! Do not use.”



[image: @silktide says "We're researching link title text, & how it's not used by screen readers. Is there any reason to use it you can think of?"

Zeldman says: "No! Do not use"]



7. Autofocus is annoying

Any website that steals the focus for an input box is going to confuse a blind user. Imagine reading through a page, when the JavaScript hijacks your screenreader’s voice and jumps it to somewhere completely different. You now have no idea where you are, if you’re at the top of the page, or at the bottom. You’re disorientated and could miss some really important content.


8. Being W3C valid means jack

I’ve always sought to make my websites pass the W3C validator, but even with a big shiny green tick, you’ve barely even begin making your site accessible. I know there’s only so much you can look for in an automated test, but there’s a vast amount you can do to make your website a better experience for blind people that can only be discovered by real user testing.


9. It’s easiest to navigate using headings

After hearing so much talk recently about ARIA landmarks, and the enthusiasm for semantic HTML5 elements, I expected there to be a way to navigate straight to different sections of a website quick and easy.

Especially with elements like
,



What I found myself doing mostly was either the laborious process of reading through each piece of content, or skipping to the next heading, which was much more reliable than searching for non-existent landmark roles. At least most web developers use headings correctly, which is why this is the only reliable method of navigation around a page.

Here’s a video of a guy navigating through webpages mostly using headings http://www.youtube.com/watch?v=AmUPhEVWu_E



10. Blind people are very good at keeping their rage under control

What I really mean by this last point is, it’s frustrating. Having to listen to a billion links as they whiz past your ears takes a lot of concentration, and is incredibly infuriating if a lot of them are unnecessary.


It’s clear many websites don’t cater for blind people, presumably just due to a lack of testing or maybe just the harsh reality that they don’t have enough time to cater for such a small portion of their audience. I think we’ve got a moral obligation however to help blind users navigate the web, and having experienced it myself, make it a less hideous experience.

No comments:

Post a Comment