• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Improving Your Website's Accessibility
 

Improving Your Website's Accessibility

on

  • 591 views

LSNTAP/Idealware webinar of 12 June 2013

LSNTAP/Idealware webinar of 12 June 2013

Statistics

Views

Total Views
591
Views on SlideShare
328
Embed Views
263

Actions

Likes
0
Downloads
0
Comments
0

6 Embeds 263

http://tendenci.com 138
http://lsntap.org 117
http://tendenci14.rssing.com 3
http://new.lsntap.org 2
http://tendenci15.rssing.com 2
https://www.edu-apps.org 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Improving Your Website's Accessibility Improving Your Website's Accessibility Presentation Transcript

    • Improving Your Website’s AccessibilityJune 2013
    • Introductions…Laura QuinnExecutive DirectorIdealwareRachel MagarioAssistive Technology SpecialistPACER Centers SimonTechnology Center
    • Who Are You Excluding By NotMaking Your Website Accessible?
    • Why Worry About Accessibility?If we want to provide equal access to justiceShouldn’t we ensure that we can provide information to everyone?
    • It Should Be Accessible to Those Who…• Are color blind• Can’t see well
    • It Should Be Accessible to Those Who…• Have difficultyusing their hands• Are deaf
    • It Should Be Accessible to Those Who…• Don’t speak English well• Are not familiar with USor technology norms• Don’t have a fastinternet speed• Are not very familiarwith technology
    • These People See the Web DifferentlyThey may need to rely onscreen readers, or keyboardshortcuts, or view a page veryclose up or without any sound.
    • Six Steps to anAccessible Website
    • Six Steps to an Accessible Website1. Make Your Text Itself Accessible2. Provide Alternative to Images3. Make Text High Contrast and Legible4. Accommodate Screen Readers5. Design for Those Who Aren’t Using a Mouse6. Code Pages According to Standards
    • 1Make Your Text Itself Accessible
    • 1. Create Scanable ChucksSplitting up text into scanable chunks is good for those who mayhave difficulty seeing, as well as those who aren’t very literate,aren’t technologically literate, or don’t speak English well.
    • SummarizeSummarizing information at the beginning of sections andparagraphs helps everyone – especially those on a screen reader.http://www.ptla.org
    • Consider Reading LevelRefrain from using high levellegal language on generalpages. Consider adding aglossary, or frequentlyasked questions page.
    • Translatable ContentConsider providingopportunities for users tochange their language.http://www.lawhelp.org
    • 2Provide Alternative to Images
    • Don’t Make People Rely on Images AloneIf images convey important information, provide analternative for people who may have difficulty seeing.
    • Or Video AloneInformative images andvideos can be helpful forthose who may be unable toread, but balance that withaccessibility to those whocan’t see and/or hear well.Captions can bridge the gap.
    • Alt TextAlt text is useful for those using screen readers, as well as those withvisual impairments who may have trouble seeing details in images.
    • Don’t Rely on ScreenshotsFor instance, an annotated filing form
    • Don’t Rely on IconsVisually impaired peoplemay be unable to seethem, and non U.S.natives may be unable tounderstand them.
    • 3Make Text High Contrast and Legible
    • Color ChoiceKeep text a dark color on a white background.
    • Make Sure Font Size is LegibleLarger than 10 ptfont, in general.
    • Allow People to Make it BiggerConsider adding an easily visible text enlargementtool to the top of your website.
    • Remember the Color BlindAs it appears on GoogleSimulated view of whatthe color blind would see
    • 4Accommodate Screen Readers
    • Think About the Order of ContentMake sure that the physical order is the same as the visual order.
    • Avoid Javascript MenusAvoid complicated Javascript menus.
    • Use Standard HTML HeadersUse standard <h1> and<h2> tags rather thancreating your own styles
    • Use Descriptive Link TextScreen Readers allow users to skip from linkto link, but without context they’re useless.
    • Consider “Skip Navigation”Consider a “Skip Nav” link to let those using screenreaders or keyboards can skip to the content they want.
    • Avoid Headers in All CapsScreen readers will emphasize things that are in caps, andsometimes mistake them for acronyms that should be spelled out.
    • 5 Design for Those Who Aren’tUsing a Mouse
    • Many People Don’t Use a MouseIncluding those usingscreen readers, thosewith mobility issues,and just those whoprefer the keyboard.
    • List of LinksA list of links can be a usefulnavigational shortcut for thoseon a keyboard or screenreader.Provide alternative links toimage maps.
    • Support Keyboard Shortcuts
    • Think About Tab Order of FormsDoes the order of forms makelogical sense when jumping frombox to box with the tab key?
    • 6Code Pages According to Standards
    • Don’t Break Browser DefaultsBrowsers will, in general, automatically support tools like screenreaders, and navigation by keyboard.
    • Use Standard HTML to Create LinksBe cautious of Javascript dropdowns that select without clicking.
    • Don’t Rely on Fancy Stuff to Provide ContentThe content of your siteshould be legible even ifyou turn your style sheets,scripts, applets, or all otherprogrammatic objects.
    • Use Tables and Lists ThoughtfullyDon’t force things into them for the sake of layout.
    • Tools for Testing Web Accessibility
    • WAVE
    • Firefox Accessibility Extension
    • WebAIM Screen Reader Simulationhttp://webaim.org/simulations/screenreader-sim.htm
    • Vischeck
    • W3C and 508 Compliance
    • What Does 508 Compliance Mean?Section 508 of the Rehabilitation Act of 1973 requires that Federalagencies electronic and information technology is accessible topeople with disabilities. Section 508 provides remedies to thoseaggrieved by violations of this requirement, which, afteradministrative remedies are exhausted, allow for both privaterights of action in court and for reasonable attorneys fees.
    • What Does W3C Compliance Mean?These guidelines, developed by the World Wide WebConsortium, explain how to make Web content accessible topeople with disabilities. The guidelines are intended for all Webcontent developers (page authors and site designers) and fordevelopers of authoring tools.
    • The Standards (in Simple Terms)The requirements for both W3C and 508 Compliance are similar.Occasionally, one has more strict rules than the other, but theirprimary difference lies in the fact that W3C Compliance is notrequired by any institution, but is rather an optional set of bestpractices for web accessibility.We’ll cover 508 compliance primarily.
    • Visual Elements• Provide a text alternative forevery non-text element ofyour website.• Videos and animation shouldhave accompanying captionsor auditory descriptions of thevisual track.• All information that isconveyed with color shouldalso be clear without color
    • Interactive Elements• Label all form controlsproperly, and make theirfunctionality is accessible forthose using assistivetechnologies.• Allow users to skip repetitivenavigation.• If a timed response isrequired, give the usersufficient time to indicatewhen more time is needed.
    • Technical Elements• Use markup to associate datacells with data headers.• Facilitate frame navigation andidentification with text• Provide alternative links toimage maps.• Sites should not cause thescreen to flicker at a frequencygreater than 2 Hz and lowerthan 55 Hz
    • Ensure Content Is Always Legible• Your site must be legible when style scripts, applets, or otherprogrammatic objects are turned off or not supported.• Downloads for applicable applets or plug-ins should be provided.
    • The Catch-AllA text-only page, with equivalent information or functionality,shall be provided to make a web site comply with the provisionsof this part, when compliance cannot be accomplished in anyother way. The content of the text-only page shall be updatedwhenever the primary page changes.
    • Balance Legal vs. Human RequirementsFor example, should you spend time making complicatednavigation more accessible, or simply offer an alternative page,or a skip navigation link?
    • What Changes Will You Make?• Text• Images• Video• Icons• Forms• Navigation
    • Let Everyone Benefit From Your Services• Are color blind• Can’t see well
    • Questions?