tr_jbates
Community Champion

This is a very tiny update that fixes an issue with false positives and Vimeo videos.  Previously, UDOIT was only detecting Vimeo videos embedded in an iframe because the URL was of the form "https://vimeo.com/player/########".  However, when you simply link to a Vimeo video, it's in the form "https://vimeo.com/########".  UDOIT was detecting those Vimeo video links, but not properly checking them for captions, resulting in a false positive.

This release does not require any changes to your localConfig file, migrations for your database, or updates to packages.  However, you should still test it on a test installation of UDOIT before moving it to production.

To download, visit Release v2.3.5 · ucfopen/UDOIT · GitHub 

more
3 12 3,147
mtuten
Community Contributor

Hi all. So, if you are/have attended InstructureCon 2018 and were able to attend the "Y'all Do It: Crowdsourcing
Development of UDOIT" presentation, you already know about the UDOIT User Guide and about how you can contribute to it. For the rest of y'all, here is what you missed.

What is UDOIT?

For those who don't yet know, UDOIT is an automated accessibility auditing tool for Canvas courses that was developed by University of Central Florida as part of a Canvas Grant. To learn more about UDOIT, explore the following links:

Below is UCF's video overview of UDOIT:

Note: Whenever you're installing an initial or new version of UDOIT into Canvas, PLEASE install it to a test instance and make sure it works before installing it to your production instance.
During the intial writing of this post, Clemson had the latest version installed on our test instance, but, because we had not been able to get it to work, it had not touched our production instance and the faculty were none the wiser.

Why Do You Or Why Does UDOIT Need a Guide?

If you or your faculty aren't really familiar with the rules or expectations of digital accessibility, you need a guide. Automated accessibility auditing tools are thought to only catch about 25% of accessibility issues, and UDOIT is no different. There are some things that UDOIT will flag that aren't accessibility issues and then there are some accessibility issues that won't be flagged.

For example, in early versions of UDOIT, all color contrast error reports were based on the assumption that the text was on a white background. If the text was not on a white background, some text colors that would be accessible on white but not accessible on the actual background color would not be flagged, and text colors that were not accessible on white backgrounds but were accessible on the actual background color would be flagged. 

Knowing when you should address or ignore a UDOIT report is important.

How Can You Get A Copy Of The Guide?

This guide is available in Canvas Commons with a Creative Commons Attribution, Non-Commercial, Share-Alike license. Because Canvas Commons doesn't give me a way to track who and how many of your are downloading the guide, please let me know you've downloaded it through a comment in Canvas Commons or here

Jacob and Karen have also expressed that they'd love to know when you've downloaded UDOIT too. So, when you do that, please leave a comment on Github or in Canvas Community (the UDOIT Information page would be a great).

Also, after you've tried the UDOIT User Guide, feel free to leave feedback here or in Canvas Commons as well!
If your feedback includes questions, please post them here instead of Commons as Commons won't allow me to reply to comments.

To access the User Guide, you must first be logged into Canvas. After you've logged in, follow this link:

UDOIT User Guide in Canvas Commons

For those who cannot access Canvas Commons, I have attached a .imscc zip file. You'll need to follow How do I import a Canvas course export package? directions to upload it to your Canvas instance.

To see an Overview of this guide, watch this UDOIT User Guide (v1, 2017) video overview.

What Can You Expect In The Next Version?

We're hoping to update the UDOIT User Guide after 2.4.1 or 2.5.1 is released (which is slated to happen this year). If we're able to do so (see earlier note), you can look forward to the following:

  • Updated information (duh)
  • Updated, cleaner look with (hopefully) simpler code.
  • Tips for using UDOIT alongside Canvas's built-in auditing tool.
  • Possibly other features suggested by YOU!

more
1 5 12.2K
tr_jbates
Community Champion

Wait?  What happened to 2.3.3?  Well, I released 2.3.3 and 2.3.4 on the same day, so I figured I'd cut down on the clutter and do one post.  This one contains a fix for a pretty major bug in 2.3.2, so it's definitely worth upgrading.  As with every release, please test this out on your own test server before deploying it to your production server.

I also wanted to mention that I'll be at InstructureCon/Carn next week!  I'll be presenting with  @mtuten ‌ and  @karen_tinsley-k ‌.  Check out Michelle's blog post for more information.  If you want to catch up with me and/or get a sticker, just look for the guy with a sign on his backpack that says "Ask me about UDOIT".  I'll also be attending Hack Night again this year, so feel free to come by and talk shop.

Anyway, on to the UDOIT update:

Highlighted Changes

  • Fixed major performance bug that caused even small courses to time out.
  • Added documentation for Vimeo API keys and Google Analytics tracking codes to  README.md and  HEROKU.md
  • Added support for PHP 7.2 and cleaned up documentation to remove references to 5.3 and 5.4

See the release notes for UDOIT Version 2.3.4 for download links.

more
3 0 1,430
george_joeckel
Community Member

Word, PowerPoint, & Acrobat logos.

Enrollment for WebAIM's new course––Accessible Documents: Word, PowerPoint, & PDF––is now open. This online, video-based, independent-study course will be offered in Canvas Catalog and requires between two and four hours of course activity each week, for four consecutive weeks.

Participants who demonstrate their mastery of the course materials through weekly quizzes and exams will receive a Certificate of Completion. These certificates will allow individuals and/or organizations to document training and proficiency in creating accessible web documents in common formats.

