[music]
Good morning, everybody! My name is Jacob. We're gonna tell you a little bit
about the Techrangers team, starting with what we do, and then mostly about
accessibility because that is our primary focus. We work on course content
and other types of interactive content for courses, but everything centers
around accessibility. We make sure that all the content is accessible before it
leaves our doors. We also do those emergency requests at the beginning of
the semester. We do proactive accessibility combinations in courses.
That's our that's our big focus. We also do some training and
community outreach. For example, we have tech times, which are technical
presentations that we give to students, faculty, staff, and the rest of the
surrounding community. We do have one on November 29th and that is going to be a
more in-depth demonstration of UDOIT, as well as a hands-on workshop.
Basically, you'll scan your course with UDOIT and we'll walk you through the
process of remediating any issues that you found. Then, we also have a Facebook
and a Twitter and then we have our website if you'd like to learn more
about our team, actually see the faces of all the Techrangers, that kind of thing.
So, before we get into the details of different accessibility issues you
should be looking out for, I wanted to cover a couple things real quick. First
off, all content in your courses needs to be accessible to all students regardless
of disability. It is the Faculty's responsibility to do that.
But, we're here to help CDL and other departments around campus are here to
help you make your content accessible. A couple of common misconceptions
about this, you can still use multimedia in your course. It just requires a little
bit of extra work and every student will be better off for that little bit of
extra work that you put into it. There are more students with
disabilities at UCF than you might think. They affect more of the University
than you might think. So, let's look at some numbers. So, this is the University
headcount, the student headcount, for Spring 2017. If you see that little
blue sliver over there, that's three percent of the student body is
registered with student accessibility services as requiring an accommodation
of some type. That doesn't seem like a very big
number, but if we look at how many courses those students are taking in
that same semester, out of the 7,000 some odd courses that were offered, 41% of
those had at least one student in them requiring an accommodation. Then if
we look at faculty, we can see that 71% of faculty had at
least one course with at least one student requiring an accommodation. So, 3%
of our student body affects 71% of our faculty.
Let's take a look at another little bit of it, you can see on the all the way
on the right there, the column is one student in the course has requested
accommodation. Then, the other columns are percentage of courses or number
of courses that have more than one. So, if you add up all the ones that are
more than one, it's basically half and half. So, half of the courses that have at
least one student have actually more than one and some have over ten.
So, now Jesse's gonna go over some of, well, more detail I guess. Okay, so, when we
think about accessibility for our courses,
the for disability, or categories of disabilities that we have up here, those
are cognitive, visual, auditory, motor. [audio fades away]
Sorry about that, we're gonna go through each of those and talk about strategies
for how you make your content a bit more accessible.
So, first up we're gonna look at cognitive disabilities, things like
dyslexia, ADD, ADHD, and also visual comprehension. So, the strategies that
we've outlined there are fairly standard. Basically, what we want to do for
dyslexia is avoid using justified text because that can add weird spacing to
your content and make it hard for students with dyslexia to read. With ADD and ADHD, we
want to avoid long documents and break it into more digestible chunks. Then,
with students with visual comprehension issues, we want to avoid using images
that are unnecessary as much as possible. Not to like clutter the screen. Next up,
we've got visual disabilities, things like blindness, color blindness, and low
vision. We're going to talk about color blindness and low vision in a second but
right now you can see that format content for screen readers tip. We've
actually taken a recording of a screen reader reading out a course, or the
course template syllabus, and this is going to be at about 300 words per
minute. That is the average speed of like an advanced screen reader user. So,
just take a take a listen to this really quick. [screen reader playing]
[screen reader playing]
[screen reader playing] Well, essentially, the readout is extremely
fast. It's hard for us to understand it and we recorded it. So, you can imagine
how difficult it is when content is formatted improperly, right, to understand
it if it's going at that 300 words per minute.
Next up, we want to talk about color blindness and contrast specifically. So,
as you can see on the left, we've got the examples of good contrast: the white on
the black and the yellow on the blue. I mean, as you can see, those are like
pretty clearly defined. But then, on the right, we've got some examples of bad
contrast. That's hard to read, even for us, those among us who don't
have color blindness. But, if you did have color blindness it might look something
like this. It's actually a lot clearer on the slide,
thanks to the contrast settings. But if you were looking at my screen, it would
be almost unreadable. But, you can see the examples on the left, they still stand
out pretty well. So, essentially the strategy for dealing with colorblindness
is to use color as little as possible if you don't need it. But, if you do want to
use it which we understand you guys might, we have some tips on how to do
that. We've got two examples of how not to use color and then one example of how
you should. As you can see, those course objectives where you've highlighted some
stuff with some color, you can see objective 1, the text is red and that
super important bit and that's trying to signify, right, this is you know important
this is visually distinct from everything else and that may seem okay.
But, unfortunately, that red isn't going to transfer to a screen reader, so
students with screen readers aren't going to know that that's important.
Objective 2, the same thing we've background it with green and
unfortunately that is also not going to transfer and now we've accidentally
introduced a contrast issue. Now, that's kind of hard to read. But finally,
we have the right example, objective 3, where we've bolded that text and made it
red to add some visual distinction to it. That bold text will transfer to a
screen reader and also italics will transfer it to a screen reader.
Next up, we're gonna talk about low vision. So, this is students using like
screen magnifiers, things like that, to see things better. Basically, the
takeaway here is that text inside of images won't scale appropriately when
used in conjunction with a screen magnifier. So, as you can see, that
University of Central Florida bit, it's kind of like blurring. So, imagine
if you zoom in further and further to that it's not going to get any clearer.
However, text outside of that image, as you can see, that HSA6188 bit,
that scales appropriately. When you look at strategic management, that's
crisp. So, basically, important text that you
want your students to be able to read for sure, put that outside of your images.
I'm gonna pass it off to Jacob to talk about some auditory accessibility issues.
Alright, sorry for the technical issues there. It's a
big impact that one slide. I assume these slides are going to be uploaded to
the course, so I encourage you to go back through it and listen to that slide
after because it's really interesting. But yeah, auditory
disabilities. So, we're going to focus on closed-captions and transcripts. So,
closed-captioning, normally at least in this setting, we're
talking about web video. Most likely, YouTube or there's some other video
services out there that you might use. For YouTube specifically though, it tries to
trick you into thinking that you have proper captioning. So, if you look at this
video right here, there's a CC button in the bottom right
corner. If you found this video you might think, "oh man, we're great,
there's closed captioning." But, if we actually click on that CC
button you might see one of two things, and this is specific for English,
obviously other languages follow the same format. The one on the left shows
that that video actually does have real English captions because it just says 'English.'
The one on the right has auto-generated captions, which we like to refer to as
craptions because they're generated by a computer. From some of the
things I've read, they can be like 95% accurate under absolutely perfect
condition. Really good audio quality, really clear speaker, no accent. Because a
lot of these algorithms get tricked by accents. So, that quality can
degrade very quickly. So, if you want to use a video that only has auto-generated
captions, watch the whole video and look at the captions. If they're okay, then you
can use them. If they have a lot of issues, then you want to talk to your
instructional designer. Audio transcripts are a lot easier. You
can really just put the audio transcript right into the page with the the linked
audio. Now, you would have to transcribe the audio if a transcript didn't already
exist. So, now that we've talked more about
the kind of things that the disabilities that you should be thinking
about, Jesse's going to talk to you a little more about things you can
actually do to your content. So, as you can see here, we're
telling you the proper formatting to make your page content more digestible and
that is absolutely true. Your content and readers motor
disability navigation tools, magnifiers, things like that, and we're going to give
you some some general guidelines and techniques that you can use with your
content to make it properly formatted. We're gonna go over some formatting
errors that we see a lot. Those are images without alt text, using tables for
layout, tables without proper headers, improperly formatted PowerPoints and
Word documents, and then untagged or image based PDFs. We're just going to
go through these and give you some solutions for them. So first up, we have
images without alt text. How many of you are familiar with alt text at all?
A couple people, okay. So, basically alt text describes an image for a screen
reader, so that when a screen reader goes through that they see that image they
print out whatever that alt text is. So, here it would be you know like space and
satellite or something like that. But without alt text, all it will do is read
out the filename of that image. So, you know, if you have a more visually complex
image, that's not gonna you know be sufficient for your students. So, what we
can do is we can add alt text through the rich content editor in Canvas. So, you
see we've got an image already embedded. So, in this case we're gonna highlight
the image, and then click that embed image button in the toolbar, and then
that'll bring up that pane on the right. Then, you can see under attributes we
have that alt text field and then we can write out a description of our image and
then click Save or update, rather. And the process is similar for when you're
embedding an image for the first time, you would just follow that process when
the pain comes up for the first time. Next up, we have using tables for layout.
We see this a lot because it's a lot easier honestly to use tables for layout.
But, unfortunately, that doesn't translate well to screen readers at all. They
expect tabular data to be in tables, which makes sense. So things like this,
where we have an image on the left and then some text on the right unfortunately
it's not going to work. If you do want to create complex layouts though, talk to
your ID and they can either help you out or they in touch with us and we can help you
out. Next, we have table headings. So, like I
said, screen readers expect content in tabular or they expect tabular data in
tables and for that to work properly though, we need to add headings to our
tables where applicable. So, in this case you can see we've got some clear
headings. We've got the days of the week and we've got some names on the left. But
right now they're unstyled within canvas which means that it's not being treated
as a heading at all. But what we can do is we can click inside of that cell. I
don't know if you see the cursor in Monday. Then, we can click the table icon
in the toolbar and then that drop-down will come down we'll see cell and cell
properties. Then, that pane on the top right will come in. The things to
pay attention to there are cell type and scope, which are in the middle of that
cell properties dialog. Then there, we're selecting 'header cell' because
we want to mark that as a header. Then, we're selecting the scope of it, so whether
a header. I don't believe there's a way to do it all automatically. But,
that's something important so that your content transfers correctly to
screenreader. Next up, is PowerPoints and Word
documents. These are actually pretty accessible by themselves. But it's
important to kind of stay within the constraints of those programs. For
PowerPoint, that means using the slide layouts as much as possible and just to
keep in mind that any like additional content, like text boxes that you add or
something like that, that's going to be read out in the order that you edit it
in by the screen reader. Then, the same thing with Word documents. We want
to use the built in styles as much as possible. Don't go out and you know bold
things by yourself or you know increase the size. You can use the 'styles pane'
which is on the right. Then, if you want to make a heading, you can select
like heading 1. If it's a subheading, heading 2, title, things like that.
Finally, we're gonna talk about PDFs. So, on the left, you can see this example of
an image based PDF. I mean you see like some handwriting in the bottom left. So,
there are two things kind of wrong with this that make it inaccessible. The
first is that there's no real text data to that, right? You can see that's like
handwritten. So, that's not going to be readable by someone with a screen reader.
And then also, you've got issues with like the resolution of scanning a PDF.
That is not going to work well with a magnifier. Right now it's hard to read
but blowing it up it would not work out very well at all. Then on the right,
we've got an example of a PDF that has been tagged so it has text data on it.
You can tell that a PDF is tagged by highlighting the text within it. Just
drag your cursor over it, hold down, and in that case you can see that, okay, you
know, this is all highlightable so it should be good. But, you need to make sure.
So, the way to do that is to just copy and paste that into like, you know, a
word document or something like that and make sure that that text transfers
appropriately because PowerPoints, or not PowerPoints, I'm sorry.
PDFs, the process that they use to transfer images into text it's called
OCR, optical character recognition, and that's a complex algorithm and it
doesn't work very well all the time. So, basically as you can see, we've we've got
some text data on the left image where it seems to be okay but you can
kind of see it's like broken up, it's missing some sentences and then it kind
of just skips a whole paragraph. So, ignoring the structural changes, we
pasted it over on the right, you can see that there are like some weird
characters in there and it didn't actually transfer very well. So, you can
imagine how difficult that might be for a screen reader to output if it doesn't
have real characters. Finally though, we're going to pass it
off to Jacob who's going to give you a demo of that tool UDOIT that we
built that does a lot of this automatically.
Alright, so how many of you have used UDOIT already?
Nobody? A couple people? Okay. Hopefully, the IDs have.
So, let me go into one of my courses here. So, UDOIT is a...
UDOIT is a tool that we developed here at UCF in response to basically all of
the requests we were getting, emergency requests for accommodation, we needed a
more efficient way to go through those courses and find any accessibility
issues that might exist in them. So, we developed this tool to be easy to use
and accessible to all faculty. It's not visible to students at all. But if you go
to the side menu of your course, you'll see UDOIT is there. You might have
noticed that before, kind of wonder what it was. We do explain a little bit about
what it is in the main screen here. But, I'll
give you the very quick version because I think we're running out of time. But
basically, you can select the content that you want to scan. You can click run
scanner. And once it's done, you can go through each section of your course, each
page, each HTML file, and the big limitation that I need to mention though
is that it only scans rich content editor type content. So anything in a
discussion, that kind of thing, but it does not scan PDFs or Word documents. That's
like a whole other bag of worms or a can of worms, rather. Anyway, so,
that's a very quick quick demo of UDOIT. I wanted to
go back here, real quick.
So if you, have any more questions about
accessibility, you want to look something up that we talked about, you can go to
https://cdl.ucf.edu/teach/accessibility/ and that will give
you a lot of the information that we just talked about. If there's anything
you missed, obviously, you'll have the slides and you can ask you the IDs
as well. Obviously, Webcourses@UCF support is available.