Text Link Test - WhichTestWon

Results for: Color vs. Size: Which Text Link Got More Clicks — the Smaller Red Link or the Larger Black Link in the Right-Hand Sidebar?

Winning Version

A

36 Comments

Reader Guesses:

  • VERSION A
  • VERSION B
Loading ... Loading ...

WhichTestWon's Analysis: (Click back to see versions A & B)

Version A got a 37.3% higher conversion rate (clicks on the download link) than Version B.

Paras Chopra, a technology entrepreneur, used Visual Website Optimizer (see tech profile) to conduct this multivariate test on a free software download page on his personal website. He tested four versions of the “Download” subhead in the right-hand sidebar and three versions of the text link under the subhead. That created a total of 12 different versions of the page. The results between Versions A and B reached a 99% confidence level. Nearly all traffic to the page came from natural search or referring websites.

The only difference between the two versions was the text link under the Download subhead: Version A used red text in the same font size as the other links in the sidebar. Version B used a larger font, but in the same black color as the other links.

We think it shouldn’t be surprising that the red text link got more conversions. Although Version B’s link stands out because it’s bigger, it’s not obvious that it’s a hyperlink. In nearly 20 years since the development of the first browser, Web users have grown accustomed to looking for hyperlinks that are a different color than the rest of the text. Testing different treatments (like red instead of the typical blue) or placements for your links is highly recommended, but don’t forget to clearly to tell visitors “This is a link!” in the way they expect – by using different color text.

> Tweet that you ‘Got it Right’ here.

> Tweet that you ‘Got it Wrong’ here.

Share

36 Comments: Post a comment

Direct marketing designers always swear by red to improve results, but I don’t think it’s the red so much as the fact that it’s a different color than other stuff on the page. If it catches the eye, it works. The problem is when sites have too much that catches the eye. If you want great conversions, you want to keep everything “muted” except the call-to-convert.

That said, I’ve also seen this may not work in Asia where pages that convert better can look insanely busy to Western eyes….

I would also add that the links on these pages do not have underlines and the different color links (non-black reds and blues) help visitors to identify possible links.

I’m wondering if someone will do a test on underlined links vs. links without underlines. (hint) :)

Anne your analysis nailed it head on, it’s the difference that makes it attractive. Another proven direct marketing technique is using yellow highlighted text, underlines and call outs. But again as you said when all of it is trying to catch the eye it’s lost.

I chose red on the principle that it stands out. It was very hard to tell what was happening on this page–very disorganized. Kind of funny that they’d test this but not some basic, clear design principles first. I’d have put everything in one column with multiple download links.

You know, I always thought that red is alarming and in the text puts people off. But you proved me wrong guys :)

Anne’s right – it’s not the red its the indication that the words are a link. Red as a headline in ads is harder to read than black. As an iconic element on a black and white page it can’t be beat.

It’s all about the contrast. Don’t forget the conventions already instilled in people by IE. Where links go different colours depending on your history etc. I believe red is the default hover colour, so maybe we are already conditioned to take action with a red link?

Red, in this context, clearly stands out, though I’d usually recommend using an underline to highlight links for those users who may have an insensitivity to the colour being used (commonly red and green and even, but more rarely, blue).

I suspect most people probably clicked the “Download” text first. The red link at least showed it was a link.

Nice test!

@James – I see our company doing a test (underline vs. non-underlined link performance) in the near future as I’ve often wondered the same thing :)

I find red to be a negatively-associated color. However, since it was another (vs. black), it did stand out more. I’m wondering if blue or green might have worked even better.

Got it right this time – because I guessed that any different color/size/font to differentiate a link versus same size/color/font – anything that would draw attention to the link has to beat camouflaging it. I’d be interested to see the other treatments – were they color/size variations of the link text? If so – which colors did red beat?

Have to be careful w/ red – especially when considering cultural implications…I think (like Anne mentioned above)..it is more a matter of mixing different colors to create a visually attractive mix…

Even seeing the thumbnails side by side on a small screen you could see the answer to this one. Your eye immediately finds the red link. To me this proves that judiciously used color beats font size. Still unanswered: does one color beat another color (other than black).

