Visualizing bounce rates using brownie charts

Today on Jason Fall’s Social Media Explorer, I discuss my new favorite data visualization technique — one that I’m starting to move into production with web analytics reports I create for clients. Its official name is the Tree Map, but as I mention in that post, I prefer to call it The Brownie Chart.

That post has an example of how I use brownie charts to show a promising new web metric, the content interest index (CII). My example on the site uses a made-up business, Everything Brownies, with a web address of EB.com.

Note: Yes, I know. That web address resolves to a real encyclopedia site. The reason I didn’t just make up a domain name is you never know when one will go live with a site. I didn’t want to have someone inform me, two months from now, that my blog is now pointing to a porn or gambling site! Unless Encyclopedia Britannica takes a surprisingly sleazy turn, I think I’m safe.

Here is another example of how the tree map / brownie chart can make web analytics reporting easier to understand:

Charting Bounce Rates: “I came, I saw, I puked.”

I agree with Avinash Kaushik that bounce rates are a helpful way to measure how well you’re connecting with site visitors. Actually, he’s a little more enthusiastic than I am, with blog post titles such as this model of understatement: Bounce Rate: The Sexiest Metric Ever? Three years ago, on his own blog, Avinash described bounce rates this way:

So what is this mysterious metric? In a nutshell bounce rate measures the percentage of people who come to your website and leave “instantly.”

They’re the one-page visitors. Yes, they might be finding what they were looking for — but more often than not, these people just didn’t dig the neighborhood.

Avinash has refined his description over time. In his recent, truly outstanding book on measuring web traffic, Web Analytics 2.0, he characterizes bounce rates this way: “I came, I saw, I puked.”

Bounces can be reviewed for all traffic to a site, or only for certain important segments — traffic from search engines is a good example. Reporting of bounce rates can also be broken down by page.

The brownie chart becomes particularly handy for this per-page bounce rate reporting. It helps those responsible assess the severity of a site’s problem pages.

You see, you can’t easily be sure that a page with a high bounce rate really is a problem page. Think of it: If nearly everyone ups and leaves when they arrive at a particular page, but that page gets relatively little traffic, there’s no huge emergency. Content management resources are usually scarce, so it’s better to keep looking, for other pages that attract more page views that happen to have comparatively high bounce rates. It’s those more popular pages that require immediate first aid!

To illustrate, take a look at Everything Brownies’ bounce rates on this brownie chart. The graphic shows all major pages of this fictitious site, and shows the pages as more red if they have the highest bounce rates relative to the others. You should know that size represents the relative numbers of page views. The bigger the “brownie piece,” the more views that page gets.

What does this chart tell us? Quite a bit.

The Holiday Brownie Baking Kit, which I placed my mouse over in this screen capture, has an excellent (i.e., low) bounce rate. It also has a ton of page views.

That means this page is doing quite well in keeping visitors from leaving immediately. Well done! On the other hand, Deluxe Baking Pan is not nearly as successful. Its relative bounce rate is quite high, and because it has the most page views of the entire site, it’s clear this page is majorly dropping the ball!

There are plenty more insights, but you get the picture.

As I mentioned on Jason’s blog, what I like about this charting format is non-math types (such as myself!) can understand these statistics immediately, and know exactly what needs to be investigated further — and in what order of priority. As my friend Bob likes to say, “That’s good stuff!”

I hope you find the potential of this charting technique as exciting at I do.

A Round of Applause for BeGraphic and Sparklines for Excel

This example of a fake report for EB.com, as well as the one on Social Media Explorer, was produced using an “Add-on” for Excel called BeGraphic. The Add-on consists of a whole suite of graphic tools — all based on Excel data and rendered within that application. The particular functions I used were part of Sparklines for Excel within the BeGraphic suite. I urge you to support the folks behind these amazing visualization tools.

Overcoming the treachery of analytics

What do these three quotes have in common?

  • “Worship no false idols” — The First Commandment in the Old Testament
  • “If you meet the Buddha on the road, kill him” — Zen adage
  • “Become a ruthless killing machine when it comes to metrics/data” — Avinash Kaushik in a recent blog post.

If you guessed that they all warn (with increasing violence!) against mistaking the symbol of something for the real thing, congratulations! You won a pipe. Surrealist painter RenĂ© Magritte painted this particular pipe as a way to get us thinking about the paradox of symbols. Under it he painted a caption, “This is not a pipe.”

To drive his point home, Magritte named the painting, The Treachery of Images.

So how can we know when it’s time to wage war against our own treacherous web analytics? And once the body count has been tallied, what takes their place? What do we use to answer key questions and spur appropriate actions?

Results Simply Summarized

The answer: Show your audience only what they really want to know — not mere numbers and measurements, but the other RSS: results simply summarized. Here’s Avinash’s post for the full story.

And here it is in a nutshell:

He describes a favorite application he downloaded for his Nexus One phone. It’s a cardio trainer. The app starts out just like another popular body monitoring system. I’m thinking of the Nike Plus application for the iPhone. Both give the standard run-down of miles run and progress achieved, compared with past sessions.

The cardio trainer app then makes an elegant attempt at RSS. Avinash, for one, feels that it succeeds. I agree. It refocuses attention past the numbers to the actual workout goal.

At the end of each run, to reflect his level of exertion, Avinash is presented with an award of sorts. The screen shows two pieces of fruit — two pairs. They represent the number of calories burned. The pairs are his to enjoy guilt-free. (Or he can imagine a calorie-laden equivalent, in a mental swap of one food for another. Perhaps the next version of the app will allow users to actually do this; To replace the outline of two pears with a rendering of a candy bar, or a couple of bottles of beer!)

You might think these graphics are the same as Magritte’s pipe — mere symbols; not the real thing. You’d be overlooking a major distinction.

All Magritte was doing was showing the pipe. Avinash’s workout app was presenting the pears — awarding them. It was the summarization of the data behind it, proving to Avinash that this was his hard-won snack. It says, “Here you go. You earned it.”

Connecting On Two Levels

The representation of the pears became something he could connect with — both rationally and emotionally. Unlike Magritte’s pipe, the pears are results, supported by evidence. Consequently, for the recipient, they become so real that person could almost taste them!

Sadly, if most analytics pros were asked to cut out their own distracting and unpersuasive metrics, little would be left. Most metrics talk and talk but never get to the point.

This is precisely what senior management does not want. They want quick and truthful take-aways. Will they be dining on one delicious pear this month, or two? Or will there be none at all?

Of course business leaders wouldn’t want to see pears in their analytics. That would be absurd. So what do they care about? They want to see money of course. Or at least, clear proxies for money. Showing images of people is always good, since selling things to people is the surest path to making money. With that in mind, consider using generic silhouettes of them, shown judiciously, and with data that supports their numbers on the page.

Be bold. Show senior management that their site generated more sales leads this month — as represented by silhouettes of cookie-cutter executives (presumably eager to know more about the product). Count them. How many more are there this month compared to last? Line them up for comparison, month-to-month or year-to-date.

Or, as another example, show how the website is lowering operational costs. Illustrate the success of answering more consumer questions online versus having these people call your pricey phone center. In this case, the graphic could be a string of telephone headset icons. Compared to last month, are there fewer of them shown, or more?

Go on your own metrics killing spree, but first, know what you’re pursuing.

Kill any metric that produces more smoke than light. Allow the remaining metrics to build upon each other and add richness to your story. Then, as a satisfying grace note, find that single graphic which best sums up the current situation. Use symbolic language that is meaningful to your audience, to transcend facts and figures.

Do this, and far from being Magritte’s pipe, this graphic will be your own “Avinash’s pears.”