Fashion, apparel, textile, merchandising, garments

1. Accessibility Basics on creating accessible websites Accessibility Seth Duffey [email_address] presentation for MAG Telecommunications Advisory Group 1

2. Accessibility What is accessibility? “ Accessibility refers to ensuring that webpage content is accessible, ie. ensuring that content can be navigated and read by everyone, regardless of location, experience, or the type of computer technology used. Accessibility is most commonly discussed in relation to people with disabilities, because this group are most likely to be disadvantaged if the principles of accessible Web design are not implemented. Failure to follow these principles can make it difficult or impossible for people with disabilities to access Content.” http://www.murdoch.edu.au/admin/policies/murdochnet/glossary.html#accessibility 2

4. Accessibility Accessibility Standards W3C Web Accessibility Initiative (WAI): http://w3.org/WAI/ These guidelines explain how to make Web content accessible to people with disabilities. The guidelines are intended for all Web content developers. The primary goal of these guidelines is to promote accessibility. However, following them will also make Web content more available to all users, whatever user agent they are using… Section 508: http://www.section508.gov/ Section 508 (of the US 1974 Rehabilitation Act) requires that Federal agencies' electronic and information technology is accessible to people with disabilities. ADA: http:// ada.gov / 4

5. Accessibility W3C WAI Priority 1 Checklist http://www.w3.org/TR/WCAG10/full-checklist.html 1.1 Text Equivalent for non-text elements 2.1 Information can be conveyed without color 4.1 Identify changes in natural language 6.1 Document can be read without style sheets 6.2 Text equivalents to dynamic content are updated when dynamic content changes 7.1 Avoid causing screen flicker 14.1 Use clearest and simplest language 1.2 Provide redundant links for server-side image maps 9.1 Provide client-side images maps instead of server-side image maps 5.1 For tables, identify row and column headers, use markup to associate cells 5.2 For tables with 2 or more logical levels use markup to associate data and header cells 12.1 Title each frame (if frames are used) 6.3 Ensure pages are useable when scripts, applets, etc are not supported or turned off 1.3 Provide audio description for multimedia presentation 1.4 For any time-based multimedia presentation synchronize equivalent alternatives 11.4 If it is not possible to create an accessible page, provide a link to an alternative page 5

7. Conformance Level "A": All Priority 1 checkpoints are satisfied; Conformance Level "Double-A": All Priority 1 and 2 checkpoints are satisfied; Conformance Level "Triple-A": All Priority 1, 2, and 3 checkpoints are satisfied; W3C Conformance Accessibility 7

10. http://www.delorie.com/web/lynxview.html As a standard browsers sees Accessibility Testing As Lynx sees What it is like to “read” your website? Try Lynx: 10

11. Accessibility Accessibility testing Bobby testing for WAI 1 and Section 508: http://bobby.watchfire.com/bobby/html/en/ Watchfire WebXACT: http://webxact.watchfire.com/ (more in-depth test) “ Cynthia Says” http://www.contentquality.com/ 11

12. Use your website with images turned off? Use your website with JavaScript disabled? Use your website with Cookies disabled? Use your website with Style Sheets disabled? Use your website without applets (like Flash)? Use your website with a text reader? Accessibility Ask Yourself… Can you? 12

13. Accessibility Solutions – Cascading Style Sheets (CSS) Developing a website using CSS can solve almost all accessibility issues. 13

14. Accessibility What are CSS? Cascading Style Sheets, style sheets when attached to documents describe how the document is displayed or printed, e.g. a CSS sheet is attached to an HTML document, to influence its layout when accessed via a browser. CSS supports cascading, i.e. a single document may use two or more style sheets that are than applied according to specified priorities (=cascade). CSS separate content from layout 14

15. Accessibility Why CSS? Support: Firefox, Internet Explorer 6, Netscape Navigator 7, Mozilla, Opera, and Safari fully support CCS1 and CSS2* Accessible: Screen readers will see your HTML without the layout leaving the result text only Faster: Pages display faster because CSS is cached and the majority a site’s HTML pages code are content not layout (no complex tables). Simpler Code: HTML written for CSS can be simple and take advantage of markup tags like H1, UL, P, etc. More Flexible: One change to a CSS file can change entire website. One Version: Since content is separated from layout a text only version always exists. Excellent Presentation on CSS: http://stopdesign.com/present/2004/sydney/beauty/ 15

16. Accessibility Validation XHTML Create pages that are XHTML compliant. Case for XHTML: http://www.kurafire.net/articles/case-for-xhtml Test that your code is valid: HTML Validator: http://validator.w3.org/ CSS Validator: http://jigsaw.w3.org/css-validator/ 16

17. CSS Help www.w3.org/TR/REC-CSS2/cover.html www.blooberry.com/indexdot/css/ www.mako4css.com/ Example Layouts: www.bluerobot.com /web/layouts CSS Articles www.alistapart.com/topics/css www.positioniseverything.net / www.vertexwerks.com/tests/sidebox www.meyerweb.com/eric/css/edge Inspiration www.csszengarden.com www.cssvault.com www.cssbeauty.com Box model hack www.tantek.com/CSS/Examples/boxmodelhack.html Why CSS? www.macromedia.com/devnet/mx/dreamweaver/articles/why_css.html CSS Validator jigsaw.w3.org/css-validator/validator-uri.html CSS1 Support Chart devedge.netscape.com/library/xref/2003/css-support/css1/mastergrid.html xhtml www.w3.org/TR/2000/REC-xhtml1-20000126/ Free CSS Editor www.bradsoft.com/topstyle Accessibility CSS Links 17

18. Accessibility Questions? This is a basic overview presentation of Accessibility issues and CSS Seth Duffey [email_address] Questions? 18