Homepage Design with Simple Tables

lethbri2
Community Participant

I've been feeling adventurous and decided to see what tables can do on the Canvas homepage (and yes, I’m aware of the complications and frustrations of tables on Pages). I found an easy method that works well with a few simple tables and a little work in Illustrator (for the images / banner).

 

  1. Create a table [1x1] and set the width to 100%. If you do this and put in larger images, it should shrink to a size that accommodates both the right and left hand menus. This also works in mobile browsing. In order to remove the white space between the tables, you may need to go into the HTML code and remove some paragraph tags (<p> and </p>)
  2. Add a bit of padding – 15 px and change the background colour to create sections. I always forget to add the # symbol. If you miss this and put in just the numbers, it doesn't work!
  3. Add content. Decide on the content and some of the buttons that are essential for students to get started. Typically, this includes a button to an introduction and links to the content or schedule.

  4. Create another table (Repeat step 1 to 3)


I’m wondering who else has explored different homepage setups with sections or new ways to set up navigation. I’m also planning to explore if the homepage (with a few links or additional pages) can be robust enough to be the only page required for a blended course based on the infographic design / layout. 

 

Looking forward to hearing your ideas and thoughts on what else can be done with a Canvas homepage! I’ll attach the ones I’ve been playing around with.

244886_Homepage-LD.png244888_idea1-ETP.png