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:

Problogger-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 - Digital Photography School - TwiTip Twitter Tips - FeelGooder. Learn more about him here and connect with him on Twitter at , Facebook, Google+ and LinkedIn.

Problogger.net 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!

Comments

  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:
    http://app.onlinequickblog.com/images/19314-18421/Nukes_Graph.jpg

    Fun.

    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 amazon.com. 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.

Trackbacks

  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 GottaHaveOne.net looks like: [...]

  3. [...] Today’s entry is very different than usual. I came accross a website graph of Problogger.net 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 LandlordMax.com and FollowSteph.com 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….