As we are nearing the end of the CHI fellowship, Jeff and I are working on final touches to our Archaeology 101 website. Lately, I’ve been working on changing some of our text into ‘Dig Deeper’ popup modals. Instead of having all the information for each section immediately available on the page, we have decided to move some sections into optional popup modals.

The reason behind this decision is to allow students (and other visitors) that are strongly invested the ability to find more information. This was brought up by one of our elementary school teacher partners, Steven Callahan. It allows the visitor to engage with the more advanced information if they are interested, but will not hinder any students that are on a different learning level. It also gives the visitors another opportunity to interact with the website.

The popup modals were built using Bootstrap’s modal code. I modified the code to have the button color match the color scheme of our website and only included one ‘close’ button option in the popup modal.

Stay tuned for a blog post tomorrow by Jeff that will discuss another interactive element on the Archaeology 101 website using JuxtaposeJS.