Web Tortoise

2013-Nov-27

REMEMBER THIS WEB PERFORMANCE HEAT MAP

Response:

Hello! This #WebTortoise post was written 2013-NOV-27 at 02:28 PM ET (about #WebTortoise).

Main Points

#- Happy Thanksgiving!

#- Use color to add value to your Charts and Graphs.

#- In addition to chart “readability/understandability”, also consider chart “retention/memorability”.

#- Do not be afraid to “play” with your charts and see what you come up with.

#- Chart/Graph Name: Web Performance Heat map ; Shows: Performance, Availability and/or Reliability

Story

The other day, I found this document entitled, “What Makes a Visualization Memorable?” (you can read the document here) and I had the thought to take one of their examples and “play” with it.

Citation note: Borkin MA, Vo AA, Bylinskii Z, Isola P, Sunkavalli S, Oliva A, Pfister H. What Makes a Visualization Memorable?. IEEE Transactions on Visualization and Computer Graphics (Proceedings of InfoVis 2013). 2013.

Now, this document goes on to present for “what makes a visualization memorable” and is a good standalone read. Additionally, though, the document is offered as part of a larger debate where (in my own words) the debate is basically:

Does *only* the chart data need to be presented in order to be understood (i.e. “no” “chart junk” [Tufte]?

-OR-

Does “chart junk” cause us to expend more cognitive effort… thus resulting is more/better understanding (and consequentially more retention and memorability) !?

The document states (and I restate here) it is, “… a first step toward…” the larger, at hand, debate, but I recommend giving it a read because it is interesting by itself.

Now, from Webtortoise’s perspective, I thought I’d pluck one of their chart examples and make it into a Web Performance chart. After looking at the plucked chart, should see why I chose to use it at this particular time of year.

First, their chart.

The Heat Map:

Webtortoise - Which Birth Dates Are Most Common

I had previously written a Webtortoise Heat Map article before, but this article is of a different type.

Second (and changing gears to actual Web Performance data), here’s an XY Scatter chart of one-days’ worth of Fully Loaded Webpage Response Time data (we’ll be turning into a Heat Map).

XY Scatter:

Webtortoise XY Scatter to Heat Map

Third, turn the XY Scatter into a Heat Map with Time still on the X axis and Percentile Values on the Y axis (to do this, just using Excel’s built-in conditional formatting). Note in this case, the Percentile values are from 0% – 100% (min to max) by 5’s.

Webtortoise Web Performance Heat Map A:

Webtortoise Web Performance Heat Map A

Webtortoise Web Performance Heat Map B:

Webtortoise Web Performance Heat Map B

Webtortoise Web Performance Heat Map C:

Webtortoise Web Performance Heat Map C

Side by Side:

Webtortoise XY Scatter to Heat Map - 2 by 2

The question is, “Which Heat Map more accurately depicts the XY Scatter” (and what’s different about them)?

The differences between A, B and C.

Heat Map A:

Heat Map A had the formatting applied across both axes. In other words, this one shows “the heat” across all of the data. If you look at the Excel file, notice the formatting is applied to cells =$X$27:$AU$47.

Heat Map B:

Heat Map B had the formatting applied across only one axis (in this case, the Hour of Day). In other words, this one shows “the heat” within a given hour. If you look at the Excel file, notice the formatting is applied to each respective column (e.g. =$AA$50:$AA$70).

Heat Map C:

Heat Map C had the formatting applied across only one axis (in this case, the Percentile). In other words, this one shows “the heat” within a given percentile. If you look at the Excel file, notice the formatting is applied to each respective row (e.g. =$X$75:$AU$75).

Having explained the difference, which Heat Map do YOU think more accurately reflects the XY Scatter?

Playing With Your Charts

This Webtortoise post was written a little open-ended, to leave room for a little debate on which Heat Map you’d use in a given situation. We didn’t give much thought to WHY we’d use a Heat Map in the first place (at the core of general “readability/understandability” debate), though. In other words, if the XY Scatter is serving the purpose, why use something else? Hint, because we’re wondering if the Heat Map is more memorable than the XY Scatter.

The answer lies in something I’ve written about before: Do not be afraid to “play” with your charts and see what you come up with. Do any of these Heat Map do as good of a job as the XY Scatter to show:

– between the hours of @ 06 AM to 06 PM, there was clearly some abnormal response times (pretend I clearly had the same time axis label on the Heat Maps as I did on the XY Scatter)?

– after @ 06 PM, there was clearly still some volatility, spurious outliers (that probably still needed attention)?

I don’t know; you tell me. But now that we know some of the ways to construct Heat Maps, we’ll be able to use them in other situations (which would not have happened if we didn’t “play” with them in the first place.

Document Complete / OnLoad:

_The following is optional reading material._

LinkedIn: http://www.linkedin.com/in/leovasiliou

Twitter: @LvasiLiou

Download the Excel document here:  https://drive.google.com/file/d/0B9n5Sarv4oonWjZRMjRHdTdmSUk/edit?usp=sharing

#CatchpointUser #ChartsAndDimensions #Performance #SiteSpeed #WebPerformance #Webtortoise #WebPerf #WPO #DataVis

#ExcelHeatMap #ExcelConditionalFormatting

2012-May-03

Half Full or Half Empty? Choosing a Statistical Calculation

Response:

Hello! This was written 2012-MAY-03 at 12:27 PM ET.

Question: In your life as a Keynote or Catchpoint user, suppose you have a day’s worth of website response time performance data. Should you average using the Arithmetic Mean or the Geometric Mean?

Answer: Assume you want to use a central-tendency calculation like a mean (we’ll talk about percentiles in another post). Since the Geometric Mean will result in a lower value than the Arithmetic Mean, you might say the Geometric Mean is an “optimistic calculation” where the Arithmetic Mean is a “pessimistic calculation”. See the below going from raw data to line chart, then decide for yourself when to use either of the two calculations.

First, the below scatter plot shows a day’s worth of website response time data. In this case, there are about 2,880 total data, or about 120 per each respective 24 hours in a day. Notice the single spurious outlier in the 03:00 AM hour.

Second, the above scatter plot is then transformed into the below line graph. The blue line calculates the data using the Arithmetic Mean and the red line calculates the same set of data using the Geometric Mean. The single spurious outlier in the 03:00 AM hour caused a “spike” to appear in the line graph.

Fair warning, the perceived impact (a.k.a. “The Spike”) will depend on how many data are being averaged. The point remains the same, though: The Arithmetic Mean is more subject to skew from spurious outliers than the Geometric Mean. So, depending on your situation, you may want to choose one or the other (or both to see the delta, which is another powerful way to analyze).

Document Complete / OnLoad:

_The following is optional reading material._

For a refresher on calculating the geometric mean in excel, see this post https://webtortoise.com/2012/03/16/geometric-mean-in-excel/

Download the excel file, which includes the raw data and the line chart calculations, here:  https://docs.google.com/open?id=0B9n5Sarv4oonRGc5UmNpNHhjOGs

#Keynote ; #Catchpoint ; #Gomez ; #KeynoteUser ; #Catchpointuser ; #Gomezuser ; #ArithmeticMeanvsGeometricMean ; #ExcelStatistics

2012-Mar-07

Christmas in Excel

Response:

Hello! This was written 2012-MAR-07 at 01:42 PM ET.

Use color to add value to your Performance charts. Red and green columns overlay your line chart where red equals an “increase in Response time from previous interval” and green equals “decrease in Response time from previous interval”.

The following excel waterfall chart has the aforementioned conditions applied (red equals an “increase in Response time from previous interval” and green equals “decrease in Response time from previous interval”). In this case, the waterfall chart is showing week-over-week Response time for a landing page. Credit to peltiertech.com for the waterfall template; my additional formatting has been applied.

Excel Waterfall

Document Complete / OnLoad:

_The following is optional reading material._

Suppose you’re an academic site, perhaps a Search Engine or a Reference site. You might theorize the September change in Response time is impact from everyone going ‘back to school’. To further your theory, notice the December change, when everyone is ‘home for the holidays’. What else might you look for? Maybe three ‘reds in a row’, to spot a trend?

Download excel file: https://docs.google.com/open?id=0B9n5Sarv4oonSEhDZklWb3RUZWl5LTVlcE1sbUpTdw

Search for the PeltierTech article:  http://www.ask.com/web?q=excel+waterfall+chart+peltiertech

# Excel conditional formatting ; Excel conditional charting ; Web Performance Optimization ; Catchpoint ; Keynote ; Gomez ; Excel ; Statistics

2012-Feb-29

Introduction

Filed under: Introduction — Tags: , , , , , , — leovasiliou @ 11:10 AM EDT

Response:

Hello! This was written 2012-FEB-29 at 10:54 AM ET.

Welcome to The Web Tortoise and Hare‘s inaugural post. If you are a Catchpoint, Keynote, Gomez or etc user, then this is for you!

Here will be discussed various web availability, performance and “plus plus” topics. Will slant toward using excel to get additional value from the data provided by companies like Catchpoint, Keynote and Gomez.

Availability: Did you get a response from the server?

Performance: After the response, how long did it take for your web page to load?

“Plus Plus”: Could the time of day have affected the web page load? What other factors might influence either availability or performance? Geography? Ad Serving? Else?

Document Complete / OnLoad:

_The following is optional reading material._

I work for a large internet company [at the time of this inaugural post] whose pages receive several visits each month. I use tools like [those provided by] Catchpoint and Keynote to monitor availability and measure performance. I don’t work for any of those companies and I don’t have anything to sell.

Feel free to contact me http://www.linkedin.com/in/LeoVasiliou .

# The Information Diet ; Web Performance Optimization ; Catchpoint ; Keynote ; Gomez ; Excel ; Statistics

Blog at WordPress.com.