Slides in PowerPoint format - Intelligent Internet Information

Download Report

Transcript Slides in PowerPoint format - Intelligent Internet Information

(X)HTML Standards and
Accessibility:
An Introduction
Steven C. Perkins, J.D., M.L.L
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.styleshe
ets
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/stateLawAtGlanc
e.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 protected]]
• http://www.cssdiscuss.org/mailman/listinfo/cs
s-d
• 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/D
efault.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:07357-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/TECH
SPT/tutorials