Transcript Accessibility Challenges in University Web

Accessibility Challenges in
University Web Environments
Mandy Eppley, Online Learning Consultant
Parker Owens, Web Accessibility Coordinator
Eastern Kentucky University
KY AHEAD Conference 08
Accessibility Challenges in University
Web Environments
How
can we take advantage of innovative
learning environments and still meet ADA
requirements for education?
◦ Websites
◦ Online Classes
◦ Web 2




Blogs
Wikis
Virtual Worlds
Social Networking
PEW – Teens and Social Media,
12/19/2007
 64%
of online teenagers ages 12 to 17 engage in
at least one type of content creation, up from
57% of online teens in 2004.
 35% of all teen girls blog, compared with 20% of
online boys, and 54% of wired girls post photos
online compared with 40% of online boys.
 Online teen boys are nearly twice as likely as
online girls (19% vs. 10%) to have posted a
video online somewhere where someone else
could see it.
Demographics of Internet Users
PEW - Information Searches
That Solve Problems, 12/2007
 58%
used the internet to get help.
 53% professionals such as doctors, lawyers or
financial experts
 45% sought out friends and family
 36% consulted newspapers and magazines
 13% went to the public library
PEW –Teens and Technology,
April, 2008
 93%
of teens say they write for their own pleasure
 85% of teens ages 12-17 engage in some form of
electronic personal communication (email, chat)
 60% do not think of e-text as “writing”
 50% use informal writing styles instead of proper
capitalization and punctuation in their school
assignments
 38% have used text shortcuts in school work
(“LOL”)
 25% have used emoticons☺ in school work
Web Challenges
 Educational
◦
◦
◦
◦
◦
organizational challenges
Peer sharing different than a hierarchy
Ownership
Privacy
Control of content
Legal challenges
 ADA
 Safety
 Ownership
 Personal
organizational challenges
◦ Multiple IDs, passwords, avatars, websites
Web Challenges
Technological
◦
◦
◦
◦
challenges
Bandwidth
Operating systems/software
Skill levels
Computer hardware
Accessibility Challenges
Lack
of keyboard shortcuts
Not AT compatible
Limitations to accessibility
◦ How do you describe a google map?
◦ Can you provide transcripts for video content
on another site?
Websites
Websites
Department,
Association or Group
Class or Event
Instructor
Public
Private
Online
class
Different Requirements for
Different Needs
http://www.fredshead.info/
Cyber Y Center Shared Website –
Life on the Streets
Website Accessibility Issues
Training
– web skills
Public or private access
University branding
Accessibility of technology, software, and
interface
Free Websites
Free Websites
Free Websites
Online Classrooms
What is an online learning
system?
 Courseware
Management System (CMS):
Refers to instruction in which the teacher
and student are separated by space or time
where the gap between the two is bridged
through the use of online technologies.
•Chat
•Assessment
•Text matching
•Group communication
•Email
•Video
•Audio
•Text
•Links
Online Learning Statistics
 Almost
3.5 million students were taking at least
one online course during the fall 2006 term.
 The 9.7 percent growth rate for online
enrollments far exceeds the 1.5 percent growth
of the overall higher education student
population.
 Nearly 20% of all U.S. higher education students
