Accordions

Why Use Accordions?

An accordion menu is a vertically stacked list of headers that can be clicked to reveal or hide content associated with them. It is one of many ways you can expose content to users in a progressive manner. This creates an opportunity for students to explore the content they find most important. 

Accordions shorten pages and reduce scrolling, but they increase interaction with course content by require students to further explore the topic headings listed. 

There are a number of good ways to use accordions in Canvas courses:

  • a way to include additional (non-objective aligned) information, so that it's set apart from the critical content (aligned) on the Canvas page. 
  • to capitalize on the cognitive function of questions during learning
  • In the online environment asking higher cognitive level questions that require a longer processing time is a good way to  stimulate interaction 

Sample Accordions

HTML Accordion

Formative Assessment 

This kind of assessment is ongoing throughout a term or year. This kind of assessment monitors student learning with the opportunity to provide ongoing feedback. This feedback can be used by instructors to improve and alter their teaching based on student need. Formative assessment helps students to identify strengths, weaknesses, and opportunities for improvement.  

Formative assessments can include the following activities:

  • exit slips
  • quizzes
  • infographics
Summative Assessment 

Summative assessment evaluates student learning at the end of a unit or course.  These kinds of assessments evaluate skill acquisition, knowledge acquisition and academic achievement.  They are often compared to performance standard or benchmark. 

Summative assessments are often the cumulation of learning over a term and involve the following activities:

  • a high stakes final exam
  • a comprehensive paper
  • a final project. 
How can formative and summative assessment be used in class?

Watch this short TED Talk on assessment choice in the classroom.

 

 

H5P Accordion

 

Embedding Accordions in Canvas

  • Embed your own accordion code directly into the HTML editor

Example code: <div id="accordion-holder" ><iframe src="https://xxxx.instructure.com/files/201637/download" width="98%"height="390"></iframe></div>