This week I want to share a fun and free tool that you can use to talk about how HTML code works while playing around with remix. Mozilla X-Ray Goggles claim to help users “Remix Any Page on the Web” by revealing and then editing the text and code on target pages.
To use the tool, you drag a button to your web browser’s toolbar. Visit the page you want to remix, and click the button to activate your X-Ray Goggles. Next, click on areas of the page and an editing area appears at the bottom of the page. You can change the text or the related HTML code. If you want to save your remixed page, create a Mozilla login and you can save the text to Thimble (Mozilla’s free web hosting site).
This KQED Education video provides an overview and shows how the tool works in more detail:
The tool is meant for a younger audience. If you look at the activities at the bottom of the X-Ray Goggles page, you’ll notice that the age-level is 8 and up. That is a bit low compared to your basic college student, but the tool is very versatile. Don’t let that age range put you off. What matters is how you use the tool.
Want your students to learn how to structure a particular document for online publication? Find a model and have them remix it with new content using X-Ray Goggles.
Want to talk about the code behind web pages before you ask students to create their own websites from scratch? Use X-Ray Goggles to explore the different tags and attributes behind a variety of pages.
Want your students to talk about how design matters on the web? Challenge them to all recreate a basic page by manipulating the code behind that content using X-Ray Goggles.
Want students to create parody websites? Have the students visit the sites they will parody and use X-Ray Goggles to create their parody content in the format of the original site. Consider how simple it would be to create fake news sites or to turn that assignment around, to take fake or flawed site and create a more truthful and fact-checked version.
You get the idea. The tool helps students see the HTML code in context of real, working pages, and it has the additional benefit of giving them a simple way to borrow and remix code and content. Do you know of other free web tools that can help in the classroom? Please tell me about them by leaving a comment below.