Accessible Websites With Lotus Notes/Domino, presented at the BLUG day event, March 30th, 2010
Download as ODP, PDF1 like875 views
The document discusses web accessibility, emphasizing the importance of making content usable for individuals with disabilities. It highlights the Web Content Accessibility Guidelines (WCAG) and provides best practices for web developers, including the use of tables, metadata, and unobtrusive JavaScript. The author, Martin Leyrer, stresses that accessibility is an ongoing process rather than a one-time task.
Accessible Websites With Lotus Notes/Domino, presented at the BLUG day event, March 30th, 2010
- 1. Accessible Websites Martin Leyrer
- 3. What you are not going to hear
- 4. What is “Accessibility” (a11y)
- 5. Web Content A11y Guidelines (WCAG)
- 7. Tools
- 8. Wrap Up and Q&A
- 9. About Me Martin Leyrer – just “Martin” is fine :)
- 11. Notes Dev. & Admin. since 1995 (R3.1)
- 12. Web Developer even longer
- 13. Work for a large IT service organization
- 14. One large Client
- 15. The “NOT” Slide I am NOT a W3C spokesperson
- 16. I am NOT a WCAG editor
- 17. I am NOT certifying your site “accessible”
- 18. No definitive answers, only “best practices”
- 19. Focus on technical issues
- 20. What is “Accessibility” Accessibility make content accessible to a wider range of people with disabilities, including blindness and low vision, deafness and hearing loss, learning disabilities, cognitive limitations, limited movement, speech disabilities, photosensitivity and combinations of these.
- 21. Following these guidelines will also often make your Web content more usable to users in general.
- 22. Accessibility Is More! It's not about the “Disability Discrimination Act 1995” (UK), the “Americans with Disabilities Act of 1990” or any other law.
- 23. It's not making Websites “uglier”
- 24. It's not that hard
- 25. It's about enabling people to communicate!
- 26. Web Content Accessibility Guidelines Recommendations for making Web content more accessible
- 27. 1.0 was vague, hard to test
- 28. Succeeded by 2.0
- 29. Lot of content but very detailed
- 30. Lots of tests and best practices
- 31. Adaptable
- 32. Motivates to implement more
- 33. Standards Compliance Yes, it's still a topic
- 34. Using Xpages? Then you are fine.
- 35. “ Classic Web Apps.” have work to do DominoCompleteDoctype=1
- 36. Do the HTML, CSS, JS yourself
- 37. Content-Types! Test AND Fix!
- 38. Tables (1) Still using them for Layout?
- 39. You can and should use tables ...
- 40. … for data!
- 41. Supply some metadata and you are fine
- 42. Tables (2) <table summary="Description"> <caption>Searchresultlist</caption> <colgroup> <col width="0px" class="nowrap"> <col width="40%"> <col width="60%"> </colgroup> <thead> <tr> <th><span id="numhead" class="hide">Nr</span></th> <th>Headline 1</th> <th>Headline 2</th> </tr> </thead> <tbody> ......
- 43. The Good, The Bad and ... Javascript is not as “bad” as you may think
- 44. Don't rely on it
- 45. Xpages/Dojo -> Dijit Accessibility (a11y)
- 46. Ugly Code Have you read our <a href="javascript:window.open( 'terms.html', 'popup', 'height=500,width=400,toolbar=no' );">terms and conditions</a>?
- 47. Only Slightly Better Code ... Have you read our <a href="#" onclick="window.open( 'terms.html', 'popup', 'height=500,width=400,toolbar=no' ); return false;" >terms and conditions</a>?
- 48. Now This Code Is Fine ... Have you read our <a href="terms.html" onclick="window.open( 'terms.html', 'popup', 'height=500,width=400,toolbar=no' ); return false;" >terms and conditions</a>?
- 49. But This Code Would Be Better Have you read our <a href="terms.html" class="sidenote" >terms and conditions</a>?
- 50. window.onload = function() { var links = document.getElementsByTagName('a'); for (var i = 0, link; link = links[i]; i++) { if (link.className == 'sidenote') { link.onclick = function() { var href = this.href; window.open(href, 'popup', 'height=500,width=400,toolbar=no'); return false; } } } }
- 51. Unobstrusive Javascript Make your App. work without Javascript
- 52. “ Progressive Enhancement” afterwards
- 53. Don't write inline JS
- 54. Modify DOM after page has loaded
- 55. Unobtrusive JavaScript with jQuery
- 56. Page Structure Have you checked the Tab-sequence? tabindex="x" Keyboard Shortcuts
- 57. Navigation-Shortcuts for Screenreaders <span class="show_screenreader_only"><a href="#nav" title="jump to Navigation">to Navigation</a></span>
- 58. “ Soft” Topics Foreground/Background Contrast
- 59. Colours
- 61. “ Simple” Text
- 62. Links (1) Firefox & Web Developer Toolbar
- 63. Internet Explorer Developer Toolbar
- 64. Lynx
- 65. NonVisual Desktop Access (NVDA)
- 66. Coblis — Color Blindness Simulator
- 67. Colour Contrast Analyser FF Extension
- 69. Links (2) IBM Human Ability and Accessibility Center Developer guidelines for Web checklist
- 71. WAI-ARIA - Accessible Rich Internet Applications Suite
- 73. Wrap Up And Q&A Accessibility is not hard
- 74. But it is also never finished.
- 75. WCAG is your friend
- 76. (Do use unobtrusive JavaScript)
- 77. Thank You! Contact me: Email: leyrer@gmail.com
- 79. Twitter: @leyrer
Editor's Notes
- #6: Understanding accessibility requires an awareness of the special needs of multiple user groups, including people with disabilities and mature users with age-related disabilities. A person with a disability may encounter one or more barriers that can be eliminated or minimized by the software or Web developer, the assistive technology, or the underlying operating system software and hardware platform. The four main categories of disabilities are visual, hearing, mobility, and cognitive.
- #7: It's about god webdesign. It's about the willingness tp make your website available to everybody.