were taking at least one online course in the fall
of 2006.
http://www.sloan-c.org/publications/survey/survey07.asp
Blackboard
Blackboard Statistics
More
than 67 million active users
Over 55,000 regional, work-related,
collegiate, and high school networks
8 million students from 2,000 colleges
and 22,000 high schools
EKU has more than 60,000 users
Moodle
WebCT
Sloodle
Simplify Classroom Interface
Provide
ample contact information
Provide simple navigation in the left panel
with limited choices
Change the standard button labels for
clarity
Use text buttons whenever possible
Use larger text in a simple font with good
contrast
Content in multiple formats
Online Class Accessibility Issues
All
items in a classroom are arguably
necessary for a student, so there is a
greater potential for lawsuits.
Instructors need to be an accessibility
champion.
Instructors must be aware that
accessibility does not ‘come’ with an
application they choose to use with class.
Profiles
Delete Unused Tools
Less choices means a more
easily understood interface.
Keep number of choices
below 7 if possible.
Delete Unused Navigation
Provide Simple Class Name
Heading
Contrast
Clear type
No Animation
Provide Alternative Text
For
persons with visual impairments,
alternate methods of accessing the value
and meaning of images is essential.
Golden rule: for any image or graphic
content displayed on your website, ensure
a text alternative and description is
available.
◦ Exception - decorative images or spacer gifs
need a null alt attribute, or alt=“”
Add Alternative Text to Pictures
Select image, right-click for menu, choose size option
Blackboard “Alt Text”
Dreamweaver “Alt”
Provide Documents in Two
Formats
Video
needs captions or a transcript
Podcasts need a transcript
PowerPoints need an outline provided in
plain text. Provide visual description
where necessary.
Provide documents for download as well
as presenting content in a Blackboard
classroom
PowerPoint Suggestions
Use text no smaller than 24 pts.
Use good contrast and an easy to read font.
Use images or graphics to provide clarity.
Copy and Provide Outline in
Plain Text
Click on
Outline Tab
Select text
Copy/Paste to
txt document
Upload to
Blackboard
class
Save Word Documents
to Filtered HTML
Best Practices for Text
 Place
all text in a single column. Multicolumned text is confusing to screen readers.
 AVOID USING ALL CAPITAL LETTERS.
 Use simple easy-to-read typefaces. San serif
fonts are easiest to read on the screen (ex:
Verdana, Tahoma, Arial).
 Do not use italics or fancy fonts.
 Use good contrast between background and
text color.
Use Headings Properly in Word
If you only change the font style, size, and
color, no extra emphasis or info is given by
the screen readers.
Accessibility Concerns
with Chat
Not everyone can use chat. If you decide
to use chat in your classroom, consider
recording the discussion and providing a
text file for an alternate assignment.
Web 2
Blogs, Wikis,Virtual Worlds, and Social and
Sharing Networks
Advantages to Web 2
Cost
in labor and system upkeep by third
parties.
Blogs and wikis can be continued past the
end of a semester.
Comments can come from the entire
world.
Application training for students is
minimal.
Disadvantages to Web 2
Privacy
Interference/spamming/griefing, or
other
abuse from non-educational individuals
No control over changing applications or
content if vendor goes out of business
Not accessible to some students
with disabilities
Captchas
CAPTCHA
(for Completely Automated
Turing Test To Tell Computers and
Humans Apart)
http://www.captcha.net/
ESP-PIX
Asirra/Petfinder.com
Other problems
Language
Cognitive
difference (CJK characters)
issues
Braille users
What is a blog?
Digital
storytelling
Opinions
Can contain videos, audios, and other
media
Comments add interactivity
Wikipedia Definition of Blog
A
blog is a website, usually maintained by
an individual, with regular entries of
commentary, descriptions of events, or
other material such as graphics or video.
Many blogs provide commentary or news
on a particular subject; others function as
more personal online diaries.
The ability for readers to leave comments
in an interactive format.
Bloglines
EduBlogs
Free Blogs
Content Delivery Methods
RSS
paired with an aggregator (ITunes)
Web
Email
Disk or network
Online Classroom
RSS feeds
Subscription
based
Content pulled into aggregator based on
dates and items in plain text xml file
<?xml version="1.0"?>
<rss version="2.0">
<channel>
<title>EKU Web Accessibility</title>
<link>http://www.podcasts.eku.edu/owenspa/index.htm</link>
<description>Creating Accessible Podcasts</description>
<language>en-us</language>
<copyright>Copyright 2006, EKU Web Accessibility Office</copyr
<lastBuildDate>Tue, 23 Jan 2007 10:52:22 GMT</lastBuildDate>
<webMaster>[email protected]</webMaster>
<ttl>1</ttl>
<item>
<title>Creating Accessible Podcasts</title>
How an RSS feed works
Content uploaded
to server.
File locations
uploaded to server.
<?xml version="1.0"?>
<rss version="2.0">
<channel>
<title>EKU Web Accessibility</title>
<link>http://www.podcasts.eku.edu/owenspa/index.htm</link>
<description>Creating Accessible Podcasts</description>
<language>en-us</language>
<copyright>Copyright 2006, EKU Web Accessibility Office</c
<lastBuildDate>Tue, 23 Jan 2007 10:52:22 GMT</lastBuildD
<webMaster>[email protected]</webMaster>
<ttl>1</ttl>
<item>
Consumer subscribes to feed
Aggregator software checks feed
and downloads new content
Consumer copies files to
Mp3 player, CD, telephone,
or plays from computer.
Blog Accessibility Issues
Captioning
◦ Vlogs – ASL
◦ Podcasts
◦ Video
Template
inaccessibility
Sign-up inaccessibility
Disability Blogs
http://cripwheels.blogspot.com/
Disability Blogs
http://putzworld.blogspot.com/
Disability blogs
http://www.e-bility.com/links/blogs.php
http://www.raggededgemagazine.com/blog
index.html
AFB articles - How to Make Your Blog
Accessible to Blind Readers
 Choose