The first cohort of the course starts on Monday, July 9th. New cohorts will start on the first Monday of each month. To enroll go to Accessible Documents: Word, PowerPoint, & PDF | July 2 - October 3.

A promotional code* for 20% off the $125 course fee is available for the first cohort of the course. Use the code "LAUNCH". For more information, visit the Document Accessibility Course page on the WebAIM website.

WebAIM_ web accessibility in mind

*Valid July 2 - 10, 2018.

more
2 0 1,748
jfenton
Instructure Alumni
Instructure Alumni

Hey Everyone!

One of Instructure’s core values is openness. We believe that great ideas can come from anywhere and that one of our greatest assets is you—the amazing Canvas community. It is from this belief that the founders of Instructure decided to make Canvas an open source LMS. As we continue to add new capabilities to Canvas, we’re committed to making them available to the open source community. Not only do we work hard to publish the code for Canvas, we also allow anyone to jump into github and make contributions. We review every single pull request that comes in, and numerous community projects have been added into the core product. To everyone who has helped make Canvas what it is today, THANK YOU! To anyone who hasn’t yet contributed, we invite you to dive in and give it a go!

In fact, that’s the core message of this post: we’d like to encourage even more people to make contributions to Canvas, and we’re actively working on ways to make it easier for you to do so. We’re extremely grateful for all the pull requests we receive, and we’d love to have even more. And, as it turns out, we think we might have a good project for new and seasoned contributors alike.

We recently released a new tool to help identify accessibility issues when creating content in Canvas, called the accessibility checker. It runs in the Rich Content Editor (RCE) and detects several of the most common accessibility mistakes that users make when creating content. In addition to alerting the user about any issues, the checker also makes it easy for the user to resolve the concern.

279411_Screen Shot 2018-06-05 at 3.52.44 PM.png

Currently, the tool checks for 11 different accessibility errors. We’re passionate about accessibility, as we know many of you are, and we’re optimistic about the potential that this tool has to raise awareness and education on the importance of accessibility. The accessibility checker has been fully open sourced, and everyone is invited to check it out on github! We’ve added several items to the project, some of which have been identified as good projects for beginners to tackle:

Project Ideas:

  • Don’t combine words when merging sequential links
  • Add “Auto Fix” button for resolving color contrast issues
  • Link Validation
  • Check for ordered and unordered list structure
  • Check that headings have appropriate tags
  • Check links for descriptive words
  • Check videos for captions

Besides the items that we’ve added, we’re sure many other great ideas will come from the community. Please feel free to share this project with developers or anyone you know who might be interested in seeing this project move forward. Is your computer science class looking for a worthy project? Maybe this is it.

As we work together, we’re confident that this tool will be a positive driver in making learning content more accessible for everyone.

more
19 0 4,213
tr_jbates
Community Champion

This release removes support for PHP 5.4 and 5.5, fixes some bugs, and adds some convenience features.

Highlighted Changes

  • Supported PHP versions:  5.6, 7.0, 7.1
  • Added a configurable maximum size for files before they are marked as "unscannable".  This is mainly to prevent server and database issues, but also promotes best practices for students on mobile devices or slow internet connections.  Default value is ~50MB
  • Added a configurable value for the maximum allowed length of ALT text.  Default value is 125 characters. (Thanks  @szw151 ‌ for suggesting it!)
  • Added detection of captions in Vimeo videos.
  • Added detection of Dailymotion videos.  It will create a suggestion for every video found regardless of the presence of captions.
  • Added a Report Summary that contains totals for each type of error and suggestion.
  • Added "download" and "view in folder" buttons for each unscannable file.
  • Updated outdated links to accessibility resources.
  • Clarified phrasing for closed caption errors.

For more information, and to download the latest release, visit the v2.3.2 Release Notes.

If you previously installed v2.3.0, please follow the "Existing Installations" instructions in the v2.3.1 Blog Post.

more
5 6 2,624
tr_jbates
Community Champion

This release is mainly bug fixes for the migration scripts from 2.3.0.  Big thanks go to Santa Rosa Junior College for discovering and fixing most of these.

Existing Installations

If you previously installed version 2.3.0, you will need to perform the following actions manually:

  • In the reports table, add a report_json field of type MEDIUMTEXT if it does not already exist. If it already exists, change the type to MEDIUMTEXT
  • In the job_queue table, make sure the results field is of type MEDIUMTEXT

If you are upgrading from an existing installation (including 2.3.0), follow these instructions:

  • Test in a development or QA environment, not on production.
  • Update your localConfig.php file to include new fields from localConfig.template.php
  • Back up your database and run
    php composer.phar migrate

Changelog

  • Fixed bug where $oauth2_id was sent in place of $oauth2_uri during the setupOauth call.
  • Fixed bug where null or empty scan_results were not handled properly.
  • Fixed bug where empty canvas_url fields in the user table were never updated with the proper value.
  • Fixed bug where null values in table row child nodes were not handled properly.
  • Fixed bug with migration scripts where the report_json column was never added to self-hosted instances.
  • Added status messages to migration scripts to help with debugging in the future.
  • Added mobile verbiage to the unscannable suggestion in localConfig.

For more information, and to download the latest release, visit the v2.3.1 Release Notes.

more
3 4 2,369
tr_jbates
Community Champion

Note: There is a known issue with the self-hosted version of this release.  If you are using Heroku, you can safely ignore this message.  View the UDOIT FAILED TO SCAN THIS COURSE thread for more information.  This issue will be fixed in 2.3.1.  For now, we recommend waiting until the next release to upgrade.

