Introduction to accessibility part 2
Download
1 / 30

Cuyamaca College - PowerPoint PPT Presentation


  • 74 Views
  • Uploaded on

Introduction to Accessibility Part 2. Cuyamaca College. How To Make Your Online Material Accessible. Don’t Worry…. How. Checklist - divide into 3 semesters Revise your materials as you review them for class

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Cuyamaca College' - kylee


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

How to make your online material accessible
How To Make Your Online Material Accessible



Cuyamaca college
How

  • Checklist - divide into 3 semesters

  • Revise your materials as you review them for class

  • Attend staffed labs during staff development week (guided demonstrations and time)

  • Evaluations of online courses will include accessibility check


Support
Support

  • Training each semester

  • Staffed labs during staff development week

  • ED 216 class (in development)

  • Help Desk (660-4395)

  • DSPS: http://www.cuyamaca.edu/dsps/


Cuyamaca online blog
Cuyamaca Online Blog

http://cuyamaca-online.blogspot.com/


Priorities this semester
Priorities this semester

  • Color

  • Color contrast

  • Hyperlinks

  • Images

  • Usable Design


Color
Color

Other elements besides color are used to convey information

Required fields are marked in red and an asterisk


Vischeck
Vischeck

http://www.vischeck.com/vischeck/vischeckImage.php


Color contrast
Color Contrast

  • Avoid using text and background colors that do not provide sufficient contrast. 

  • Check the page to ensure hyperlinks and background colors have sufficient contrast.


What can you easily read
What can you easily read?

  • What can you easilyread?


Color contrast examples
Color Contrast Examples

OK

Not OK

OK

Not OK

OK

Not OK


Accessibility color wheel
Accessibility Color Wheel

  • http://gmazzocato.altervista.org/colorwheel/wheel.php


Hyperlinks hypertext
Hyperlinks/Hypertext

  • When creating hyperlinks, be descriptive as to the function or location the hyperlink will take the student. 

  • Hyperlink text of "Click Here" does not provide information as to "where" the hyperlink will take the student.


Link examples
Link Examples

  • Student/Faculty mentor program is available for qualifying students. Click here for more information.

  • Student/Faculty mentor program is available for qualifying students.

  • Click here to submit a survey and a chance to win a $200 gift certificate.

  • Enter Survey for a chance to win a $200 gift certificate.


Hyperlinks title attribute
Hyperlinks – Title Attribute

  • Title attribute only when it adds value

    • WebAdvisor

      • Title attribute = “Register for classes, view schedule”

    • http://www.cuyamaca.edu/

      • Title attribute = “Cuyamaca College”


Images what s needed
Images – What’s Needed

  • Text description

    • Alt text

    • Description within text of page

    • Link to long description page using the “longdesc” attribute

  • Decorative images can use empty alt text or alt=“”



Images
Images

  • Are images bad?

  • No!

    • Useful to individuals with:

      • Reading disabilities

      • Learning disabilities

      • Attention deficit disorders

      • Cognitive disabilities

      • Sight


The specifics
The Specifics

This section will provide instructions for how to add Alt text for Microsoft Office, FrontPage, SharePoint Designer, Dreamweaver, and Blackboard.


Alt text ms office 2007
Alt text - MS Office 2007

  • Right-click image

  • Choose Size… or Size and Position…

  • Select the Alt Text tab

  • Enter alternative text


Alt text ms office 2003
Alt text - MS Office 2003

  • Right-click image

  • Choose Format Picture

  • Select the Web tab

  • Enter alternative text


Frontpage accessibility tool
FrontPage Accessibility Tool

  • Tools Menu

  • Accessibility


Alt text frontpage
Alt text – FrontPage

  • Right-click image

  • Choose Picture Properties

  • Select the General tab

  • Enter text


Sharepoint designer accessibility tool
SharePoint Designer Accessibility Tool

  • Tools Menu

  • AccessibilityReports


Alt text sharepoint designer
Alt text – SharePoint Designer

  • Right-click image

  • Choose Picture Properties

  • Select the General tab

  • Enter alternative text


Dreamweaver accessibility tool
Dreamweaver Accessibility Tool

  • Site Menu

  • Reports…


Alt text dreamweaver
Alt text – Dreamweaver

  • Click on image

  • Enter alt textin properties


Alt text blackboard
Alt text – Blackboard

  • Attach image

  • Enter alt text


Tools
Tools

  • Wavehttp://wave.webaim.org/

  • Cynthia Sayshttp://www.contentquality.com/

  • WebDeveloper Toolbar for Firefoxhttp://chrispederick.com/work/web-developer/