an accessible service
 Describe your images
 Avoid the dreaded “click here" or “more..."!
 Put your blogroll on the right-hand side
 Check the comment form - is it labeled
properly?
 Use flexible font sizes
 Don't force links to open in new windows
http://www.afb.org/Section.asp?SectionID=4&Topi
cID=167&DocumentID=2757
What is a wiki?
 Not
good for discussions, but good for a
collection of information or resources
 Wikipedia
◦ 684 million visitors yearly
◦ 10 million articles in 259 languages
 2.3 in English (as of 5/08)
 Cons
◦
◦
◦
◦
No neutrality
Misinformation
Vandalism
Marketing
Wikipedia Definition of Wiki
A
wiki is a collection of web pages
designed to enable anyone who accesses
it to contribute or modify content, using a
simplified markup language.
Wikis are often used to create
collaborative websites and to power
community websites.
Wikis
PB Wiki
Wikipedia
Dokuwiki
promises Priority A WCAG
accessibility
http://wiki.splitbrain.org/wiki%3ADokuWiki
Wikispaces
Disability Wikis
Disapedia
http://disapedia.com/index.php?title=Main
_Page
◦ 2,175 articles
◦ 100,000 page views
◦ 1,500 visits a week
Wikibility
Rights Movement 2.0
http://www.wikibilityrights.com/wiki/index
.php?title=Main_Page
PBWiki
Boston College Wiki – student
exam question collaboration
Wiki Accessibility Issues
Captchas
Uploaded
content issues
Interface inaccessibility
What is social networking?
Organize, suggest, review, assign
value
Team building based on common interests
or topics
Organization of media (photos, videos)
Direct collaboration (google docs)
Communication by tool (voice, text chat,
asl vlog; synchronous/asynchronous;
requests for comments, collaboration, or
refusal of feedback)
Social Networking
 Facebook
 LinkedIn –
 MySpace
 Friendster
 Other
easiest to browse
◦ PLEs (community organization tools)
 Pageflake
 iGoogle
 Netvibes
◦ Sharing tools
 digg
 del.icio.us
◦ Virtual Worlds
Facebook
Facebook
is an effective and well
organized way to publicize, communicate
and share information with a group.
Students post pictures, send messages,
and post times and dates of events.
 This is an example of a club that was
organized by students on Eastern
Kentucky University’s campus.
Blackboard Sync in Facebook
Facebook club at EKU
This
is an example of a club that was
organized by students on Eastern
Kentucky University’s campus.