This release was mostly an overhaul of the backend with a few visual tweaks here and there.  You might not notice the changes, but they were sorely needed.  As always, if you have any issues, please comment on this blog post so that we can keep everything in one place.

Important Note:  If you are upgrading from an existing installation, there are some specific instructions you need to follow.  Refer to the  full release notes.

Highlights

  • Added support for PHP7 while maintaining backwards compatibility.
  • Enabled usage of a background worker with Heroku, fixing timeout issues and allowing for scalibility on that platform. #292
  • Added version number to the top-right of the banner.
  • Fixed "double scrollbar" issue by making the iFrame height dynamic.
  • Fixed a bug where UFIXIT would stop working an hour after your scan was started.
  • Replaced the UDOIT graphic with an SVG for higher quality and scalability.

Read the full release notes for more information and installation/upgrade instructions.

The UDOIT team wishes everyone a safe and happy holiday!

more
5 0 2,378
snugent
Community Champion

When you create content for your course it is important to make sure you are structuring content in accessible way. The list feature in the rich content editor in Canvas has options for creating unordered and ordered lists. The unordered list is for organizing lists of similar content where as the ordered list option is for organizing tasks that should be completed in specific order. 

Example an Unordered (Bullet) List

In this example I created a list of dog breeds. In the rich content editor select the items you wish to create a list and then in the toolbar select unordered list item option. 

262548_rich-content-editor-bullet-option.jpg

  • Akita
  • Doberman Pinscher
  • Boxer
  • Great Dane

Example of an Unordered List with Indenting List Items

Lists can also be nested using the indent option in the rich content editor toolbar. Select the list items you wish to indent and select the indent option in the toolbar. The bullet style will be different for the indented items. 

262547_rich-content-editor-indent-option.jpg

  • Working Dogs
    • Akita
    • Doberman Pinscher
    • Boxer
    • Great Dane
  • Toy Dogs
    • Miniature Poodle
    • Yorkshire Terrier
    • Miniature Schnauzer 

Example an Ordered (Numbered) List

In this example I created a list of instructions for assignment. In the rich content editor select the items you wish to create a list and then in the toolbar select the ordered list item option. 

262549_rich-content-editor-numbered-option.jpg

  1. Read the following article from the Illinois Online Network website: What Makes a Successful Online Student.
  2. Create a message and answer the following questions: What are your role priorities (student, parent, child, worker, friend, etc)? and How will being an online student fit with your other responsibilities?
  3. Now that you have completed this course what advice would you give to students who are new to taking courses online? 

Example of an Ordered List with Indenting List Items

In this example we are going to create a ordered list with nested items. In this list we are going to display the questions on separate lines and nest them under number 2. Place the cursor before the first question and hit the enter key to create a new line in the list. Repeat this process for the second question. Select the list items you wish to indent and select the indent option in the toolbar. The nested items will also have numbering; however, you can change by switching to the HTML View and changing the code just a bit. 

  1. Read the following article from the Illinois Online Network website: What Makes a Successful Online Student.
  2. Create a message and answer the following questions: 
    1. What are your role priorities (student, parent, child, worker, friend, etc)? 
    2. How will being an online student fit with your other responsibilities?
  3. Now that you have completed this course what advice would you give to students who are new to taking courses online? 

How to Change the Nested List Numbering

In the rich content editor switch to HTML View. In the code find the nested list. In the example below it is line 4. Place the cursor inside the LI element tag and hit the space bar. Then type the following text to create the attribute for ordered list item (type="a").  There are other attributes you can apply. See this reference guide from HTML Dog. 

<ol>
<li>Read the following article from the Illinois Online Network website: <strong><a href="http://www.ion.uillinois.edu/resources/tutorials/pedagogy/StudentProfile.asp">What Makes a Successful Online Student</a>.</strong></li>
<li>Create a message and answer the following questions:
<ol type="a">
<li>What are your role priorities (student, parent, child, worker, friend, etc)?</li>
<li>How will being an online student fit with your other responsibilities?</li>
</ol>
</li>
<li>Now that you have completed this course what advice would you give to students who are new to taking courses online? </li>
</ol>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

(Bonus) Other List Options

There is another list option called the definition list option. This list option is useful for glossary terms. It is important to note this list option is not available as an option from rich content editor toolbar and you will need to edit the HTML code on the page. Below is example of how to write the code. Refer to the resource list below for more details on how to write a definition list. 

<dl>
<dt>3D</dt>
<dd>three-dimensional; used commonly in computer animation, virtual reality, etc.</dd>
<dt>404</dt>
<dd>Not Found error message; a HTTP standard response code, in computer network communications, to indicate that the client was able to communicate with a given server, but the server could not find what was requested</dd>
</dl>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Additional Resources

more
8 1 11.2K
christopher_phi
Community Champion

The following is a blog post version of a presentation I gave at Instructurcon 2017 titled, “Mission Possible: Accessible Course Materials." Video available below, additional resources available at the bottom.

This video has been captioned. You can also download the transcript and follow the discussion on captioning conference videos here.  

Introduction

I am confident that no one has all of this accessibility puzzle figured out, but if you take some time to get to know people in the Canvas Accessibility Community there are individuals with a lot of pieces of the puzzle.

At Utah State University (USU) we have been working on providing more inclusive online course experiences and ensure we are meeting the requirements of a recently approved campus Electronic and Information Technology Accessibility Policy. Canvas does great work towards making the core functionality of Canvas accessibility. Here we are going to focus more on accessible content, the stuff added by an instructor or course designer.

