HTML image map in Canvas

DrNufer
Community Coach
Community Coach
1
2341

Until recently, I didn't even know this was possible.  I knew that we are able to upload an image and hyperlink it, but apparently it is also feasible to hyperlink specific portions of an image.  It takes a bit of prep work, working with pixels and HTML, but the final product is stellar.  Disclaimer, HTML maps will likely not render well on mobile devices unless you ensure that the image is on the smaller side - perhaps 480 pixels wide.  But if you ensure that students are on desktops or if you want to use this as a classroom activity on the projector then I invite you to explore.  Check out the tutorial and links below.

 

Visit the blog to grab my code:
https://www.howtocanvas.com/create-amazing-pages-in-canvas/html-image-map 

If you’d like to see the Canvas page from the tutorial: 
https://canvas.instructure.com/courses/2560052/pages/image-map-html 

1 Comment