MySpace – inaccessible interface
MySpace Sign Up
Del.icio.us
Del.icio.us Benefits
Students
keep their resources after they
leave school, which makes it truly life long
learning and keeps the students in contact
for resources later.
It also helps students and instructors
share a wealth of resources with each
other.
Collaborate with professionals all over
the globe.
Tag Clouds
Social
tagging, folksonomies
digg
Skype
Twitter – sharing micro tasks
Twitter
Twitter
allows you to broadcast and
receive messages from your computer or
cell phone up to 140 characters in length.
 ‘Subscribers’ can either broadcast or see
a message, which is called a “tweet.”
The key factor with using Twitter is that it
takes the blogging concept to a whole
new level of portability via cell phones,
making it highly mobile.
Flickr – sharing photos
Ning – social groupings
Slideshare - slideshows
YouTube – sharing videos
YouTube
Add a Wikipedia Link
Wikipedia Link
Add a Slurl link to Second Life
Slurl link to Second Life
Google Maps – sharing maps
Egyptian Sphinx – Cairo, Egypt
BubbleShare - slideshows
What is a virtual world?
A
virtual world is a computer-based
simulated environment intended for its
users to inhabit and interact via avatars.
These avatars are usually depicted as
textual, two-dimensional, or threedimensional graphical representations,
although other forms are possible
(auditory and touch sensations for
example). Some, but not all, virtual worlds
allow for multiple users. - Wikipedia
Virtual Worlds
Why
Second Life?
Other options
◦
◦
◦
◦
Whyville, ages 10-16
ActiveWorlds
Moove (2-d option)
There
Virtual Worlds Accessibility Issues
3-d
world
Voice and text chat
Browser/AT incompatibility
Digital divide
Second Life as Example
Second Life as Example
Text
chat
Voice chat
Slide shows and videos
Experiential
Gestures
Identity expression
Coding
Machinima, theater, emergency planning
Social experiments
Identity Issues
Can Second Life be ADA accessible?
 Concerning
the visual and 3-D environment of Second Life,
you may be interested in how it is currently used:
◦ Provides mobility for residents that have MS, Cerebral
Palsy, or other similar impairments. Many avatars created
by users with mobility impairments use wheelchairs in
SL.
◦ Text chat is not easily read by a screen reader. A screen
readable text-only version of Second Life exists for
residents without sight. Chat and voice logs can also be
recorded for anyone that has a technical or cognitive
impairment, or for later study.
◦ The SL interface and chat text size is customizable and
makes use of alt-keys.
◦ Through an avatar, residents with real life (RL) physical
deformities or obvious disabilities can become ablebodied, and vice versa.
◦ Autistic students can practice social skills.
Can Second Life be ADA accessible?
Disability
awareness simulations can be
structured using avatar wheelchairs, or by
changing chat and voice options.
Accessibility can be achieved in most
applications with work from the facilitator
hosting the event.
A real time streaming event would require
real time captioning or interpretation.
Visual description should be available for any
environment, as an explanation for odd
sounds or text/voice chat references.
SLeek
SLeek
is an open source low tech client
to use SL without all the fancy graphics. It
would be useful for individuals with visual
impairments, but consider also its use for
students in low tech environments, for
instance at home on an old computer
with a modem
http://code.google.com/p/sleek/
Movable Life
 MovableLife
allows Second Life users to log in
to Second Life using only a web browser.
MovableLife allows chat, IM, search, teleport,
manage friends, groups, and much more,
providing a Second Life experience without all
the 3D graphics. Movable Life article
 Another advantage to using a regular browser, is
that it can be used by iphones and other
devices, and also the bandwidth is reduced for
use on older computers with modems.
http://www.news.com/8301-13772_3-979640352.html?part=rss&subj=news&tag=2547-1_3-05
Accessing Second Life: Universal
Design in a Virtual World
Student Recruitment
Wilde Cunningham – SL avatar
 An
avatar controlled by nine adults (ages 30-70)
with cerebral palsy at a day care.
 Most are wheelchair users and rely on help for
almost all aspects of their daily lives, yet in
Second Life they have built their own houses,
have pets, gardens, even a baseball field. They
also have many close friends and a large social
network.
Wilde Cunningham – SL avatar
 “Second
