Hi, I'm Randa Keeley.
I’m a supervisor in the teacher education department and in the special education program.
Hi, I’m Ken Boonme.
I’m assistant professor in the College of Business.
And today we’re going to be going over some accessibility tools that are available
in Canvas, and also best practices that you should do in work.
Okay. So, the agreement to follow the list of frameworks and that’s what we’re going to use as a structure for
this presentation today. And the list framework,
sorry, stands for links, images, structure and tables.
So, to ensure your course is accessible to all students, we encourage you to check
your list or your links working on your images that have alt text for them is the structure
of your course accessible and our tables that you use in your course accessible.
The first thing we’re going to look at are links, and specifically how to use the links.
To insert a link, a hyperlink in your Canvas course, you just need to click the interlocking
chain icon above selected external links or course links. In this select external links
and you will copy and paste in your own in the box and click done. If you are inserting
post links, then you collected the question of the course link from the menu on the right
and you clink google item and you make sure insert. I’m going to show you now.
So, as you can see, this is the interlocking chain. If I want to insert a link to from this word
in particular, I would just click the interlocking link and if it is an external login, then I would
just need to copy and paste the URL here and then click done. But if I wanted to attach
something from the course, I insert the course links and you can choose from any of your
pages, assignments, quizzes, announcements, discussions, modules, or any kind of course
navigation, you would click these and select the one that you wanted to attach to this.
For example, if I wanted to attach module two, I would click it and it would provide
that link for me. Another thing that you want to remember about what we're thinking is where
the equivalent. So, for example, you have to follow this link to sign up for a free account at Canva.
The reason that we put it here is because it describes where the link
will actually take the students. So, if a text figure is reading this, then you will
be able to see the texture would indicate that that link would leave that students to Canva.
Here’s another one, click here for Document X. This also indicates that the students
where they are putting for wiat. These are correct links, incorrect links, they follow
this link, this link is not very specific to where that link will take the students.
And then also click here for Document X. Again, click here is not very specific about where
that’s like go to for the student. So, some link practice, wherever you place the link
in these two examples, please click here for a description of this assignment.
If you want to place the link where the actual URL with a description of where the link is going to
take the student, then we would probably put our link here. Also, down here, use the scenario
down here for your LRE recommendation. So this time, this scenario is what we’re what
the link will take the students to, so we might put our link here.
Another part of making your course accessible is on this next page in these, this includes image descriptions.
So, image descriptions are if a person has a vision, and there is an image, that person will using a text figure
needs to understand what that image is, it is an image important for the content understanding,
or is this an image that is for decoration purposes?
So, all text is used by a text reader to indicate to whoever is using that text reader what
that image is. It’s a very brief text description for an image, alt text is great because when
a mouse passes over that text, the text readable description of the image to the user.
The reason we use alt text is it can clarify the purpose of the graphic for users.
There are some different notes as it relates to alt text, for example, and a very brief text description.
This is just a label. So, if the author the image is a picture of the Last Supper, you
would not want to necessarily indicate all the different things that are happening there,
you would want to use a very brief description. If the graph is a simple decoration, then
you would perhaps the decorative border or IV border if that’s what it is, and then
the PDF can be sent as the perfect ground and you would in the web you would use quote,
pulled on the web, in Canvas, maybe a decorative checkbox. If the graphic is informative, describe
it as succinctly as possible. If you want to enter offsets, you need to right click
on your graphic with a PC or use two fingers to click on the graphic with a map, you would
then click Format Picture, Click all text, enter your text and description and in your
title, your versions of word do not have an OK button, the alt text is saved automatically.
So, I’m going to show you how to add alt text to an image. We’re going to follow this document.
And as you can see here, minimize this. As you can see here, we have the picture
of a bear, so in order to add the alt text, once again, I’m going to click with two fingers.
I want to format my picture. I click here, alt text, there’s no need to worry about the title,
just learning about this description. And as I have said, as simply
as possible so the description for this particular text is a bear and that’s it, your alt text is added.
Moving on to the next item.
Checking the color contrast. This is another important piece of information for all presentations.
I have given the number of presentations and
ideas to ensure the color contrast is good whatever PowerPoint they’re using.
Color contrast when creating documents or presentations for your courses, color contrast should be
clear, there should be a clear differentiation between the foreground and the background.
For example, black and white is good, yellow and white is not good because the yellow and
white is very difficult to see. Also [indiscernible] this cannot be transmitted by text
reader in the input system who lost, a lot of us tend to use a color or colors in case
something in a text that a text editor does not understand it, it will just read the text.
It is a combination of color text and symbol. So, we have some help on color contrast provided
several different websites that you can visit. There’s a color contrast analyzer,
then I’ll click this link to show you what this page looks like so that you can analyze your
color contrast and see if you have a good contrast for your presentation. It also [indiscernible] colors that go
well together so we can actually look on this to see what colors
that actually would look good together or having good color contrast.
There’s also color simulators. So, like to see perhaps what, what it would seem like to have color
blindness and you can, you can visit this website and check out what it might be like for you.
So, here’s an example of low contrast colors. And you can see how difficult these
are green and decipher. In comparison to this, we have some high contrast. But these are very visible,
very easy to see and they are easy for reading and good for any format or any person.
This helps to make the content much more accessible. Whereas, if you had
a presentation with this color contrast that it might be more difficult
for anyone relates to access the information.
Moving on, I’m also going to demonstrate for you how to add headings.
The use of headings can add emphasis to information that you’re providing in
your Canvas course and it will indicate -- your text reader would indicate what level of heading
this is for the student. It could provide an organization for this student, it can provide
a means of understanding where emphasis is in a document or in your Canvas course for students.
Tables are very simple. They’re very easy ways to differentiate between different
types of content in your canvas work and they are very easy to insert. I’m going to show you how to do them.
So, to insert a heading, you simply click the paragraph brought from here.
And [indiscernible] . You can either select this before you begin entering text
or highlight the text and select the heading level that you would like to use.
So, if I were to add into this document headings, I can put, highlight it, and I can change it
to any type of heading that I want to add, very easy user friendly.
The different type of heading is a new heading indicate the text reader and a new topic is beginning for the
listener and can greatly assist in the comprehension of reports for those students that need a text reader.
But it also provides the other we mention for all students.
All right, I’m going to switch over to my art, which is going to be the tables of the list and.
Okay. So, for my part, first I want to talk about how to make tables in your course accessible to
low vision users. Second, I’ll cover how to use the Accessibility Checker tool in Canvas
to check your course content for any accessibility issues. When building tables in a document
or in a course, you need to format the tables for accessibility. And the first thing you
want to do is for tables, you need to make sure that they have column headers.
Because column headers provide structure and allow for a screen reader software to navigate the table.
Using the column headers is a benefit for not just, you know, low vision users,
but it is for everyone. We can -- we suggest that you make your tables simple and not complex
by using merge cells or anything like that. And also with spelling, you want to kind of
spell all the words out. You can see here on the on the screen we have – I have two
examples of incorrect or a non-accessible table, and a correct table which is more accessible.
You can see here at the top there for the incorrect table where I’m not, where I haven’t
used the column header. So, what happens when a screen reader reads that, it will just kind
of read it as regular text and not tell someone who has low vision that this is a column in
a table, and the rest of the items that are below that column are related to that column.
The second part when it comes to tables, is you need to make sure you add captions that
describe the content. A title or a summary will help students understand the context
of the table. So, as you can see here, the first table that I have the incorrect table,
there’s no title or summary to describe what that table is. So, as a text reader,
it would just say table, and then read kind of what’s in the table compared to the correct
table, it has a title at the top of the table that will give the student some context.
And this is not just for a specific group of students, this actually would help out all students in your class.
Below, I’m going to kind of run through example of screen reader reading
through two tables. The first table is a correct table with column headers and titles.
The second table is going to be a, what we call an access or a bad table which is doesn’t
have the column header. So, you kind of watch -- kind of listen to kind of what the screen
reader reads so you can kind of see what a student really
has to deal with if they’re low vision and using a screen reader.
So, this table easier to understand when using the screen reader because the column headers
are indicated in the HTML code and the cells are not merged. Adding the word "Week" in column one cells
also makes the information flow better when it is read aloud by this screen reader. Using the word "to" in the
chapter assignments instead of of a dash and spelling out the month in the due date column
also make the table more understandable when read by assistive technologies like a screen
reader. Table with three columns and six rows. Week, Assignment, Due date. Week one reading
Chapters 1 to 3, January 20th Week one post introductions to discussion was January 20th.
Week two read Chapters 4 to 6. February 1st week's read chapter 7. February 8 read three
paper from February. Nine table that’s heading level three back table this table is more
difficult for online students to understand because the column headers are not labeled
in the HTML code. And then move cells introduce the reader motor of the abbreviations is not
very clear. Table with three columns and six rows a week assignment through they once read
in Chapters 1-3 to that, 21st introductions, the discussion was to read chapter 4, 5, 6
steps, 13 read chapter 7 step, 8 paper do again, 9 table then copy 2000-2012 Community College vertical.
So, hopefully you’re able to kind of follow that video and see what actually gets read in a screen reader
for a student that is low vision.
The next part, or the next part that I want to talk about is using the Accessibility Checker in Canvas.
So, Canvas has an accessibility checker in the rich content editor, so when you are creating
any pages in Canvas, if you click up here and on edit it will give you tools that will
allow you to check to see are there any accessibility issues? And so, the Accessibility Checker
icon is this little icon right there’s this person with a circle around it. And if we
click on that and if your page does not have any accessibility issues to it, then you get
this kind of pop up window says congratulations, there’s no issues, and you can go and you can move on.
Now, I want to show you an example where what I’ve done is, I’ve pasted my
syllabus into a page in Canvas, and I have not done any kind of accessibility functions
inside the syllabus. So, I’m going to click on edit and then I’m going to come down
here and I’m going to click on the Accessibility Checker tool. And you can see here the Accessibility
Checker will give you that it will identify the issues and you can see here I have 14
issues in my page. It’ll identify the issues. It’ll give you kind of a description of
what is wrong with the accessibility that’s checking that is checking for, and you can
see here where the, this one is saying the image should include an alt text, such as
Dr. Healy said, you know, we need, for your images you need to have alt text so that when
someone when a screen reader reads it kind of describes what the picture is. And here,
so, instead, I’m going to do, I’m going to add in the alt text, textbook.
I’m going to do one more if you click on next then you can see here the Accessibility Checker has
identified another issue and you can see here that, it’s saying that this table needs
a caption. So, you know, the table doesn’t have a caption attached to it. So, when a
screen reader reads it, it’s going to not identify what this table really means.
So, student learning outcomes is what I’m going to do. So, it’s kind of nice because it
also, you know, the Accessibility checker allows you to quickly fix any of these issues
and kind of make sure and allows you to kind of move on and apply it.
So, I’m not going to go through the rest of that, but that is my part of my presentation and
I think that that concludes what we have to share with you today, you can simply follow the list
framework and make your Canvas course a lot more accessible. We’ve demonstrated several
of the accessibility features that are available to user canvas as well as how to use those
with examples and non-example. So, hopefully, you can find at least a bit of this information
helpful for you as you get ready for your fall semester and future semesters.
Thank you for joining us.