If you are brand new to accessibility or a long-time disability advocate, right now is an incredible time to be a part of this discussion on inclusive educational experiences. Before we get into the what and how of accessibility let’s spend just a moment discussing the why of accessibility.

Why Accessibility?

There are increasingly legal reasons to care about accessibility. However, there is so much more to accessibility beyond consideration of any legal risk. Great accessibility means greater usability and more usable course materials are more learnable for all students. Making sure your content is accessible provides a more inclusive experience for students with disabilities, second language learners and other nontraditional learners. Everyone benefits from more accessible content.

The discussion used to be around why you would take the time and effort to make your content accessible. Increasingly it feels like that question is changing towhy on earth you wouldn’t make your online course materials accessible. Especially with the availability of some of the incredible tools we willlook at below.

Man with backpack on a trail starting on a journey

If you are new to accessibility and start to feel overwhelmed, take a deep breath and remember that accessibility is a journey. It is much more important to get started than to nail down your destination. There is always more to do when it comes to accessibility, but there is also always something you can do today to make your content more accessible.

HTML Content vs File Content

As we talk about course content I want to make sure we are on the same page. There is an important distinction with how these tools treat native HTML content and file content.

  1. HTML Content. When I talk about HTML content I am referring to content that is entered through the WYSIWYG editor that shows up natively in the browser.
  2. File Content. When I talk about file content I am referring to files uploaded to a course such as PDF, Word,or PowerPoint.
  3. Media. Media such as images and video can be present in both HTML and File content.

It is important that we consider both HTML content and File content when looking at accessibility.At Utah State we recently did a quick audit on the type of content in our courses for one semester and found that we had:

  • 101,160 pages of HTML content.
  • 171,433 uploaded files.

If you ignore either type of content a significant portions of your course experiences may not be accessible.

Overview of the Tools

Now let’s look at some tools. All of these tools are different and the goal is not to determine which tool is best but rather to share what each does to help you determine how they might support your accessibility goals.

Design Tools from CIDI Labs

Design Tools (also known as Kennethware) is a commercial product that provides a suite of tools to help with course development. It includes a set of tools to help course developers make their HTML content is accessible at a page level as it is developed.

UDOIT from the University of Central Florida

The Universal Design Online Content Inspection Tool checks the accessibility of your HTML content across a entire course. UDOIT is open source, you can download it today for free and all you have to pay for is the hosting.

Ally from Blackboard

Ally started out as a tool developed for Canvas but was purchased by Blackboard and how supports multiple learning management systems. Ally is a commercial product that looks at the accessibility of course files on a single page, across an entire course or across all of your courses.

Comparisons

General Features

Comparison of General Features of Each Tool
Design ToolsUDOITAlly
PricingCommercialOpen-source, Self-hostedCommercial
Type of Content CheckedHTML ContentHTML ContentFile Content (HTML Content Coming)
Scope of ChecksPage LevelCourse LevelInstitution, Course Level, Page Level

Specific Checks Done by Each Tool

Accessibility Checks Done by Each Tool
Design ToolsUDOITAlly
  • Heading Structure
  • Alt Text
  • Accessible Tables
  • Color Contrast
  • Descriptive Links
  • Heading Structure
  • Alt Text
  • Accessible Tables
  • Color Contrast
  • Descriptive Links
  • Video Captions (YouTube)
  • Heading Structure
  • Alt Text
  • Accessible Tables
  • Color Contrast
  • Descriptive Links
  • Untagged PDF
  • Scanned Documents
  • Document Langage
  • Missing Titles
  • Images that may induce seizures

That's it for now, feel free to look at the slides or watch the video for additional screenshots and explanations of how each tool works. If you have thoughts, feedback or experience with any of the tools please leave a comment below! 

Additional Resources

  1. Mission Possible: Accessible Course Materials PowerPoint Presentation
  2. Presentation Video in the Canvas Community (Thanks awilliams!)
  3. Canvas Accessibility Group (join and participate!)
  4. ATHEN Canvas Accessibility Working Group (Contact Terrill Thompson to join)
  5. Instructional Design Strategies to Make Content Accessible in Canvas by  @teraulbert ‌ from Instructurcon 2017

Notes

This post will be updated as new information becomes available.

more
21 8 10.2K
jessicaa_cosma
Community Novice

   I'll be honest.  I love technology.  But I feel like I am fighting a losing battle sometimes in implementing it in my school.  I am not resistant - just easily broken.  I have 75 minutes to teach my students for an End-of-Grade Standardized Test.  I have so much content to cover, I sometimes give up easily when it comes to the frustrations of technology.  I need to teach, and it the technology is too much, that is the first thing that gets dropped from the plans.

   So, why am I here?  I've fought the system for several years.  I am a Google Suites junkie.  If Google makes it, it is gold to me.  I've used Google Tools for YEARS to get by.  Google Classroom.  Google Sites.  Google Drive.  PURE gold.  My district says Canvas, Canvas, Canvas.  Ok, I'll give it a go....but where am I even supposed to begin?  This isn't seamless.  It makes no sense.  What's a QTI file?

   If you're anything like me, listen up.  Canvas and Google are BFFs.  No...seriously.  I've been taught approximately three hours of Canvas in a course, and I've already texted my teacher friends to tell them how awesome Canvas is and how they can still use all their Google stuff, but without the gazillion files they're going to get submitted to their Drive from Google Classroom.  If you've not been blessed with this life-changing knowledge, then listen up.

   YOU CAN LINK YOUR GOOGLE TO CANVAS!

   You heard me.  You can link your Google to Canvas.  Google Slides Presentations? Absolutely.  Google Docs?  You bet.  And the best part?  It AUTOMATICALLY updates in Canvas when you update in Google. So, if you're brand new to actually giving Canvas a try, like me, let me tell you the one tiny step you need to know in order to be able to make your life full of Google/Canvas magic.  See the magical little V that I boxed in with red below?

