Web Site Accessibility

1
Web Site Accessibility

• Ian Senior
• November 2004

2
Aim of talk

• To give an overview of the problem
• To describe the legal situation
• To show some good and bad practice
• To point to some help

3
What is Accessibility?

• Web content can be obtained and understood by as
  many potential viewers as possible, regardless of
  the user agent they employ or the constraints
  under which they operate.
  University of Buffalo NY State.

4
The problem

• 1 in 10 visitors is disabled in some way. Access
  is impeded by not allowing for people
• with forms of colour-impaired vision
• slow modems and lines
• turning off graphics
• who find it hard to read long sentences

5
The problem (2)

• who only have a 640 x 480 monochrome screen
• unable to read small fonts
• who prefer to use Linux
• who cannot use a mouse
• who cannot hear
• oh, yes, and people who cannot see!

6
Ways to use the web

• Remember that viewing sites with IE is not the
  only way to use the web. Think of technologies
  like
• Synthetic speech (screen reader)
• Paper printout
• Dynamic braille
• Keyboard only
• Text-mode browsers
• Web-enabled cars
• Mobile phones and PDAs

7
The legal situation

• The 1995 Disability Discrimination Act (DDA) is
  relevant.
• Since 1st September 2002, the Special Educational
  Needs and Disability Act (SENDA) has been in
  force. This act became part IV of the DDA and
  bring higher and further education under the
  protection of this legislation.

8
What does SENDA say?

• SENDA makes it unlawful to
• Treat disabled people less favourably than their
  non-disabled peers, for a reason relating to
  their disability
• Fail to provide reasonable adjustments for
  disabled students.

9
SENDA
SENDA seeks to provide disabled students with
access to all the facilities and services of
FE/HE organisation. SENDA is an anticipatory
Act, meaning organisations have to adjust their
working practices for disabled people regardless
of whether they are presently at the
organisation or not. This means web sites have
to be accessible to all visitors and not just
registered users. This also applies to any
teaching documents.
10
Australian legal case

• Maguire vs Sydney Olympic Games
• Failed to provide accessible site
• Defence of unjustifiable hardship rejected
• 20,000 fine
• Case could be used in UK
• There have been no legal test cases in the UK so
  far.

11
Poor excuses for non-compliance

• Sorry, I am not interested
• We don't have any disabled people
• We don't have the time or expertise
• It's not my problem, I'll wait until everyone
  else does something
• My system won't let me
• No-one else is fixing their sites
• I don't know what to fix

12
How not to help your visitors
13
Whos page was that?
14
Web Standards

• World Wide Web Consortium (W3C). They develop
  interoperable technologies toLead the web to
  its full potential as a forum for commerce,
  information, communication and collective
  understanding

15
Web Accessibility Initiative (WAI)

• W3C programme to
• Ensure web technologies support accessibility
• Developing guidelines for accessibility
• Developing tools to evaluate and facilitate
  accessibility
• Conduct education and outreach
• Co-ordinating web design with R D

16
WAI checkpoints

• WAI have produced a list of checkpoints for
  web content accessibility guidelines (WCAG) 1.0
• This is a hierarchical structure consisting of
  three priority levels
• Priority 1 (level A)
• Priority 2 (level AA)
• Priority 3 (level AAA)

17
Priority 1

• This is the minimum level of accessibility web
  developers should be working towards. While this
  removes some accessibility barriers, many
  disabled students would still be excluded from
  using a site.e.g Use Alt tags on images

18
Priority 2

• Achieving this level will remove more barriers to
  accessibility although some students will still
  be excluded.
• e.g. Link form elements with their labels

19
Priority 3

• Satisfying this highest level will provide access
  for the vast majority of disabled people.
• e.g. Separate adjacent links with more than white
  space

20
Aim high

• What priority level should you achieve?
• FE/HE institutions should regard priority 1 as
  the starting point for a web site.
• Priority 2 is the standard level expected
• Priority 3 is the ideal level

21
Basic web design issues

• It is not hard to get the simple things right
• Be realistic don't make technology assumptions
• Don't be lazy and do it all with images
• Don't use non-intuitive navigation aids
• Make your site consistent
• Use simple language
• Provide text versions
• Leave control of appearance to CSS
• Structure your web pages correctly (H1 tags etc.)

22
Make consistency rules

• Make house rules and stick to them. Keep your
  pages consistent.
• Create a visual identity that holds all your
  pages together. This will help everyone.
• Decide on a technology and make everyone use it.
  Don't mix Flash and XML and PDF in the same small
  site.

23
Dyslexia and cognitive disabilities

