eca 228 internet/intranet design i accessibility
TRANSCRIPT
ECA 228 Internet/Intranet Design I
Accessibility
ECA 228 Internet/Intranet Design I
accessibility issues
some users– can’t see, hear, or move the way we do – may not mentally process information easily– may have difficulty reading – may not be able to use keyboard or mouse – may have a text-only screen, or very small screen – may have a voice browser
ECA 228 Internet/Intranet Design I
accessibility issues cont …
making your site accessible to users with disabilities may benefit all users– EG, your choice to use stylesheets to control
style across your site may benefit a user with low vision, but may actually decrease download time for all users
by law, some sites must be accessible to more than just sighted, hearing users
ECA 228 Internet/Intranet Design I
Web Accessibility Initiative
WAI attempts to make the web more accessible to everyone
5 primary areas1. Technology
2. Guidelines
3. Tools
4. Education and Outreach
5. Research and Development
ECA 228 Internet/Intranet Design I
guidelines
Guidelines address 2 general themes: Graceful Transformation
– separate structure from presentation– provide text alternatives, such as the alt attribute in
<img> tags– create documents that work even if users cannot
see or hear – include information that serves the same purpose as audio or video
– create documents that do not rely on one type of hardware, eg, large monitors
ECA 228 Internet/Intranet Design I
guidelines cont …
Making Content Understandable and Navigable– make language clear and simple– provide understandable mechanisms for navigating
through site– some users cannot use image maps, frames,
graphics– some users may lose contextual information when
they can view only a portion of the page put important information above fold eg, magnified images only display one word at a time Braille readers
ECA 228 Internet/Intranet Design I
guidelines cont …
checkpoints– each guideline may contain one or more
checkpoints explanations of how the guideline applies in real-world
scenario
– each checkpoint is assigned a priority level
ECA 228 Internet/Intranet Design I
priority levels
Level 1– site must satisfy this checkpoint, otherwise it will be
impossible for some groups to access information
Level 2– site should satisfy this checkpoint – significant
barriers may be removed
Level3– site may address this checkpoint – will improve
overall accessibility
ECA 228 Internet/Intranet Design I
conformance
A document may be rated on its compliance to the 3 priority levels
3 levels of conformance standards1. LEVEL A: all Priority 1 checkpoints are satisfied
2. LEVEL Double-A: all Priority 1 and 2 checkpoints are satisfied
3. LEVEL Triple_A: all Priority 1, 2, and 3 checkpoints are satisfied
Know Your Audience
ECA 228 Internet/Intranet Design I
Guideline 1
– if a user cannot use images, movies, sounds, etc, provide equivalent information
– guidelines do not suggest avoiding using the above, but providing a text equivalent
– text equivalents may be used as synthesized speech, Braille, visually displayed text
Provide equivalent alternatives to auditory and visual content.
ECA 228 Internet/Intranet Design I
Guideline 1 cont …
– text equivalent must serve the same function or purpose as an image
– EG, the purpose of image of earth from outer space decoration
alt = “photograph of earth from outer space” illustration of world geography
alt = “the polar caps can clearly be seen from outer space” link to information about the earth
alt = “click this link for more information about the earth”
ECA 228 Internet/Intranet Design I
Guideline 1 cont …
– if the text conveys the same purpose for a user with a disability as the image does for other users, it can be considered equivalent
– consider using non-text equivalents (pictures, video, audio) for users who have difficulty reading
– Checkpoints: Provide text equivalent for every non-text element,
including images, applets, ascii art, animations, buttons, image map regions, etc
ECA 228 Internet/Intranet Design I
Guideline 2
– ensure that that text and graphics are understandable when viewed without color
– foreground and background should not be too close to the same hue
– some users may not be able to differentiate colors– Checkpoints:
Make sure any information conveyed with color is also conveyed other ways as well
Don't rely on color alone.
ECA 228 Internet/Intranet Design I
Guideline 3
– markup documents with proper structural elements– control presentation with style sheets rather than
presentational elements <font>
– invalid HTML hinders accessibility– using a table to lay out a page may cause problems– do not use presentational markup to convey structure
Use markup and style sheets and do so properly.
ECA 228 Internet/Intranet Design I
Guideline 4
– identify predominant natural language of the document using meta tags
– Checkpoints: Identify changes in the natural language of a documents
text. EG, if you include a non-English word in an English document, identify the language with the lang attribute.
Clarify natural language usage.
ECA 228 Internet/Intranet Design I
Guideline 5
– tables should be used to mark up tabular data, not to lay out a page
– Checkpoints: For data tables having 2 or more logical levels of rows or
columns ( header cells, body, footer) use markup to designate those levels ( thead, tbody, tfoot )
Identify row and column headers
Create tables that transform gracefully.
ECA 228 Internet/Intranet Design I
Guideline 5 cont …
– some screen readers reads table cells straight across
– will be read as
Abraham Lincoln's Gettysburg Address, delivered 19 November, 1863
Four score and seven years ago our fathers brought forth upon this continent a new nation …
Abraham Lincoln's Gettysburg Four score and seven years ago Address, delivered 19 November, our fathers brought forth upon 1863 this continent a new nation …
ECA 228 Internet/Intranet Design I
Guideline 6
– ensure that pages are accessible even when newer technologies are not supported or are turned off
– Checkpoints: Organize the structure of your document so that it still
makes sense even if style sheets are not working as you expect
Ensure that pages are usable even when scripts, applets, and other objects are turned off
Ensure that pages featuring new technologies transform gracefully.
ECA 228 Internet/Intranet Design I
Guideline 7
– ensure that moving, blinking, scrolling, or auto-updating objects or pages may be paused or stopped
– Checkpoints: Avoid causing the screen to flicker – some people with
epilepsy can have seizures triggered by flickering or flashing in the 4 to 59 flashes per second range
Ensure user control of time-sensitive content changes.
ECA 228 Internet/Intranet Design I
Guideline 8
– when you have an embedded object that has its own interface, make sure that interface as well is accessible
– Checkpoints: Make programmatic elements such as scripts and applets
compatible with assistive technologies
Ensure direct accessibility of embedded user interfaces.
ECA 228 Internet/Intranet Design I
Guideline 9
– use features that enable activation of page elements via a variety of input devices
– don’t rely only on one device (mouse, keyboard, etc) to navigate through site
– Checkpoints: Provide client-side image maps rather than server-side
image maps
Design for device-independence.
ECA 228 Internet/Intranet Design I
Guideline 10
– Use interim accessibility solutions so that assistive technologies and older browsers will operate correctly
– interim means that the W3 considers these issues at the moment, but expect these will not be a problem in the future, when web technologies come out with certain anticipated features
Use interim solutions.
ECA 228 Internet/Intranet Design I
Guideline 11
– use W3C technologies (according to specification) and follow accessibility guidelines
– W3C technologies include built-in accessibility features– avoid non-W3C and non-standard features ( proprietary
code )
Use W3C technologies and guidelines.
ECA 228 Internet/Intranet Design I
Guideline 12
– group elements and provide contextual information about the relationship between elements
– complex relationships between parts of a page may be difficult for people with disabilities to interpret
– Checkpoints: Title each frame to facilitate identification and navigation
Provide context and orientation information.
ECA 228 Internet/Intranet Design I
Guideline 13
– provide clear and consistent navigation mechanisms to increase the likelihood that a person will find what they are looking for at a site
orientation information navigation bars site map
Provide clear navigation mechanisms.
ECA 228 Internet/Intranet Design I
Guideline 14
– ensure that documents are clear and simple so they may be more easily understood
– consistent page layout, recognizable graphics, and easy to understand language benefits all users
– Checkpoints: Use the clearest and simplest language appropriate for a
site’s content
Ensure that documents are clear and simple.
ECA 228 Internet/Intranet Design I
validation
to check for accessibility, use:– automated tools– human review
invite individuals with disabilities to review the document invite both experienced and novice users get feedback from users with a wide range of disabilities
– hearing impaired– visually impaired– motor impairments
ECA 228 Internet/Intranet Design I
validation methods
use automated validation tools validate syntax of HTML validate style sheets view document in text-only browser view document in several browsers, old and
new view document in screen reader, with
magnification, on a small display, etc
ECA 228 Internet/Intranet Design I
validation methods cont …
use spelling and grammar checking– speech synthesizers may not be able to decipher
misspelled words– grammar problems may make document
incomprehensible
review the document for clarity and simplicity– ask a human editor to review document– identify cultural barriers
ECA 228 Internet/Intranet Design I
Bobby
http://bobby.watchfire.com comprehensive web accessibility software tool
– identifies barriers to accessibility
enter a url to check one page at a time– generates a report listing violations of Priority 1, 2,
and 3 issues– generates a list of user checks
Bobby is available for purchase