Life gives me the chance to be the
person I feel I was born to be,” says John S, 32,
one of the group. “Being in Second Life is how I
imagine an innocent man who had been locked
up wrongly feels when he is finally set free. In
Second Life I get to call the shots.”
http://www.cbsnews.com/sections/i_video/main
500251.shtml?id=3547970n
2nDisability Scripts
Fez
Rutherford can provide scripts on
blindness, epilepsy, Tourette’s Syndrome,
stuttering, etc.
http://2ndisability.blogspot.com/
Wheelies Nightclub - SL
 Second
Life Resident Simon Walsh has organized the
creation of a new nightclub in Second Life called Wheelies.
Wheelies aims to "make guests feel comfortable about
disability as well as dancing, drinking and just plain having a
good time.“
http://www.flickr.com/photos/pathfinderlinden/234326420/
Social Networking
Accessibility Issues
Captchas
Inaccessible
interface for entering or
viewing content
How are all these applications
the same?
All
web based
◦ Delivered over an internet connection
◦ Content is within a browser
◦ None of them are perfect for every student
In a Nutshell
Best
web accessibility practices
Universal design
Best Web Accessibility Practices
No
captchas
Ability to create accessible templates that
make use of semantic info
Options beyond toolbars (shortcuts)
Privacy
Ability to upload transcripts or other
alternative content
Best Web Accessibility Practices
Shortcut
keys and ability to use
alternative input devices, especially for
games (don’t require mouseover actions
for mobility impaired, blind)
Use correct web writing with small
blocks of text and many headings for
scanning (cognitive, general usability)
Best Web Accessibility Practices
Scaling
text size, contrast between text
and background (low vision, color-blind,
seniors, children)
Check broken links and spelling on a
regular basis (blind, cognitive, general
usability, screen readers, mobility
impaired)
Best Web Accessibility Practices
Web
pages should not be dependent on a
certain resolution, color depth, font size,
or window size (mobility, visual
impairments, assistive technology)
Check
your pages in different browsers
to ensure they will work cross platforms
Provide essential content in two formats
for example PDF, MP3 (general usability,
blind, deaf)
Best Web Accessibility Practices
Provide
essential content in two formats
for example a PDF and MP3 (general
usability, blind, deaf)
Use headings, lists and other semantic
info (blind, low vision, cognitive)
Best Web Accessibility Practices
Correct
common alt attribute and
alternative text mistakes
◦ Function of image > description
◦ Provide null alts for decorative images or
layout spacers
◦ Create null alts for images enclosed in text
links
◦ Create null alts for images referenced and
described in main content or simplify
Universal Design
Simple
navigation (no more than 7 links)
Clearly labeled navigation
Use of white space
Standard relatively-sized sans-serif font
Correct web writing
Broken links
Spelling
Content in two formats
Takeaway
Even
though a specific online application
may not be accessible to a student, the
general framework of wikis, blogs, online
learning environments, and virtual worlds
is valid and with careful choices, most can
be used with a few refinements.
Go
for it!
Resources





Spell check, included in blog host framework, MS Word or other
word processing programs, or http://spellcheck.net
Link check http://validator.w3.org/checklink, XENU (free
http://home.snafu.de/tilman/xenulink.html ), and website
management programs like Dreamweaver.
HTML validator http://validator.w3.org/
CSS validator http://jigsaw.w3.org/css-validator/
Accessibility Validators
 http://fae.cita.uiuc.edu/
 http://wave.webaim.org/index.jsp




Reading levels and other reading tests.
http://juicystudio.com/services/readability.php
Lynx 'text-only' viewer
http://www.yellowpipe.com/yis/tools/lynx/lynxview.cgi
WebSiteOptimization.com
http://www.websiteoptimization.com/services/analyze/
Accessibility Color Wheel
http://gmazzocato.altervista.org/colorwheel/wheel.php
Contact Us
[email protected]
[email protected]
Eastern Kentucky University
Slide show is available at
http://people.eku.edu/eppleym/kyahead.ppt
or
http://people.eku.edu/owenspa