241228_pastedImage_1.png

   If you hover over that, it will say "More External Tools" - and once you do that, you will select Google Apps.  Then, you just link your own Google Drive to Canvas, and you can add anything.

   

   Guys, my life is made.  All is right with the world.  Most of you are probably Canvas genius users and already know this, and that's awesome.  I, however, am just now getting my feet wet with Canvas, and I am much more excited to keep learning now that I've learned all of my Google stuff that I've treasured for years and years can be used within Google.  

   And bonus...I can grade Google assignments IN Canvas once they're set up the right way...which means I can link it to the grade book automatically, too. 

   I think I'm finally coming around to the dark side of Canvas, and I can't wait to keep building, learning, growing, and leading through the use of all this wonderful technology.

more
3 0 902
tr_jbates
Community Champion

This release contains many bug fixes, improvements on existing features, mobile-inspired issue detection, and better compatibility with Heroku. This release also begins our new naming scheme, which is based on small towns and areas in Central Florida.

Important Note:  If you are upgrading from an existing installation, there are some specific instructions you need to follow.  Refer to the full release notes.

Highlights

  • Old reports are now stored in the database.  This means that UDOIT will work in environments where file storage is not persistent such as Heroku.
  • Fixed a bug with YouTube caption detection that wrongly flagged videos with parameters in the URL.  (Thanks  @JACOBSEN_C ‌!)
  • Removed requirement for Bower and NPM, making self-hosted installation WAY easier!
  • Added the option to remove color from text emphasized with only color.
  • Added "lighten" and "darken" options to color contrast U FIX IT.
  • Added configurable text to "unscannable" section that suggests converting the files to Pages.
  • Added file size warning for "unscannable" files larger than 50mb
  • Added configurable suggestion for single content items longer than 3000 words.
  • Rewrote much of the color contrast U FIX IT for better reliability.
  • Added more installation instructions, troubleshooting guides, and awards to the README.
  • Re-enabled detection for object tags, since they are still allowed in HTML files.
  • Created the Contributor's Guide.

Read the full release notes for more information and installation/upgrade instructions.

more
5 0 1,042
kmcgee
Instructure Alumni
Instructure Alumni

As a product manager at Canvas, I am impressed by the dedication to creating accessible experiences that our designers and engineers craft every day. That's why I'm excited about our most recent update, DocViewer.

In late May we released DocViewer in Free-for-Teacher (FFT) and Beta environments, with minimal accessibility included, similar to what one would see in all other document viewing and annotation applications. This release enabled us to get feedback and receive any bug reports before transitioning to Canvas production.

On Friday, June 16, DocViewer released improved accessibility functionality that enables students to access annotations and comments with a screen reader, including information about the annotation type, author name, comment, and any reply comments at the end of the document. This release makes Canvas the first accessible annotation and document viewing service available.

The release of this functionality is only the first step of a larger goal to create an exceptional feedback experience that is accessible for all Canvas users. DocViewer will continue to improve with in-document annotations and accessible author-created annotations as next steps.

I look forward to reading your suggestions and feedback as we build these accessible experiences. Together we are ensuring that the right to learn is available for all.

more
12 2 5,436
snugent
Community Champion

Word is the favorite tool of choice for many instructors so in this this blog post I want to share some tips and tricks to make Microsoft Word content more accessible. 

Tip 1: Use Styles!

As you are writing content in Word be sure to the use the styles options on the Home tab of the ribbon to mark up headings in your document. In your document just select your text and select a heading option. You can see all the Styles associated with your document by clicking the little arrow in lower right corner of the Styles group, Structure headings so the document is easier to read. For example in your syllabus you may want to use a heading 1 for your course name and then a heading 2 for each section of your syllabus (description, course policies etc). Then if there are sub categories within each section, use a heading 3. For example, under course policies you may have sub section called netiquette or assignment submission requirements and so on. Learn more about Word Styles in this video tutorial from the Microsoft website. 

Screen shot of Word

Tip 2: Make Sure All Images have Alternative Text

Word makes it super easy to add images to your document so you will want to be sure your images have descriptive alternative text to go along with them for people who use screen readers and other devices where images make not appear. Right-click over an image in your document and choose Format Picture

Format Picture option in Word shortcut menu

The format picture sidebar panel will display. Select the Layout & Properties icon to display the text options. Click the arrow to open the alt text options. In the title add the alternative text. Be sure this text is descriptive of the image. In this case "photo of a panda bear". In the description you can include further details if desired. Read more about alternative text in this WebAIM article about Microsoft Word

Format Picture Panel in Word

Tip 3: Avoid Using Vague Non-descriptive Text for Links

Word makes it super simple to add website URLs to you document. You can just past the entire URL and Word automatically links it up for you. However, this is not good practice. People using screen readers will hear the URL twice and that makes panda sad. Right-click over the link and choose Edit Hyperlink. Tip: When creating new links you can select the text and right-click over the selected text and choose Add Hyperlink

Editing a hyperlink in Word

The Edit Hyperlink dialog box will appear. Next to Text to display change to a more descriptive text option. Don't use the phrase "click here" as this is not descriptive enough. For more tips on creating accessible link in Word, read the Microsoft article about accessibility in Word from WebAIM website. 

