ProBlogger as a graph

I like a pretty picture so when I saw Websites as graphs – an HTML DOM Visualizer Applet I just had to have a play with it.

Here’s ProBlogger as a graph:


  • 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

Just a bit of fun for the weekend.

Found via Weblog Tools Collection

About Darren Rowse

Darren Rowse is the founder and editor of ProBlogger Blog Tips and Digital Photography School. Learn more about him here and connect with him on Twitter, Facebook, Google+ and LinkedIn. runs on the Genesis Framework

Genesis Framework

The Genesis Framework empowers you to quickly and easily build incredible websites with WordPress. Genesis provides the secure and search-engine-optimized foundation that takes WordPress to places you never thought it could go.

Check out the incredible features and the selection of designs. It's that simple - start using Genesis now!


  1. Haha, the little bit at the bottom left is the b5 blogroll. Good times :D

  2. Holy wacamoleee! I just checked out my site. Man, its a complete disaster!!!
    Little red dots began to multiply like rabbits. Its still growing as we speak (write).

    Check it out:


    Alexander Wunderlich

  3. Andy Merrett says:

    What’s really cool is the animated effect as it builds. Not sure how useful this is but it’s fun.

  4. Kenny Allman says:

    How on earth did you go about creating that image? Fascinating to see an internet entity in a visual way like that. Looks like a galaxy. Satellite of Love…..Sat…..a….lite…….of….. ;-)

    – Kenny

  5. Is this actually of any use? It’s very cool to watch but is surely just a bit of fun. I love how it still ‘waves’ at the end. A lovely little thing. It’ll be interesting to run my blog through it a few times as it grows…

  6. gizo says:

    Mr Butterscotch – That’s the same question they asked Picasso when he invented Cubism…. ;)
    But seriously, compare problogger’s graph with something like ebay or Everything should be pretty, at all levels…..

  7. Hock says:

    Great find, Darren. I played around with this tool and am enjoying watching the colorful graphs unfold. It’ll make a nice stress reliever.

  8. This is pretty cool. Unfortunately, it looks like it doesn’t follow links, but just the html on first page. I think that would be a neet graph to see all of the links on a site.

  9. Graphite says:

    Hey dude, that’s really interesting, nice work. :)

  10. Comic says:

    Hey there graphite, interesting website you have there, really funny.


  1. […] gris: el resto de las etiquetas Via: Problogger […]

  2. […] This is cool. I found this nice tool while reading through Problogger today. It’s a nice little java thingy that translates a webpage into a funky looking graph. Have a look at what looks like: […]

  3. […] Today’s entry is very different than usual. I came accross a website graph of today that was generated with Websites as graphs – an HTML DOM Visualizer Applet. It was unique and interesting enough that I generated one for each of and which you can find below: […]

  4. […] [ Thanks ProBlogger ] […]

  5. Websites as graph….

    I think that it would be cool if this script actually followed links, to build a graph of the whole site….