I chose red because it stood out from other text on the page in a quick scan. It would be interesting to see a test of red vs. blue, too, for the negative association with red, as mentioned by several people.

Good test. Our company gets frequent web design guidance that is around changing fonts, adding pictures, etc. to provide “a more engaging experience”. Nice to see another example mythbusting analysis!

I wonder, since it was a multivariate test, what the difference was between small red and large red – that would be a truer test of size for me.

@Salvatore and @Linda

To answer your question… He tested 3 links in total. One was black in the normal font size (same size as other links in the sidebar). One was red as mentioned in this test, and one was larger and in the default color (black). So, no, he didn’t test any other colors. But the red link beat the big link by 14.8%. And the red link beat the normal-sized black link by 8.5%.

Natalie Tomasso
Senior Reporter
WhichTestWon.com

It might not just because of the color, just from the principle that it stand out. It is more a matter of mixing different colors to create a visually attractive mix to the people.

- I do believe in general links should be underlined, as someone mentioned sensitivity to color
– Black might have worked if it was underlined
– I don’t think size matters much here
– In some cases not underlining works, but usually when the link is the standard Blue link color (people are trained to know those are links)
– In general there is too much on this page, the awards and other buttons are more prominent than call to action

I choose the red because it has catched my eyes to the download link. They must test with a button too, there are so many texts and no images in the page

I don’t think it’s necessarily the color red. Red indicates error or wrong to me.. think it just needs to be a color that stands out from the design. Underlining helps as well but not as attractive

I wonder if one of the other variation they tested was the blue underlined link? If not the test I like to see if link blue vrs red

Red seems to work with everything… links, buttons, etc.

But I mean… a black link? Who does that?

I’m wondering why he didn’t test the obvious color…blue. It’s pretty universal that a blue link, especially underlined, is a live link. I chose red because it stood out, but the lack of an underline puzzled me. Maybe more testing is in order now that they’ve determined the red is control.

I picked A because my eye immediately went to the ‘call for action’ button; the large text PDF Creator Free Download. I only looked at the red text for a nano sec and didn’t read it. With B, the larger black text was more of a distraction. I’m time limited and just want to quickly know what is it, do I need/want it, and move on and A did that.

I wonder how a larger red link performed?

Like some others above, I think it’s not so much the color red as it is the fact that it stands out more and is a more obvious link.

The only place I regularly see black links is on news sites (eg: http://www.heraldsun.com.au/) and some blogs. Maybe they can get away with it in that context because we all know the format and expect that we can click on the headings.

For a call-to-action link (like download, add to your cart, buy now, etc) it’s critical that the user can see these options exist. It’s up to the user whether they choose to take the action, but at least you’ve communicated well so they can make an informed decision.

Ultimately websites are a communication, so there’s no benefit in making it difficult for the audience to understand what you’re communicating.

Interesting test! There HAS been research on underlining vs not underlining links – by Tom Tullis of Fidelity Investments. See pages 46-52 in his useful deck called “What’s the Latest Research on the Design of Web Pages Show?”at http://www.measuringux.com/presentations/LatestResearch/

As someone else mentioned, it’d be interested to see the results of the next logical test. An ‘A-C’ test with a red link that has a larger font.

The black “link” doesn’t appear to be a link at all. I wonder if an underline would generate more clicks versus no underline.

maybe this is why stop signs are red because they want us to notice…

Agree with many of the comments above. When you make headers link colour and links text colour, how you would expect the customer to know whats going on at all beats me. Neither really loooked like a link at all, but the red looked more like a possible link and was the more likely candidate.

Simple color theory at work. Make everything black…then make your call to action a different color. The curious eye will find the link.

I am not sure if this test was implemented correctly. From what I read we have 3 recipes. what were we testing for? color or size or both?

1. Black text normal size
2. black text large size
3. red text small size

If red text small size won, then it means combination of small text and red color is effective. We don’t know if Red color by itself caused an impact. Did 1 and 3 recipes have the same text size?

GET OUR FREE, ADDICTIVE WEEKLY TEST RESULTS