Web site building could become one necessity of digital literacy in 21st century, but that doesn’t mean we have to go through all coding techniques with boredom. With innovations like Hackasaurus from Mozilla, teaching and learning webmaking(with resources provided) could be pretty cool! This post is from Audrey Watters, Hackeducation, licensed under CC-BY-SA.
Web (De)Construction with Hackasaurus
Tinkering with the Web
One of the very first “a-ha” moments I had when I was trying to teach myself HTML was that I could right-click and “view source.” Perhaps it sounds silly and obvious to say that now, but at the time, I felt as though I had pulled back the curtain on the Great and Mighty Wizard of Oz. “Sothat’s how they built it,” I realized, scanning through what was at the time, I admit, mostly indecipherable code. But what I saw was enough for me to copy and paste and tweak that I started to get a sense of what was actually going on on a website.
Years later, I discovered Firebug, a tool to help me inspect the HTML on a given page and, even better, help me debug stuff on my own.
Mozilla‘s Hackasaurus taps into that same sort of discovery, that same act of peeling back the layers behind a Web page. But it does so with a fair friendlier interface than either “view source” or Firebug can provide.
Hackasaurus offers “X-Ray Goggles” for the Web through a simple browser add-on. With those x-ray goggles, users can — as the name suggests — peer beneath the surface to see what the Web is made of. The goggles can be activated on any Web page, enabling a view of its building blocks. By mousing over the various elements of a Web page, users are able to see the code, and by clicking they can actually manipulate it — replacing images, for example, or adjusting fonts or alignment.
These remixes can also be published (to remixes.hackasaurus.org) and shared with others.
Hackasaurus demonstrates that the Web is tinker-able — that’s profoundly important for folks to realize.
In honor of the Valentines Day, the Hackasaurus team has created several “Love Bombs” using the tool. With it, you can hack your own message of love, such as the one that Atul Varna has written to Tim Berners-Lee. Awwww.
Disclosure: I am currently working on a research project for Mozilla regarding helping people become web-builders, asking whether there’s a need for a “Scratch for HTML 5.” I haven’t spoken to members of the Hackasaurus team yet, but it’s at the very top of my To Do list.
Questions I want to ask them: How do we get from deconstruction and remixing to construction and building? Is there a learning path (or even a difference)?
How to Teach Web-Building to Anyone