My website as a graph

Just to beautiful

What do the colors mean?

  • blue: for links (the A tag)
  • red: for tables (TABLE, TR and TD tags)
  • green: for the DIV tag
  • violet: for images (the IMG tag)
  • yellow: for forms (FORM, INPUT, TEXTAREA, SELECT and OPTION tags)
  • orange: for linebreaks and blockquotes (BR, P, and BLOCKQUOTE tags)
  • black: the HTML tag, the root node
  • gray: all other tags

Made by Sala. Find more on Flickr.

Everyday, we look at dozens of websites. The structure of these websites is defined in HTML, the lingua franca for publishing information on the web. Your browser’s job is to render the HTML according to the specs (most of the time, at least). You can look at the code behind any website by selecting the “View source” tab somewhere in your browser’s menu.

HTML consists of so-called tags, like the A tag for links, IMG tag for images and so on. Since tags are nested in other tags, they are arranged in a hierarchical manner, and that hierarchy can be represented as a graph. I’ve written a little app that visualizes such a graph.


Helping out (a little bit)

On the 27th of May 2006 there was an earthquake on Java due to the eruption of the volcano Merapi. 80% of the houses collapsed and 5651 people in Klaten alone died.

Tino who lives in Indonesia has family in Klaten and took the initiative to find ways to collect money to personally help his family and the village they live in. Together with Carina I offered to make this website to keep the people who donate informed and at the same time make a personal document of Tino’s effort and the rebuilding of lives.

Our power to act is really something beautiful and makes a difference.

Placeholder voor de uiteindelijke website in 2006 die op dezelfde leest zal worden opgebouwd. Opdrachtgever een huisjes verhuurder. Er worden kaartjes gedrukt van het uitzicht vanuit de huisjes en het huisjes zelf. Die kunnen huurders dan gebruiken om naar hun vrienden te sturen.

De website gaat er ook uitzien als een vakantiekaart.