Web Standards and Accessibility


Published on

A presentation to colleagues and managers following the @media 2005 conference.

Published in: Design, Technology
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Web Standards and Accessibility

  1. 1. <web>standards</web> an introduction to web standards and accessibility
  2. 2. in the beginning, there was a man • Jeffrey Zeldman • Web Standards Project (WaSP) 1998 • Fights for standards that reduce the cost and complexity of development while increasing the accessibility and long-term viability of any site published on the Web • Works with browser and authoring tool manufacturers
  3. 3. stan*dard • n. something, such as a product or practice, that is widely recognised or employed, especially because of its excellence • adj. regularly used, widely available or supplied
  4. 4. why adopt web standards? • Device independence • Faster page loads • Lower bandwidth usage • Ease of maintenance • Improved user experience • Less lock-in to proprietary technology • Extensible • Accessibility
  5. 5. XHTML, CSS and the DOM • Standards call for a separation of structure, style and behaviour • XHTML defines the structure • CSS defines the style • The DOM (Document Object Model) controls behaviour
  6. 6. XHTML • eXtensible HyperText Markup Language <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> <html xmlns=“http://www.w3.org/1999/xhtml” xml:lang=“en”> <head> <title></title> <meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” /> </head> <body> <img src=“myPic.jpg” height=“10” width=“10” alt=“A picture of me” /> <p>I want to <em>emphasise</em> this point <strong>strongly</strong>.</p> </body> </html>
  7. 7. css • Cascading Style Sheets body {font:62.5%/1.6em Verdana, Arial, Helvetica, sans-serif; font-weight:normal; text-align:center; min-width:768px; background:#fff url("../images/bg_grad_blue.jpg") repeat-x;} p {background:transparent; padding:0 2em; font-size:1.2em;}
  8. 8. JavaScript (DOM) • JavaScript doesn’t kill websites, people with JavaScript kill ’em • Keep external • Degrade gracefully function doPopups() { if (!document.getElementsByTagName) return false; var links = document.getElementsByTagName("a"); for (var i=0; i &lt; links.length; i++) { if (links[i].className.match("popup")) { links[i].onclick = function() { window.open(this.href); return false; } } } } window.onload = doPopups;
  9. 9. accessibility “ Web accessibility is about designing sites so as many people as possible can access them effectively and easily, independent of who they are or how they “ access the net
  10. 10. who are we talking about? • 9 million people in the UK have a disability under the Disability Discrimination Act • It is not just the blind! • People with hearing difficulties • Motor difficulties • Cognitive difficulties • Many have a combination
  11. 11. visual impairments • Colour blindness • Mild vision impairment (larger font size, colour) • Moderate vision impairment (screen magnification, colour) • Blind / severe vision impairment (screen readers)
  12. 12. motor difficulties • Using a keyboard and mouse may be difficult • Alternative mouse and keyboard designs • Voice recognition • Use logical tabbing order • Offer user-defined access keys • Limit number of links • Clear target area negating fine mouse control
  13. 13. cognitive difficulties • These include dyslexia, memory impairments and attention deficit disorders • Keep the language clear • Avoid jargon • Use consistent navigation • Use graphical icons as navigational aids • Content should be well spaced, in a non-serif font and not fully justified • Dyslexic users prefer a beige background
  14. 14. implementing accessibility • Accessibility needs to be built in, not bolted on • Cannot rely solely on automatic testing tools • Guidelines are exactly that • Until standards are universal, accessibility will be a major challenge • Prepare for change
  15. 15. further reading • Designing with Web Standards – Jeffrey Zeldman (ISBN:0321616952) • Don’t Make Me Think! – Steve Krug (ISBN:0321344758) • http://www.webstandards.org • http://www.alistapart.com • http://delicious.com/thatstandardsguy/accessibility
  16. 16. any questions?
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.