Canvas Mobile Friendliness

Canvas Mobile Awareness

Thanks to Tom Gibbons, Instructional Designer for eLearning at South Seattle College, for this video demonstrating the differences between the desktop and mobile screen experience of Canvas. It’s a great reminder that the Canvas user interface and layout changes based on the screen size and device you use to access it.

As Tom points out, many students rely on a smartphone for their internet access off-campus. According to Pew Research Center’s report U.S. Smartphone Use in 2015, one -in-five American adults reports either having no high-speed internet access at home other than a smartphone data plan, or having a limited number of ways to get online other than a smartphone. And:

Certain groups of Americans rely on smartphones for online access at elevated levels, in particular:

• Younger adults — 15% of Americans ages 18-29 are heavily dependent on a smartphone for online access.
• Those with low household incomes and levels of educational attainment — Some 13% of Americans with an annual household income of less than $30,000 per year are smartphone-dependent. Just 1% of Americans from households earning more than $75,000 per year rely on their smartphones to a similar degree for online access.
• Non-whites — 12% of African Americans and 13% of Latinos are smartphone-dependent, compared with 4% of whites.

Your students are using mobile devices to engage in their learning experience. And you can support them by making your Canvas course mobile-friendly.

Canvas Mobile-Friendliness Checklist

These tips come from a 30-minute CanvasLIVE Mobile Series webinar: Just-in-Time Design Checklist (2015) presented by Ryan Seilhamer.

1. Use Text Headers for Module Organization

   Indents are not supported on the Canvas mobile app. Since smartphones have narrow screens, indented content would be truncated and difficult to read.

   

   Instead, you can use text headers within modules to organize the module content. This is much easier to read on mobile screens.

   

2. Chunk Content into Smaller Sections

   Ideally, chunk content into segments a student can get through in 5-10 minutes. Think about mobile use of Canvas as something students do in between other tasks. They need to be able to easily pick up where they left off, and this is best accomplished in small bits.
   

3. Limit Use of Tables for Content Layout

   Tables are fine for tabular data, like a statistics table. But table layouts may not render the same in the Canvas mobile app. At minimum, double-check your tables using the mobile app to make sure they look okay.

   

4. Display Content in Canvas Pages Instead of Word or PDF Files

   Canvas Pages provide the a much better mobile experience. With Word files, mobile users have to zoom in to enlarge text so it is readable. With PDF files, mobile users can’t zoom in at all, making content difficult or impossible to read.

   

5.  Keep Uploaded Files Sizes Under 30MB

   Be mindful of the file size of images you upload into Canvas. Mobile devices use varied data transfer speeds and may be much slower and less reliable than Wi-Fi. And data plan charges may be incurred for large file downloads.

6. Use Mobile-Friendly Media Types, Avoid Flash and Java

   • MP3 audio files and MP4 video files are compatible with mobile devices
   • the Canvas media recording and upload tools inside the Rich Content Editor are mobile optimized
   • SoundCloud, YouTube and Vimeo are good sources of mobile-optimized audio and videos
   • HTML5 media is the best alternative to Flash and Java for games

   Often, a mobile device will display nothing when it encounters a media type it doesn’t support. Also, some video producers restrict their video from mobile playback. So it’s always good to double-check whether media displays in mobile view. You can also include a link to access the media outside of Canvas.

   

7. Inform Students When Content Isn’t Mobile-Friendly

   It’s not always possible to use mobile-friendly content. So when you can’t, inform students about alternative means for accessing the content. Then at least they’ll know why they aren’t seeing it, and to go to a desktop computer.

   

8. In Prompts, Reference Canvas Tools, Not Location

   Be mindful of directing students to specific buttons or icons in the desktop interface. These items may change or be unavailable in the Canvas mobile app interface. Instead, refer to course tools such as Assignments, Quizzes, Announcements, etc.

   

How Mobile-Friendly Is Your Course?

Ryan Seilhamer created a Canvas Mobile App Course Report hosted by University of Central Florida. You can review a course for yourself, or for someone else (opting for someone else activates text boxes where you can note specific feedback). After answering the questions, you’ll receive a mobile-friendly course grade. Bookmark this form and review your courses periodically: http://ucf.qualtrics.com/jfe5/form/SV_4SfiubUiWzwkuqh

If you just want to review a specific module of your own course, you can do it yourself by installing the Canvas app on your own mobile device. Check out our video tutorial on how to install the Canvas app.

If you don’t own a mobile device, you can make an appointment with one of the CTLE staff and we can help you log into your course on an iPad to check the mobile-friendliness of your Canvas course. Email us at ctle@gccaz.edu.