Using HTML to Enhance Visual Engagement

Using visual learning techniques – such as incorporating images and graphics – is one of many approaches used to enhance a student’s educational experience. Visuals are frequently used to supplement lectures and incorporated into active learning techniques. However, visual elements need not be regulated to strictly presentations and assignments. Here we offer how HTML in Canvas can transform a “blank” page into a more visually and engaging event. Additionally, using HTML coding ensures many accessibility requirements are met!
Mock up of a Canvas page layout

Use HTML in the following ways:

  • Draw attention to important sections of the page by using reverse type on a darker background.
  • Use tabs to organize content horizontally along the page. This can minimize the amount of scrolling and being overwhelmed by text.
  • Icons can provide direction or relay information such as a single vs. group activity.
  • Add interactivity to the content using links on both text and images!
  • Use divider tags to create rows and columns to further arrange items on the page.
  • Use crisp and clear visuals including images, graphics and infographics.
  • Similar to tabs, “accordions” (collapsible/expandable sections) allow for organization of content in a more direct and compact way.