Title: Better Accessibility with Fusebox 4
1Better Accessibility with Fusebox 4
- Sandra Clark
- slclark_at_shayna.com
- http//www.shayna.com
2Overview
- Accessibility and Speech Browsers
- 508 and WAI
- Survey
- Stop Designing for the Browser
- The Good and the Bad of Fusebox
- A Better Way
- Exceptions to the Rule
3Why are Accessible Web Sites Important
- Accessible Web Sites are important for all types
of web sites. - 15 30 of the general population have
functional limitations that can affect their
ability to use technology products
(http//isoc.org/briefings/002) - Accessibility helps those who
- Cannot use a mouse (only have access to
keyboards) - Are blind
- Have other vision impairments
- Are Deaf
- Are Color Blind.
4What is 508 and WAI
- Section 508 of the Rehabilitation Act Amendment
of 1998 requires that US Federal Agencies and
covered entities must make their electronic
technology and information accessible to people
with Disabilities - WAI (Web Accessibility Initiative) by the World
Wide Web Consortium (W3C) - WCAG (Web Content Accessibility Guidelines)
- Deals with the authoring of web standards.
5The United States isnt Alone
- Other countries have or are adopting and require
adherence to either the WCAG or something similar.
- Ireland
- Italy (WCAG)
- Luxemburg
- Netherlands
- New Zealand
- Portugal (WCAG)
- Singapore
- Spain (WCAG)
- Sweden
- United Kingdom (WCAG)
- Australia (W3C WCAG)
- Canada (W3C WCAG Priority 1 and 2 checkpoints)
- EU (W3C WCAG Priority 1)
- Belgium
- Denmark
- Finland
- France (WC3 WCAG)
- Germany
- Greece
- Japan
6Survey
- In December 2002, I surveyed the entry home pages
of 204 Federal Cabinet and their Departments. - These are the entities REQUIRED to comply with
Section 508 - Validated with a number of readers
- Bobby (Online 508 and WAI Validator)
- Simply Web 2000 (Free Speech Browser)
- pw Web Speak (Free, discontinued Speech Browser)
- IBM Home Page Reader (Speech Browser)
- Lynx (Text Only Browser)
7Survey Results
- Out of 204 Web Sites Surveyed
- Bobby Approved
- 77 passed (38)
- Simply Web 2000
- 5 passed (2)
- pwWebSpeak
- 50 passed (25)
- IBM Home Page Reader
- 58 passed (28)
- Lynx
- 182 passed (89)
8GUESS WHAT?
- LYNX IS NOT A Speech Browser!
- Having something readable in Lynx is not
indicative that it will be readable in a Screen
reader.
9Validating Accessibility
- Validating Accessibility is like Validating a Web
Site. - Use Validation Testing
- Bobby or UsableNets Lift
- Different Speech Browsers
- But who has the time and money to test to make
sure it works everywhere? - This is what happens when people design sites for
the letter of the law rather than the spirit.
10Designing to the letter of the law
- MEANS
- The HTML passes Bobby.
- It works in the one screen reader you tested for
and thats the one you tell everyone to use. - If you get sued, you can point to the above two
points and hope its enough for the judge.
11Designing to the Spirit of the Law
- MEANS
- That the content of your web site or application
can be read and understood no matter what type of
browser is being used. - That all disabled persons have the same type of
access to your web site as able bodied people. - You dont have to worry about convincing a judge
because there is no reason for a lawsuit based on
accessibility issues.
12How can we do that?
- JavaScript is only used for nice-to-haves and the
absence of it does not diminish the usability of
your site. - This covers DHTML. If you must have a DHTML menu
have a link at the top letting people use another
menuing system. - Plug ins must be accessible or there must be
equivalent content in an accessible format. - The most important thing we can do is
13Stop Designing to the Browser
- Remember the browser wars?
- Marquee and Blink?
- I remember signing a petition asking Netscape and
MS to make their browsers work with standards - They did (MS IE 6, Netscape 7 and Opera 6) are
compliant. - Guess What?
- We arent taking advantage of this
- We still design for the browser.
- DESIGN TO THE STANDARD
14Design to the Standards
- What "Standards"?
- When we speak about "standards" for the Web, we
mean - Structural Languages
- XHTML
- Extensible Hypertext Markup Language 1.0 and 1.1
- http//www.w3.org/TR/xhtml1
- http//www.w3.org/TR/xhtml11
- XML
- Extensible Markup Language 1.0
- http//www.w3.org/TR/2000/REC-xml-20001006
15Design to the Standards (cont)
- Presentation Languages
- CSS
- Cascading Style Sheets Levels 1 and 2
- http//www.w3.org/TR/REC-CSS1
- http//www.w3.org/TR/REC-CSS2
- as well as emerging standards, such as those for
television and PDA based browsers.
16Why design to the standard
- Designing and building with these standards
simplifies and lowers the cost of production,
while delivering sites that are accessible to
more people and more types of Internet devices.
Sites developed along these lines will continue
to function correctly as traditional desktop
browsers evolve, and as new Internet devices come
to market. - http//www.webstandards.org
17Using Nested Tables for Layouts
- Most of us use tables for layout.
- This is not what tables in HTML were designed for
- By using tables for layouts, we are not only
limiting ourselves, but we are limiting the ways
in which our work can be utilized. - Tables are limiting, the web is designed to be
limitless.
18Separating Content from Presentation
- Content is the most important aspect of the web.
- What you get is more important than how you see
it. - Separating Content from Presentation gives you
- Increased accessibility
- Improved Performance
- Easier initial work and easier maintenance.
19CSS and Positioning
- By using Cascading Style Sheets for positioning
and design, we are truly separating content from
presentation. - All Major Browsers (IE 6, Netscape 7, Opera 6)
support CSS-2 (which includes Positioning). - XHTML requires CSS for all presentation in its
strict format. - CSS-2 allows different style sheets to be
employed for different media. - Change the way your page looks on a printer
without changing the page.
20Fusebox 4 and Accessibility
- The Fusebox philosophy encourages separation of
business logic from presentation logic which is
good. - With CFMX, Macromedia is also encouraging
separation of the two tiers with CFCs. - Makes design patterns like MVC easy!
- With the new version of Fusebox 4, layouts are
fully under the architects control. - Fully allows for separating presentation and
content which are necessary for fully accessible
and compliant web sites
21Are the newer browsers truly compliant?
- Most Newer Browsers are compliant
- IE6, NS7, IE5Mac, Opera 6, Konqueror (Linux), IBM
Web Browser - When writing to the standard, make sure you tell
the browser to go into standards mode though. - In order to deal with both old tag soup written
to old browser quirks and new standards-compliant
pages, Mozilla (and Mozilla-based browsers, such
as Netscape 6, Netscape 7, Chimera, Galeon and
Beonex), Mac IE 5 and Windows IE 6 have two
layout modes. In one mode the layout engine
attempts to comply with W3C Recommendations. In
the other mode the layout engine tries to mimic
old browsers. In Mozilla these modes are known as
the Standards mode and the Quirks mode
respectively
22How to force Browsers into Standards Mode
- Mozilla, Mac IE 5 and Windows IE 6 all use
doctype sniffing in order to decide between the
standards mode and the quirks mode. This means
that the mode is picked based on the document
type declaration (or the lack thereof) at the
beginning of an HTML document. - Full list can be found at
- http//www.hut.fi/hsivonen/doctype.html
23Standards Forcing DocType Declarations
- HTML 4.x Strict
- "http//www.w3.org/TR/html4/strict.dtd"
- HTML 4.01 Transitional
- Transitional//EN" "http//www.w3.org/TR/html4/loos
e.dtd" - XHTML 1.0 Strict (no xml Declaration)
- Strict//EN" "http//www.w3.org/TR/xhtml1/DTD/xhtml
1-strict.dtd" - XHTML 1.0 Transitional (no xml Declaration)
- Transitional//EN" "http//www.w3.org/TR/xhtml1/DTD
/xhtml1-transitional.dtd" - Using an xml Declaration with XHTML will Force
IE6 into Quirks Mode
24Layouts and Fusebox 4
- Content from a fuseaction can be captured into a
content variable. -
- wme /
-
-
-
-
-
25Displaying content variables
- Many ways to display your content.
- Have a layout file in the fusebox.xml.cfm file.
-
-
-
-
-
-
-
26In lay_default.
27What about Netscape 4?
- Browser Statistics from thecounter.com shows that
Netscape usage has gone from 5.4 usage in
11/2001 to 2.3 in 11/2002 - Netscape and MSIE 4 and older editions do not
support CSS 2.
28Browser Stats 11/2001 11/2002
29What about Flash?
- Macromedia is pushing CFMX and Flash MX as a Rich
User Interface. - Flash MX does have some accessibility built in.
- Flash Player 6 now uses the Microsoft Active
Accessibility (MSAA) API to exchange information
with a web browser that supports MSAA, which
channels information to and from assistive
technologies that support MSAA. - Today, the only screen reader that allows users
to interact with Flash content is Windows-Eyes
from GW Micro. - Objects that cant be currently made accessible
include - invisible buttons and some specific form
components combo boxes, list boxes, and scroll
bars.
30Recommendations and Resources
- Web Sites
- http//www.webstandards.org
- http//www.alistapart.com
- http//www.glish.com
- FuseBox4
- http//beta.fusebox.org
- 508
- http//www.access-board.gov/sec508/guide/index.htm
- Bobby
- http//bobby.watchfire.com/bobby/html/en/index.jsp
31Recommendations and Resources
- Discovering Fusebox 4 (September 2003)
- Publisher - Techspedition
- Authors John Quarto von-Tividar, Sandy Clark,
Brian Kotek, Brian LeRoux, Perry Woodin - Constructing Accessible Web Sites
- Publisher Glasshaus
- Author Jim Thatcher
- Cascading Style Sheets Separating Content from
Presentation - Publisher Glasshaus
- Author Owen Briggs
- Core CSS
- Publisher Prentice Hall
- Author Keith Schengili - Roberts