• Write short sentences
• Use consistent layout
• Don't flash at people or use multi-coloured
  backgrounds
• Keep sentences below 20 words
• Use white space
• Say one thing at a time

24
XHTML

• Current standard for HTML and is a form of
  XML(eXtensible Markup Language)
• Comes in 3 versions
• Strict document type definition (DTD)
• Transitional DTD
• Frameset DTD
• The strict DTD will produce a web site that
  complies to all three priority levels, the other
  two make compliance very difficult above level 1

25
HTML Standard page

• Give DOCTYPE DTD
• State document language
• If table used in page design use an empty summary
  tag
• Include skip navigation link
• Use headers for structure only style through
  CSS if necessary
• Consider a CSS approach to page layout

26
More HTML

• TITLE attribute
• describe a link
• Acronym element
• Abbreviation element
• ACCESSKEY
• TABINDEX attribute
• cycle logically through links

27
Coding Accessible Graphics

• Use alt attribute on all images
• Spacer image used in design only alt
• Graphics used as bullets alt
• Information graphics should have sensible alt
  text
• Use longdesc attribute for complex images e.g.
  graphs, detailed images. Alternatively link image
  via D text

28
Accessible Tables

• Make your table as simple as possible
• Add summary of information for data tables
• Associate table column row headings with cells
• Attributes include TH, ID, headers, scope
• THEAD, TBODY, TFOOT also available
• Give your table a caption
• Check readability when linearized using Lynx or
  Opera

29
Accessible Forms

• Use clear language
• Use form accessibility tags
• For, ID, name, label,
• Group related items together
• fieldset, optgroup and legend
• Add hints to text boxes

30
Tools to aid compliance

• Evaluation tools
• analyse pages and produce a report
• Repair tools
• Identify and help to fix page problems
• Filter and transformation tools
• Assist web users by modifying a page or
  supplement assistive technology or browser

31
Opera Accessibility

• When developing a site it is helpful to see how
  accessible your new site is. A very quick way is
  to use Opera. This has accessibility options
• Turn on/off graphics
• Turn on/off CSS author user versions
• Zoom in on text
• Turn on/off JavaScript
• Linearize tables

32
WAVE software

• Allows you to add a button to the links bar of
  your browser.
• Clicking the button opens up WAVE which examines
  the page for accessibility. Problems are
  indicated by error images.

33
WAVE in action poor site
34
WAVE in action good site
35
Cascading style sheets

• Allow for - font family serif, sans-serif,
  cursive - font size tiny or huge - colour,
  background and foreground - white space around
  objects - control link format - borders around
  things - to be controlled in one place- allow
  the user to override it.
• Not all browsers implement CSS properly (Netscape
  4).

36
CSS Accessibility

• Aids accessibility of a site by
• Used to separate style from structure
• Can construct page

37
With CSS
38
Without CSS
39
What are we doing?

• We use XML to mark up our pages
• We can deliver pages in different forms PDF,
  print ready, XML, HTML
• We provide a text only selection (same
  information, different view)
• We are developing an automatic accessibility XSLT
  style sheet to check our content before it goes
  online.
• We are developing methods to transform Word
  documents into XML.

40
Conclusions

• Accessibility is all about people being able
  to obtain information regardless of their
  circumstances.
• Legal requirement through SENDA
• Write W3C compliant code
• Use XHTML strict DTD as your starting level
• Aim for priority 2 as a standard
• Use CSS for site style
• Use the validation tools from W3C and others to
  check site compliance.

41
Useful sites

• Web Accessibility Initiative http//www.w3c.org/WA
  I/
• W3 Consortium http//www.w3c.org
• TechDis (JISC Funded) http//www.techdis.ac.uk/
• RNIB http//www.rnib.org.uk/digital/
• Check your understanding of colour blindness
  http//vischeck.com/

42
Validators other tools

• Site Viewing Tool http//www.anybrowser.com/sitevi
  ewer.html
• HTML Tidy Tool http//www.w3c.org/People/Raggett/t
  idy/
• HTML Validatorhttp//validator.w3.org/
• CSS Validator http//jigsaw.w3.org/css-validator/
  

43
Checking tools

• Wave http//www.wave.webaim.org/index.jsp
• Bobby http//bobby.watchfire.com/bobby/html/en/ind
  ex.jsp
• Aprompthttp//aprompt.snow.utoronto.ca/
• Vischeck http//www.vischeck.com/vischeck/vischeck
  URL.php
• Lifthttp//www.usablenet.com/

44
Talk found at

• http//users.ox.ac.uk/ian/PDF and PowerPoint
  versions available