Matt Radford

Messing with links since <blink>

Notes from #wcuk – Graham Armfield

Published on 

“A Beginners Guide to Web Accessibility”

What legislation do we need to be aware of?

(cf. Norwegian law as of July 1st – all sites must be accessible)

But which standards?

  • WCAG v2 – W3C published.
  • A (mandatory), AA (most pragmatic), AAA (impossible!)

AA is most pragmatic

Most important thing to make a site accessible?

“Enabling the web so that everyone can access its content when they want to and how they need to”

Accessibility is not black and white – can be fine for some but totally inaccessible for others

Accessibility can increase profitability.

More people are affected by poor accessibility that you think.

12m in UK have a recognised disability. 15m > 55 old.

So (roughly) 16.5m could benefit from good acc.

Not all about blind people. Blindness is a legal term, some registered blind can see things
1/12 have colour blindness.

2.6m people have difficulty using their hands.

Ida Aalen: websites must be navigable by keyboard, touch & mouse.

2m people have a hearing impairment.
2m people are dyslexic.
2.2m have memory difficulties.

Can’t make assumptions about who is visiting your site, e.g. a blind parent browsing for a skateboard for a child.
Impacts on your business; reputation.

People with disabilities represent a market worth £80bn in UK.
83% of PWD will not return to a business that meerts their needs.

Law

Equality Act 2010 (supplemanted DDA, except in NI). Specifically refers to websites, but does not define reasonable steps.

“No-one gets sued anyway”.

BMI sued in 2012 by RNIB as you couldn’t book a seat without a mouse.

Types of disability/impairment

Visual, Motor, Deafness & Hard of Hearing, Epilepsy, Cognitive (dyslexia, autism, ADHD).

Mitigating impairment

Lots of people with accessibility needs use IE because it has good accessibility built in, same with Firefox. Not Chrome.

IE, FF users can specify colours
Adjust text size without zooming

Absolute pixel values cannot be adjusted in IE.

Assistive technology

Glasses
Zooming in
JAWS screenreader
Dragon voice recognition

– voice recognition built into OS X, iOS

Refreshable braille display – Wow
Motor switches controlled by feet, shoulders, etc

JAWS costs $895!
Braille display – $4k!!!
Open source srceenreader – NVDA

– Also VoiceOver in iOS and OS X – plug and play with braille displays
– https://www.apple.com/uk/accessibility/osx/voiceover/
– https://www.apple.com/uk/accessibility/ios/voiceover/

iOS is the tool of choice for Blind people.

Android version of VoiceOver is called TalkBack, but its not as good.

WordPress accessibility is influeced by:

  • Theme devs
  • Plugin devs
  • Content authors

75% websites have some sort of accessibility issue.

Every accessibility step you take will make life easier for someone

Simple things to do:

  • alt text images
  • descrbe what image shows or represents
  • if a link, describe destination
  • if decorative, leave blank (use alt=””) – screen readers know to ignore
  • WP will put a blank alt tag in if content picker is used.

Links

Use “my blog post: read more” not my blog post: “read more”
– means links in screen reader will be appropriate, not just a bunch of “read more”s.

Use headings properly

– semantics
– used as a nav mechanism by screen readers – signpost content
– HTML5 H1s?
– – screenreaders cannot cope with this

Keyboard focus and operation.

– focus should be easily visible
– .hover & .focus together?
– tab order should make sense (less of an issue with WP sites)
– ensure all functionality accessible by keystrokes
– test your own website using tab, arrow and spacebar

Text

– contrast
– allow resizing without breaking the layout
– don’t use fully justified text – makes it a lot harder to read, esp. for thos with dyslexia and congnotive impairments
– Dyslexic-appropriate fonts?

Forms

– use labels for input fields, link id to input field
– important for screenreaders: if no label, they will get confused
– – how does Gravity Forms cope with this?
– don’t use captchas
– generate appropriate errors

WAI-ARIA

– labelling areas with roles

It’s hard to retrofit accessibility.