Edit Hyperlink dialog box

Tip 4: Make Wise Use of Color

If you want to emphasis text, make sure to use the bold or italics options. You can add color to the text as long as there is plenty of contrast between the text color and background. This is crucial for people who have colorblindness. Review the article, Considering the User Perspective, from the WebAIM website to understand why this design choice is important. 

Importance of text contrast

Tip 5: Use the Accessibility Checker

All of the programs in Microsoft Office suite come with the accessibility checker tool. You can use this feature to double check to make sure your document is as accessible as possible. In Word go to File tab to view the Backstage. Under Inspect Document click Check for Issues and select Check Accessibility.  View this video tutorial from the Microsoft website a brief overview of using the accessibility checker. 

Word Backstage

more
10 3 3,992
tr_jbates
Community Champion

v2.1.1

This release is all bugfixes and code cleanup.  Here are the highlights:

  • YouTube caption detection was updated to match the latest API specification.
  • UFIXIT for files fixed.
  • UFIXIT for table header scopes fixed.
  • UFIXIT form elements have unique IDs to improve accessibility.

Read the full release notes and download the new version on the release page on GitHub.

User's Guide

A huge thanks goes out to  @mtuten ‌ from Clemson University for writing an extensive user's guide for UDOIT!  It contains 6 modules of information, including detailed descriptions and fixes for every error and suggestion.  It's available on the Canvas Commons for free under a Creative Commons (BY-NC-SA) license.

more
11 34 10.7K
tr_jbates
Community Champion

This release touches almost every file in the project.  It addressed security issues brought up by Mesa Community college, added the groundwork for automated testing of future releases, and reorganized the code to make it more modular and easier to maintain.

The changes are too numerous to list, but a summary can be found in the release notes​.  Here are the most pertinent changes to UDOIT administrators:

  • The Heroku install button has been moved to HEROKU.md.
  • The README has been updated with the latest server requirements and better instructions.
  • There are changes required for existing installations.  Please see the release notes for more information.

This update is a very long time coming, and we will be returning to smaller, more frequent updates in 2017.  If you have any questions or issues with this release, please discuss them in the comments section of this post so we can keep everything together and avoid duplicate questions.  Additionally, we have set up a Slack chat if you want to talk to us directly.  (If you're not sure what that is, check out the Slack Website.)

more
5 0 808
tr_jbates
Community Champion

I know everyone will be very busy at InstructureCon this year, so I wanted to make it easier to find me if you have any UDOIT questions.  Just look for the guy with the sign on his backpack:

Jacob Bates wearing a sign on his backpack that says

If you don't want to rely on bumping into me, you can send me an email to schedule a meetup.

more
5 1 799
kmeeusen
Community Champion

UDL for Module Design

I learned from the UW DOIT Center that accessibility in digital learning has two components:  1) Accommodation and 2) Universal Design for Learning (UDL).  In this Blog I am going to talk about applying UDL to Canvas Module design from a very practical perspective. The information below is how I design modules in my own courses, and how I teach my faculty to do it. You are all more than welcome to disagree with me, and if you do I hope you will join this conversation. I am posting this at the request of  @Renee_Carney , and we both hope that this will spark others to share their UDL course design strategies for other Canvas functionality.

I will not bore you with UDL principles and theory you can learn all you want at the National Center on universal Design for LearningWhat I am going to share is my one guiding principle for online course design:  All students must be able to know what they have to do, how they have to do it, where they have to do it, and how they can get help when they need it!

The Importance of Modularization

Open any textbook that you use for any of your courses, and the first thing you will note is that the textbook is divided into chapters, with each chapter based on a central topic or concept that relates to and supports the overall topic of the textbook. When you open any of those chapters you will typically note an introduction, perhaps the chapter learning objectives, the main content of the chapter, perhaps some practice or review activities and a summary - and all of these relate to and support the topic of the chapter. Sometimes the chapter might be further divided into sections, each with their own content but still closely associated with the main topic of the chapter. All the information and activities the textbook includes on that topic is included in that topic's chapter! Textbook authors and publishers do this for a reason - this level of organization has been proven to promote learning! When my Medical Terminology students want to learn about the language of the skeletal system, they know that they can find almost everything they need in the chapter dedicated to the skeletal system.

This is also how our online courses should be designed, only instead on calling them "chapters", we call them modules (at least we call them that in Canvas because Instructure was smart enough to create UDL-capable content containers for us called Modules). Sometimes, when our curriculum is very closely associated with the textbooks, we name our modules after the chapters. Other times, we may group what would be the content of more than one chapter of our textbooks in a module we call a "Unit". Sometimes our curriculum does not relate to a textbook at all, but we still organize our courses around major themes or topics and containerize those topics into modules - just as a textbook does. And just like your textbook, everything that relates to and supports a specific unit of study should be included in that unit's module! So using our textbook example again, the typical module would include:

  • An introduction or overview,
  • The module level learning objectives,
  • All learning materials for that module's topic (readings, external links, videos, etc.),
  • All learning activities related to that modules topics (assignments, discussions, practice exercises, etc.), and
  • All assessments of student achievement of the module objects.

Example Models of Module Structures

There are many different models for accomplishing this; in fact, as many as the imagination can consider. The following are a few prototypes that can easily be adapted to your online course. These prototypes are individually distinctive, but they are not mutually exclusive. You will have to decide which is best for your curriculum, teaching style, and students; but whichever you choose, be sure to be consistent in how you do it in your courses

