We're trying to build a graph showing visitors vs conversions. e.g. a website had 10000 visitors, of which 100 fill out a form.

Some of the options we've tried:

Stacked bar graph - this is the most intuitive however its really hard to distinguish the conversions as it is usually a small percentage. enter image description here

Percentage bar graph - Each bar represents the percentage of the total conversions/visitors. This conveys more information (i.e. which sources work best) but doesn't feel intuitive (using percentages in bar graphs) enter image description here

Bar + pie - Also intuitive but you can't really see the ratio with the people who convert.

[image in comments]

Any other suggestions would be greatly appreciated.

  • 1
    Can you clarify your question? From the current question, I read you need to show "people who convert" and "which sources work best". What is the main question that this graph should answer? Good UX is task-oriented, and as long as we don't know the task at hand, we cannot give good recommendations. Commented Mar 2, 2016 at 6:32

1 Answer 1


Whenever you are faced with a data visualization question it's best to be very specific about the question(s) you are trying to answer. Many times, the language alone will reveal what kind of graph you should use or why you're having a hard time creating a single graph. I think the question you actually want to communicate is "What sources convert the most users?" that seems to be the big business question since it will help a team focus its investments on a specific platform. I think you are also getting caught up in "How many visitors do we get from each source?" Keep an eye out for denominators, since they help us see why trying to put both in the same graph is tricky. I have a proposal for a single graph if you really want it, but there is bound to be some initial confusion and I also show you the power of two separate graphs.

Let's break each down. In the largest population we are talking about total visitors. Each source contributes a fraction of visitors to the total population of visitors and we can answer questions like, "Where do most of our visitors come from?"

80 Windows visitors
10 Android visitors
10 iOS visitors
100 Total visitors

Within each fraction of visitors attributed to each source, a fraction of them result in successful conversions. This information helps us answer, "What % of visitors do we convert per source?

60 conversions / 80 Windows visitors or 66%
8 conversions / 10 Android visitors or 80%
7 conversions / 10 iOS visitors or 70%
75 Total conversions / 100 Total visitors or 75%

But we're still not at the most valuable question for most businesses which lets us understand the conversions only within the conversion population. Notice the change in denominator. This is important, because when it happens it will affect your ability to put the two types of data on one chart without trying to get fancy/confusing about the axes. So, we need to make conversions the numerator and the total number of conversions the denominator to answer "What sources convert the most users?

60 Windows conversions / 75 Total conversions or 80%
8 Android conversions / 75 Total conversions or 10.6%
7 iOS conversions / 75 Total conversions or 9.3%
Logically they'll add up...75 Total conversions / 75 Total conversions or 100%

You could try to put both data stories in one graph like you tried above in example 2, but make sure to include labels for both the visitor count (I used blue) and % of conversions (I used orange). This is effective, but still has potential for confusion. Visually it tries its best to communicate your original ask by labeling the secondary axis with the same color. But! Inevitably, what happens is some viewers will look at the orange and think it is representing a fraction of the larger blue bar. We want to answer "What sources convert the most users?" in orange, but upon first glance it looks like we're answering "What % of visitors do we convert per source?" You might say, put them side-by-side, but it results in a similar eye trick and orange appears to belong to blue. Again, denominators. Nothing will feel like a slam dunk since the orange denominator is Total conversions and blue's denominator is Total visitors. enter image description here

My best recommendation is to use two graphs since these are two different questions. "What % of visitors do we convert per source?" and "What sources convert the most users? I know there are ways of creating interactive graphs in programs like Tableau, but I'm assuming this is a non-interactive graph that you can't drill into or manipulate so this is what your audience can understand from two graphs. enter image description here

Pie charts are awful, so I'll save that for another time. 2-D visualizations (pie slices) don't represent 1-D information well and it makes it extremely difficult to compare values.

  • +1 one graph for each question - a very good rule of thumb! There are some caveats to the 'Pie charts are awful' statement, but that's another debate altogether...
    – Michael Lai
    Commented Apr 7, 2016 at 0:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.