Using Web-based Tools in Brightspace, with an Eye on Accessibility accessibly
1. Today’s Webinar
Using Web 2.0 Tools inside Brightspace,
with an Eye on Accessibility
Barry Dahl, Senior Community Manager
for the Brightspace Teaching and Learning Community
2. Upcoming Webinars
Five-Minute Idea Exchange
for Teaching and Learning
with Brightspace in Higher
Ed
• Tue. Nov 3 at 3:00 ET
• Various D2L Community Members
No Muss! No Fuss! How to
Become a Quality Matters
Star Using Brightspace
• Tue. Nov 10 at 3:00 ET
• Jane Sprangers, Hennepin
Technical College
5. Web Accessibility MOOC for
Online EducatorsCollaboration between
Portland CC and
Brightspace Teaching and
Learning Community
Free on D2L Open Courses
Just Started! Not too late
to get in.
5 weeks of active course
facilitation, with more
time allowed if needed
6. WAMOE
Two certificate levels:
1. Honors
2. Highest Honors
Mostly activity-based
learning
Facilitated by Karen
Sorensen of PCC and
Barry Dahl of D2L
Twitter hashtag:
#WAMOE
7. Brightspace Teaching and Learning
Community (TLC) Webinars
Hosted by Barry Dahl
Webinar Archives Available at
bit.ly/TLCwebinars
8. Let’s Get Started
Using Web 2.0 Tools inside Brightspace,
with an Eye on Accessibility
Barry Dahl, Senior Community Manager
for the Brightspace Teaching and Learning Community
9. Mea Culpa
My most popular presentation
over 10 year period.
Mostly ignored issues related to
web accessibility.
Have embed code, will travel.
10. Mixed Content – Browser Issue
Brightspace Learning
Environment is a secure site.
https://
Embedding content from an
unsecure site (http://) creates
a mixed content issue.
11. Embedded Mixed
Content in
Brightspace
The blue custom widget is
an embedded audio file
using an audio player from
an unsecure site.
It doesn’t show up at all
on the page.
12. Unblocking Mixed Content
Each browser is a bit different
This photo is from Firefox
If you disable protection, you
can view the embedded
content
13. Unblocked Mixed
Content in
Brightspace
The embedded audio file
from an unsecure site in
the blue custom widget is
now visible.
Many students will
struggle with mixed
content.
14. Better Idea: Use
only Secure
Content
There are a growing
number of web-based
tools that have made their
sites secure.
Avoid mixed content
whenever possible.
15. Examples of https:
sites to use
• Google Docs & such
• Zoho Docs, Sheet, Show
• YouTube embeds
• Internet archive audio
embed
• Storify curated Tweets
• Diigo tag cloud, Trello,
Soundcloud, Zotero
16. However!
Embedding external content
from an https: site is great and
all that, however…
Now we come to issue #2
Is that content accessible to
students using Assistive
Technology or those who rely
on keyboard-only access?
17. It’s Not Just One Issue
• Today we will focus on the top issue listed below. The others are
also very important:
1. If you are using a web-based tool to create course content or
an embeddable object into an online course, is that content
accessible to students with disabilities?
2. If you are having students use web-based tools to create class-
related work, are the creation tools accessible to them?
3. If you, as instructor, rely on assistive technology (AT) to do
your work, will these sites work with your needed AT?
18. Example #1 Prezi
“Prezi helps you organize
your thoughts and deliver
them in a clearer way that
really makes an impact on
your audience and helps
them reach that ‘ah-hah’
moment faster.”
Peter Arvai CEO & Cofounder
19. Embedded Prezis are Inaccessible
• The text in this presentation
cannot be read by a screen
reader program.
• The image cannot have alt
text applied in the Prezi
interface.
• On the plus side, you can
advance using keyboard
shortcuts.
20. Prezi Talks about Accessibility
• When asked (by a WAMOE participant!) whether they have a VPAT
(Voluntary Product Accessibility Template) that highlights their web
accessibility features:
• “I'm afraid we don't currently have a VPAT for Prezi. Prezi is not ADA
compliant.” source: bit.ly/preziA11Y
• “I'm afraid the platform that we use cannot be read by accessibility
software. Section 508-conformance is not in our current plans.” (same)
• 5 years ago: “Our goal is to make Prezi easily accessible and usable to
everyone.” source: bit.ly/preziA11Y2
• 5 months ago: they confirmed that they have made very little progress.
21. Is this the Answer?
• Does the lack of
accessibility mean that
you should stop using
Prezi for all online
course purposes?
• Probably not.
22. Is this a Better Answer?
• Rather than stop using
Prezi, also consider
providing an alternative.
• Possibilities:
• Same content in an
accessible PPT file
• Export Prezi to PDF then
make the PDF accessible
23. Prezi Score
38%
• What does that mean?
• That is the score for Prezi by the accessibility reviewers at
Web2Access, an awesome resource from the University of
Southampton. URL: www.web2access.org.uk
25. Example #2 Slideshare
LinkedIn’s SlideShare “is a Web 2.0
based slide hosting service. Users
can upload files privately or publicly
in the following file formats:
PowerPoint, PDF, Keynote or
OpenDocument presentations.”
…Wikipedia
26. Embedded Slideshares are Inaccessible
• The text on this
presentation slide cannot
be read by a screen reader
program.
• The slide is an image and
cannot have alt text
applied in the Slideshare
interface.
27. Slideshare Score
67%
• Biggest obstacles?
• Each slide is an image. No way to add alt text to image
• Embedded slides not read by screen reading programs
• Slide/speaker notes are not available through embed
• They are available on the Slideshare page, but tough to navigate to
28. Workaround for Slideshare?
• Make the original PPT
accessible to screen readers
• Upload to Slideshare and
embed for sighted users
• Provide link to accessible PPT
for students using assistive
technology and keyboard-only
access
29. Example #3 Wordle
Wordle is a toy for generating
“word clouds” from text that
you provide. The clouds give
greater prominence to words
that appear more frequently
in the source text. You can
tweak your clouds with
different fonts, layouts, and
color schemes.
…wordle.net
30. Wordle Clouds are Complex Images
• The text in this screenshot
cannot be read by a screen
reader program.
• You cannot apply alt text
to an image at Wordle.net
• Wordle users must supply
their own alt text
31. Wordle Score
Not scored yet
• Biggest obstacles?
• Everything with Wordle is an obstacle
• You have an image that is difficult to describe, unless you
simply provide all the important text elements, including
information about frequency of occurrence
32. Workaround for Wordle?
That depends:
• Is it just eye candy (decorative)?
• If so, then accessibility is irrelevant
• Is it informative?
• If so, then provide alternative text as
either
• Surrounding text
• Alt text with image (if brief amount of text)
• Long description
33. Example #4 Twitter
“Twitter is an online social
networking service that enables
users to send and read short 140-
character messages called
"tweets". Registered users can read
and post tweets, but unregistered
users can only read them.”
…Wikipedia
34. Embedded Tweets
are Readable by AT
• The tweets in this custom
widget on a Brightspace course
home page can be read by the
JAWS screen reader program.
• Links are clickable
• Keyboard-only access works
35. Twitter Score
82%
• Biggest obstacles?
• User generated links in tweets are usually cryptic and
shortened
• Tab order is generally good and logical, short cut keys are
offered but no skip navigation link
• Tweets included images might not have sufficient text
36. Making Twitter Even Better
• Easy Chirp
• Was called Accessible Twitter
• works with keyboard-only, older
browsers like IE8, lowband internet
connection, and without JavaScript.
• Tweet an image with a caption and
long description.
• See all a11y features at
• www.easychirp.com/features
37. Posting photo with
Easy Chirp
• If this photo was being
tweeted for a class, the long
description is an
opportunity to explain its
importance in more than
140 characters.
38. Test the Sites You Use
• Go to Freedom Scientific dot com
• Select Downloads link
• Install JAWS on your PC
• 40-minute trial version can be re-
used after a PC reboot
39. Totally Free Screen Reader
• NVDA (NonVisual Desktop Access) is a
free “screen reader” which enables
blind and vision impaired people to
use computers.
• Normally screen readers are
expensive, making them unaffordable
for many blind people. NVDA has
been downloaded 70,000+ times, in
43 languages.
• www.nvaccess.org
40. External Content in Custom Widgets
• Each of the custom widgets on this screenshot can be
read by the JAWS screen reader.
• Going clockwise from top left
• Text with Zoho Writer document (or Google Doc)
• Semester Countdown with Zoho Spreadsheet
• Audio player, with HTML5 audio code
• Or Internet Archive embed
• Curated Tweets with Storify
41. A Few Parting Thoughts
• Most of these web-based tools are under no legal obligation to
improve the web a11y of their sites.
• Even having an offering targeted at education (Glogster, Prezi,
Edublogs, etc.) doesn’t mean they are looking at a11y.
• It is up to the educators to provide learning resources that are
accessible to their students.
• Being proactive in the provision of alternate means of accessing
learning materials is the smart and caring approach to take.