186484_Model_1.png

Model_2.png

Model_3.png

Model_4.png

The Importance of Consistency

In an online course it is very important for the structure to be logical and consistent. As I stated earlier, we want “All our students to be able to know what they have to do, how they have to do it, where they have to do it, and how they can get help when they need it!”   Consistent module design will greatly aid all students in finding what they have to do, and know where they can learn how to do it. To keep an online course’s modules consistent the following suggestions will help:

Consistent Naming:

  • Modules, however named, should be name consistently. For example: Module 1, Module 2, Module 3; or Unit One, Unit Two, Unit Three, or Chapter 1, Chapter 2, Chapter 3. We should never mix and match these identifiers. Also, how we name the modules should also be consistent with how the course instruction is organized. If your curriculum centers around the chapters of a textbook, and chapters are given a relatively consistent focus, then name your modules for the chapters. However, if your curriculum focuses on topics or concepts, then perhaps you want to divide your course into "units" or "modules". Perhaps your curriculum is divided into more calendar-related units in which a specific set of concepts or topics are covered each week, and you would want to sequentially name those units for the weeks of the quarter: Week One, Week Two, etc.

  • Learning Materials or Resources such as handouts, website links, videos, etc. should be consistently named, and their names should reflect their applicable learning units. For example: Chapter One Readings, Chapter One Web Resources, and Chapter One Videos. Whatever naming scheme you choose it should be consistent throughout both the module and the course.
  • Learning Activities such as course discussions, assignments, interactive tutorials and discussions should follow the same conventions recommended for learning materials above. For example: Week 1 Quiz, Week 1 Assignments, and Week 1 Discussion.

Consistent Location, Placement and Ordering:

Students should expect to find similar items in the same places throughout the duration of the course, and the placement of learning objects and activities should reflect the logical flow of student learning within the course. Typically students should access learning materials such as readings, videos, or web resources before engaging in graded or ungraded assignments, and would typically engage in those activities before attempting a unit assessment activity. However you choose to sequence learning in your course, that sequence should be the same in every learning unit.

It is sometimes necessary to include content and activities outside the established course structure - Midterm and Final Exams, Capstone projects, Term projects or papers, etc. - can be placed outside the structure, but you should regularly reference them within the established structure. For example: a midterm exam that falls in week five of the typical community college quarter structure could be placed between the weeks five and  six modules (say in its own module with a study guide), but regular reference to this item and its location should be made during weeks 1 - through 5.

The Use of Text Headers and Indentation

When modules are very large, and that happens frequently, make good use of the Canvas modules content type called Text Headers. Text headers can be a very powerful tool for helping students locate what they need when they need it. In the module design examples above, they grey boxes would represent Text Headers for the module. Indentation of content under a text header greatly helps student focus on a specific section of the module. Below is an example of how I use text headers and indentation in a module. Mine is by far not the only way of doing things, but I will add that my student success rates and student course evaluations are very high.

186488_pastedImage_0.png

I hope that at least some of you find this discussion useful, if perhaps just a tad bit verbose. I also hope that you will join this discussion and share your own tips, tricks and techniques for UDL course design.

Kelley (Agent K)


This work by Kelley L. Meeusen is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.
186489_pastedImage_0.png

more
82 16 22.6K
tr_jbates
Community Champion

Since we have a presence on the Canvas Community now, I figured this would be a good place to do writeups on all of our version releases of UDOIT.  This particular one is very minor, but I have to start somewhere!

  • User authentication is now compliant with the changes that were made recently in Canvas.  Instead of asking Instructure to generate a Developer Key for you to install UDOIT, your LMS Administrators can do that for you.  This particular subject can get very technical, so let me know if you want more details.
  • The latest UFIXIT tool, Color Picker, gives you some pre-made color options in addition to the spectrum interface.  It also will not let you submit the UFIXIT form if your new color is also inaccessible.

We also discovered some issues while preparing for this release.  They will be fixed in future releases:

  • UFIXIT for files no longer works.  This is due to Instructure removing the API we were using to handle file uploading.  We need to switch to the new API they created.
  • UFIXIT has trouble with anything that contains Magic Quotes, i.e., the quotation marks generated by Microsoft Word, Powerpoint, Outlook, etc.
  • UFIXIT has trouble with table headings and scopes.  We're still trying to nail this one down, since it doesn't have issues in all cases.

That's it for this time!  Please let me know if you discover any issues with this release, or if you have any questions.

more
6 3 2,258
kmeeusen
Community Champion

April 4—May 13 Rutgers University is hosting a six-week noncredit course for online course designers and instructors that covers the basics in accessible design. Register for this course & other Online Teaching Certificate workshops at https://onlinelearning.rutgers.edu/online-teaching-certificate-workshops

 
ACCESSIBILITY AND COMPLIANCE IN ONLINE EDUCATION
This course introduces to online learning educators basic concepts, issues, approaches, strategies, beneficiaries, and resources with regard to the creation and delivery of online courses that are accessible to all students, including those with disabilities. It will cover the basics of accessible design, focusing on what an instructor needs to know. The course does not require high-level technical skills, but will point to resources that provide technical details.

There is a charge for this course: $100 for Rutgers-aligned participants and $300 for non-Rutgers participants.

Worth it if  you need or want this training.

Agent K.

This document was generated from the following discussion: Accessibility and Compliance in Online Education Certificate Course

more
2 0 1,269
stephanie_pope
Community Champion

Hey Everyone!

