Accessible Design Presentation

Download Report

Transcript Accessible Design Presentation

Accessibility:
Designing the Interface
and Navigation
The Non-Designer’s Web Book
Chapter 7
Robin Williams and John Tollett
Presented by Sherie Loika
Interface and Navigation
Design
Interface- how the pages look and
how the pages work and interact with
the viewer
Navigation- the way people get
around your site and know where to go
Generally inseparable elements
Navigation design
Find the way home?
Clear and simple?
Accessible?
Navigational Styles
Keep primary
navigation together
in a compact package
(top, bottom, or side)
Top and bottom if
long scrolling page
Keep accessibility in
mind
Accessibility
The ability of a Web page to be viewed
by everyone, especially people with
disabilities who use various assistive
technologies.
Section 508
Using W3C technologies- Web Content
Accessibility Guidelines
http://www.w3.org/TR/1999/WAI-WEBCONTENT-19990505
“The flashiest, most flamboyant
navigation systems are often
inaccessible to disabled visitors, hard
for all visitors to understand, and all
but invisible to search engines.”
Larisa Thomason
Senior Web Analyst
NetMechanic, Inc.
January 2002
Accessible Design and the
Visually Impaired
Buttons, graphic navigation bars, and
image maps (hot spots) are invisible to
screen reading software.
http://trace.wisc.edu/docs/navtools2001/index.html
Misinterpretation of tables in HTML
http://www.w3.org/WAI/Resources/Tablin/
More Accessible Design Issues
Using video or audio that does not include
captions or a transcript is inaccessible to deaf
and/or hearing impaired.
Complicated and inconsistent navigation systems
or complex language can be inaccessible to those
with cognitive or learning impairments.
Website navigation that does not accommodate
the need for alternative input devices excludes
people with motor impairments
Web Content Accessibility
Guidelines
Provide context and orientation information.

See guideline 12
Provide clear navigation mechanisms.

See guideline 13
Ensure that documents are clear and simple.

See guideline 14
Validate accessibility

Automatic tools and human review
Guideline 12: Provide context
and orientation information
Title each frame to facilitate frame
identification and navigation
Describe the purpose of frames and how
frames relate to each other if it is not obvious
by frame titles alone
Divide large blocks of information into more
manageable groups where natural and
appropriate.
Associate labels explicitly with their controls.
Back
Guideline 13: Provide clear
navigation mechanisms.
Clearly identify the target of each link
Provide metadata to add semantic
information to pages and sites
Proved information about the general
layout of a site (site map or table of
contents.)
Use navigation mechanisms in a
consistent manner.
Guideline 13 (cont.)
Provide navigation bars to highlight and give
access to the navigation mechanism.
Group related links, identify the group (for
user agents), and, until user agents do so,
provide a way to bypass the group.
If search functions are provided, enable
different types of searches for different skill
levels and preferences.
Guideline 13 (cont.)
Place distinguishing information at the
beginning of headings, paragraphs,
lists, etc. (front-loading)
Provide information about document
collections
Provide a means to skip over multi-line
ASCII art.
Back
Guideline 14: Ensure that
documents are clear and simple
Use the clearest and simplest language
appropriate for a site’s content.
Supplement text with graphic or
auditory presentations where they will
facilitate comprehension of the page.
Create a style of presentation that is
consistent across pages.
Back
Validation
Automated accessibility tool and browser
validation tool.
http://bobby.watchfire.com/bobby/html/en/index.jsp
Validate syntax
Validate style sheets
Use a text-only browser or emulator.
Use multiple graphic browsers
Invite people with disabilities to review
documents.
Work for the disabled=
least technically challenging
“The Centre for Teaching and Learning
recommends the web editor Dreamweaver,
by Macromedia. While perfectly capable of
lumbering pages with code and foreign data,
Dreamweaver can be easily constrained to
stick to the lowest common denominator and
will even automatically strip obfuscating code
out of pages made with other tools.”
(UNBC, 2000)
Remember…
Keep it simple.
Remember your audience.
References
http://www.mcu.org.uk/articles/disable
dstudents.html
http://www.netmechanic.com/news/vol
5/accessibility_no1.htm
http://www3.org
http://bobby.watchfire.com/bobby/html
/en/index.jsp
http://ctl.unbc.ca/disabilities.html