An Introduction Steven C. Perkins, J.D., M.L.L (X)HTML Standards and Accessibility:
Why Care about Code Standards and Accessibility? • As the WWW develops, non-standard web pages will not be fully integrated into the Semantic Web and Web Services. • As browsers more fully implement the code standards, pages will not display as intended if they are not coded to the standards. • Hundreds of millions of persons throughout the world have physical disabilities that cause them difficulty when using the WWW.
Why Care? (cont.) • People differ in their learning and web usage styles. Attention to accessibility broadens the reach of your web pages. • Various levels of Accessibility are being required by law.
The World Wide Web Consortium • http://www.w3.org/Consortium/ • Started in 1994 • Headed by Dr. Timothy Berners-Lee • Based at MIT and affiliated with CERN, DARPA, INRIA, KEIO and ERCIM. • Develops the standards defining the web protocols and languages. • Develops tools and applications to implement the standards.
The W3C Code Standards • HTML 4.01-Transitional; Strict; Frameset • XHTML 1.0-Transitional; Strict; Frameset • XHTML 1.1-Transitional; Strict; Frameset • CSS Level 1 • CSS Level 2
What is Standards Compliance? • Follows the W3C requirements for the version of HTML or XHTML used in the page. • Follows the W3C requirements for the version of Cascading Style Sheets, CSS 1 or CSS2, used in the page. • Passes the tests of the W3C (X)HTML Validator and the W3C CSS Validator. • http://validator.w3.org/ and http://jigsaw.w3.org/css-validator/
Well Formed Pages • The following are needed to have a well formed (X)HTML page: • A Document Type Definition • A character encoding • A proper (X)HTML code structure
Proper (X)HTML Code Structure • A proper (X)HTML code structure: • <Doctype Declaration> • <html> • <head> • <title></title> • <meta>(if used) (character encoding can go here) • <style></style>(if used) • </head> • <body></body> • </html>
Testing for Valid Code • The easiest way is to write valid code, either by-hand or using HTML-Tidy, as a stand alone application or as part of HTML-Kit. • Most commercial web coding applications do not produce valid code. • Several do have extra programs to help with validity.
How to Test • Open your web browser and go to http://validator.w3.org/ You can enter a web address or upload code to the validator. • The validator will test your code against the DTD of the Doctype Declaration that starts your code. • If either the Doctype Declaration or the Character Encoding are not specified, the validator can not validate the page.
Working with the Validator • When you test the page you will either pass or fail. • If you pass, you get no information from the test. • If you fail, you get a list of errors with an explanation, and the complete source listing for your page. • Save the result.
Working with TIDY • From the Validator page, you can select Tidy-Online. You use it like the Validator and it reformats your code to meet the XHTML 1.0T DTD. • You need to save its result and run it through the Validator. • Repeat the process until you have a valid page.
Testing CSS • CSS can be specified in three locations: as a separate page called from the (X)HTML page; as a <style></style> section in the head of the document code; or as an individual style statement on an element. All combinations are acceptable. • The best practice is to have a separate style page.
The CSS Validator • The CSS Validator can be accessed directly or from the Validator page. • It is used in the same way as the code Validator: type in a page address or uplaod a page with CSS. • You will get the same type of result as from code Validator. • Save the result and use Tidy to correct it. • Once both (X)HTML code and CSS pass the validation tests you are ready to look at Accessibility issues.
Issues to Consider • Use of the Document Type Declaration causes different responses in each browser. There is a page that details which Doctype Declarations put browsers into Standards compliance, almost standards compliance and not in compliance modes. • What browsers are used by visitors to your site may control whether you use transitional or strict Doctypes and whether you need to support 4.X series browsers.
Issues (cont.) • Use of tables for layout is allowed by W3 standards. You must not use the markup for Data Tables in Layout Tables. • Be sure the page content linearizes, i.e., that it can be read if viewed in LYNX text mode.
(X)HTML and CSS Resources: • The W3 specifications at http://www.w3.org/ • USENET newsgroups: • alt.html, alt.html.critique, alt.html.tags and comp.infosystems.www.authoring.html comp.infosystems.www.authoring.stylesheets
Books: • Elizabeth Castro, HTML for the World Wide Web: with XHTML and CSS, 5th ed.,Peachpit Press, ISBN:0-321-13007-3 • Eric Meyer, Eric Meyer on CSS, New Riders, ISBN:073571245X • Many other titles are available.
Facts about Disabilities • Blindness and Low Vision affects 15 million people in the USA. • They use “Screen Readers” and keyboard navigation. • Motor disabilities, SPI, CP, MS, account for 1.2 to 1.5 million persons in the USA • They use assistive technology and can’t use a mouse for navigation
Facts (cont.) • Deafness and loss of hearing, 22 million persons in the USA. • Can’t hear audio only materials or soundtracks to film content. • Source: WEBAIM Disability Fact Sheet, http://www.webaim.org/info/factsheet.htm
W3C Web Accessibility Initiative • WAI home page: http://www.w3.org/WAI/ • Started in 1997 • Develops tools for constructing and testing accessible web pages. • Develops Web Content Accessibility Guidelines, Checklists, and Techniques • http://www.w3.org/WAI/Resources/#gl
Other WAI Activities • Authoring Tool Accessibility Guidelines, Checklists, and Techniques. • User Agent Accessibility Guidelines, Checklists, and Techniques. • XML Accessibility Guidelines • Accessibility features of SMIL, SVG, CSS, and HTML 4. • Evaluation and Repair Tools • http://www.w3.org/WAI/Resources/#gl
Other Accessibility Initiatives • United Nations, Rule 5 of the Standard Rules on the Equalization of Opportunities for People with Disabilities. • European Union, Accessibility of Public Websites, Council Resolution (2001). • UK: Disability Discrimination Act of 1995: Parts III and IV; and, the Special Educational Needs and Disability Act of 2001.
Other Accessibility Initiatives • Australia, Disability Discrimination Act of 1992. • New Zealand, New Zealand Government Web Guidelines Version 2.1. • Canada, Government of Canada Internet Guide, section on Universal Accessibility. • USA: Rehabilitation Act of 1986, Section 504, and Section 508 Standards for Electronic and Information Technology (1998); Americans with Disabilities Act (1990) and Telecommunications Act of 1996, Section 255.
Website Accessibility in the USA • Prior to the development of graphics intensive computer applications, accessibility to the Internet was enabled by using character based applications with adaptive equipment.
Website Accessibility in the USA • The rise of the WWW and the development of variant HTML dialects by commercial enterprises, combined with the move to graphical applications, caused a breakdown in the accessibility of the Internet. • The City of San Jose court case, brought under the ADA, caused a change in the regulatory climate in the USA and brought website accessibility to the attention of a larger audience. • DOJ rules that ADA accessibility requirements apply to web pages, 9 Sept 1996.
Website Accessibility in the USA • With the enactment of the Rehabilitation Act Amendments of 1998, Section 508 became the principal law regarding government websites and websites of those doing substantial business with the government. • Based of WACG 1.0 Priority Level 1 with some additional requirements. • http://www.section508.gov/
US States and Accessibility • A list of all state laws, standards and regulations regarding website accessibility is at the website of the Information Technology Technical Assistance and Training Center, http://www.ittatc.org/laws/stateLawAtGlance.cfm
State Requirements • States have based their requirements on the WAI WCAG, on ADA, and on Section 508. • Some states apply the standards to all entities financed in full or part with public funds. • Educational websites were specifically included in the UK’s SENDA regulations.
Issues to Consider • Colors should be used that will not confuse colorblind users. • Tabindex and Accesskey coding should be used to accommodate those who can not use a mouse. • Skip navigation links should be provided so those using screen readers do not have to go through long lists of links to get to an item of interest.
Issues (cont.) • Alt text should be used for all informative images. Null alt tags are used for spacer gifs and the like. • Frames, image maps, and applets should be avoided. • The title attribute should be used with the above to enhance use. • Fieldset, summary, and labels should be used with forms.
More Issues • Layout tables do not have labels. • Data tables use headers and summary to allow linearized reading. Axis and id are used with complex data tables. • Use CSS to control the order of display and place navigation lists at the bottom of the code page. • Provide text or RTF versions of PDF files.
More Issues (cont.) • Provide transcripts of audio materials and captioning for video materials. • Allow the user to control the size of text by using relative sizes or providing a style switcher. • Provide an explanation of the accessibility features of the website.
Accessibility Compliance • Depends on the country and the standard adopted. • WAI WCAG Level I, II, or III. • USA Section 508 is a combination of WCAG Level I and additional requirements.
Checking Accessibility • Checking for compliance involves using testing tools and subjective interpretation. • Bobby, http://bobby.watchfire.com/bobby/html/en/ • Cynthia Says, http://www.cynthiasays.com/ • Wave 3.0, http://www.wave.webaim.org/index.jsp
Testing Accessibility • Use the standard accessibility applications for your platform to test for compliance. • Use LYNX to view the page and determine if it is useable. • Turn off colors and view the screen in black and white. • Turn off sound and see if you can still navigate and understand the page.
Testing (cont.) • Use JAWS, IBM Home Page Reader, EMACSpeak, etc., to use the page. • Have disabled users test the page.
Resources • For (X)HTML coding: • http://www.w3.org/ • For CSS in addition to the above: • css-discuss [email@example.com] • http://www.css-discuss.org/mailman/listinfo/css-d • evolt.org-- http://www.evolt.org/
Accessibility Resources • WAI at http://www.w3.org/WAI/ • Section508: The Road to Accessibility: http://www.section508.gov/ • The webaim-forum at http://www.webaim.org/ • ITTATC at http://www.ittatc.org/laws/stateLawAtGlance.cfm • Connecticut Website Accessibility Committee: • http://www.cmac.state.ct.us/access/Default.htm
Books • Joe Clark, Building Accessible Websites, New Riders, 2002, ISBN:0-7357-1150-X. • Jim Thatcher, et.al., Accessible Websites, Glasshaus, 2002, ISBN:1-904151-00-0. • Jeffrey Zeldman, designing with web standards, New Riders, 2003, ISBN:0-7357-1201-8.
On-line Tutorial • I think this is one of the best on-line tutorials on accessibility coding: • Jennifer Foltz, ADA Compliance Workshop Part 1, http://www.oznet.ksu.edu/agronomy/TECHSPT/tutorials