In our efforts to begin moving towards developing more accessible online courses, I've created a WCAG 2.0 overview tool. I wanted to see how each level (A-AAA) ranges in content. This will help us know what we have to do, moving forward, to meet the minimum requirement for level A. I hope this is useful to your schools as well. I took this information directly from the WCAG 2.0 website. If you need clarification for any of the sub-categories you can click on the "How to meet" link next to the criteria.

Please let me know if you have any questions.

Stephanie

more
2 0 1,813
kmeeusen
Community Champion
0 0 929
kmeeusen
Community Champion
0 0 696
erinhmcmillan
Instructure Alumni
Instructure Alumni

Various state and federal laws have requirements aimed at making education accessible to as many people as possible. For instance, making sure that classrooms are wheelchair accessible would be an effort to comply with these laws and policies. Online classes need to be accessible as well. This document outlines some general best practices when designing a course for accessibility concerns. Additional help can be found at Creating Accessible Electronic Content.

 

Specific Canvas-related accessibility help can found in the Accessibility within Canvas document. If you have additional suggestions, please contact accessibility@instructure.com.

 

Layout and Design

Generally, the layout of a page should be simple, clean, and uncluttered. Navigation should be clear and consistent from page to page.

 

When adding content, keep content organized and chunked together in short paragraphs so users can scan your content easily.

 

Headings

headings.png

Headings should always include descriptive section headings. Section headings allow for a quick scan of the content for sighted and non-sighted users.

 

In Canvas, page titles are automatically generated at H1.

 

Images

Alternative (alt) text is required to provide a textual alternative to non-text content in web pages. This text will be read aloud to a person using a screen reader.

 

By default, Canvas includes the image name as the alt text, which should be changed to something more descriptive when embedding images. Alt text is not the same as the image title, which generates text when users hover over the image. Learn how to embed images in the Rich Content Editor.

 

Example Image

Default Alt Text (name of image): kids-tech-revised.jpg

 

Modified Alt Text: one boy and two girls sitting on a couch with a smartphone, tablet, and laptop.

 

Links

When adding a link, instead of pasting in the URL directly, attach the link to words that describe the link destination. This behavior will help everyone (whether they are screen reader users or not) understand where the link will take them.

 

Example Links

Bad Example

 

"Donald Tapscott, in his paper ''Growing Up Digital," http://www.ncsu.edu/meridian/jan98/feat_6/digital.html says these students..."

 

Listen to bad example audio from screen reader

 

Good Example

 

"Donald Tapscott, in his paper ''Growing Up Digital," says these students..."

 

Listen to good example audio from screen reader

 

Content Formatting

Users can view text contrast well when formatting with bold and italics, which help distinguish between important content items.

 

Example Canvas Color Ratios

If you choose to use color, utilize the WebAIM Color Contrast Checker to ensure adequate color contrast and accessibility friendly colors. The following are examples of Rich Content Editor Colors Contrast Ratios within Canvas:

 

Fail: (under 4.5)

 

  • Yellow Text: 1.07:1
  • Pale Green: Text  1.12:1
  • Orange Text: 2.14:1
  • Pink Text: 3.14:1
  • Red Text: 4:1

 

Good: (4.5 to 7)

 

  • Blue Text: 4.68:1
  • Dark Green: 5.14:1
  • Purple Text: 6.95:1

 

Best: (Over 7)

 

  • Burnt Orange: 7.43:1
  • Very Dark Gray: 12.63:1
  • Black text: 21:1

Tables

Tables should be used for data display, not layout. Headings should always be included for columns and rows.

 

In Canvas, headings for table columns and rows can be changed in the Rich Content Editor. View the Creating Accessible Tables in the Rich Content Editor.

 

   Example Table HTML Code:

         Column

  • <th scope="col">Questions</th>
  • <th scope="col">Percentage of Total</th>

                Row

  • <th scope="row">Website</th>
  • <th scope="row">Website URL</th>

 

Videos

Videos should always have the option to view captions.

 

For external videos, check with the video provider for caption availability. Learn how to Caption YouTube Videos owned by you.

 

For videos created or uploaded into Canvas, Canvas uses a tool called Amara to sync your script with a video. Learn more about captions in the Canvas Instructor Guide - Rich Content Editor.

 

Content File Formats

There may be times an instructor wants to deliver content in other file formats not native to Canvas. Here are tips to ensure accessibility of some of the most popular file formats.

 

Microsoft Word

General accessibility guidelines apply to designing a Word document.

PowerPoint

General accessibility guidelines apply to designing a PowerPoint document. Use the built-in accessibility checker: File > info > check for issues > check for accessibility.

  • Additional guidelines and links:
    • Use slide layout templates whenever possible.
    • When you can’t use a template, use one with the slide title only.
    • Write presenter’s notes in the provided area.
    • Apply ALT text to images.
    • Add captions to the slide or presenter’s notes for complicated images (e.g. diagrams or maps).
    • If embedding video, caption the video and ensure the player controls are accessible.
    • If embedding audio, include a transcript.

 

Portable Document Format (PDF)

Portable Document Format (PDFs) should be created as accessible documents. Most commonly, PDFs are created from Word documents. If you do not have the original source file for a PDF document, you can tag the PDF to help with accessibility.

Additional Resources

Significant contributions to this guide were made by:

 

  • John Raible: Instructional Designer for the Center for Distributed Learning at the University of Central Florida
  • Nancy Swenson: Instructional Designer for the Center for Distributed Learning at the University of Central Florida

more
74 15 347K