Close
Join 237,000 weekly readers and receive practical marketing advice for FREE.
MarketingSherpa's Case Studies, New Research Data, How-tos, Interviews and Articles

Enter your email below to join thousands of marketers and get FREE weekly newsletters with practical Case Studies, research and training, as well as MarketingSherpa updates and promotions.

 

Please refer to our Privacy Policy and About Us page for contact details.

No thanks, take me to MarketingSherpa

First Name:
Last Name:
Email:
Text HTML
Join Our Research Team at DMA 2014
Nov 26, 2013
Case Study

Email Marketing: 24% higher CTR for CareerBuilder's responsive design

SUMMARY: Mobile readership was growing and the marketers at CareerBuilder had to respond. They hoped that making it easier to read their emails on a tiny screen would help accommodate the growing audience and lift clickthrough rates.

In this case study, you'll discover how the nation's largest online employment site lifted clickthrough rates 24% by making one of its emails "responsive." Now the team is using the tactic in other email programs and seeing similar results.
by Adam Sutton, Senior Reporter

CHALLENGE

The emails at CareerBuilder, the largest employment site in the U.S., are never "finished." They are tested constantly. Every 12 months or so, the marketing team scraps them and starts over.

"Every year, we kind of throw out everything and do a new template test," said Scott Burdsall, Senior Email Marketing Manager, CareerBuilder.

When it came time to redesign the site's "relationship emails," the team noticed a surprising trend in the program's readership. The percentage of people who opened the emails on a mobile device was almost twice the company's average.

"We were a little bit ahead of the curve and we knew we had to address this shift in where people were reading our emails," Burdsall said.

CAMPAIGN

CareerBuilder had no way of knowing whether a given subscriber would open an email on a desktop, smartphone or tablet. The team needed to find a design that accommodated an array of devices.

Step #1. Pick a responsive style

Responsive emails automatically adjust to a reader's device or software when opened. For example, a person can open an email on a smartphone and see one layout, then open the email later on a desktop and see another layout.

The goal is to deliver a better experience and hopefully better clickthrough rates.

Different types of responsive

A way to make an email responsive is to have it automatically adjust its width to match the reader's screen, Burdsall said.

"It doesn't give you as much control over the creative elements in the body, but itís still responsive," he said.

The team wanted to give mobile readers a better experience. They chose to design the email to adjust its entire layout to match a reader's device. This was done with the "@media" rule in the cascading style sheets language, or CSS (see the Related Resources section below).

Step #2. Design the email

Since CareerBuilder's relationship emails had a large mobile readership, Burdsall envisioned subscribers reading them on-the-go.

"I had in my head someone on their way to work checking the email on a bus or a train and only having one hand available to look at it," he said.

This in mind, the team incorporated the following elements into the new template:
  • Easy to scroll — Zooming and scrolling in all directions is not easy with one hand. To simplify navigation, the email used a one-column layout when opened on a smartphone or tablet and a two-column layout when opened on a desktop.

  • Easy to click — The calls-to-action in the new design were larger and brighter, Burdsall said. This made them more "tapable," i.e., they were easier to tap with a thumb as opposed to a mouse. The team also cut the number of calls-to-action.

"We cut out a lot in order to really make room for the calls-to-action that we wanted to highlight," Burdsall said.
  • New preheader — The preheader of the older email had a view-in-browser link and a small batch of HTML text, which "wasn't the most mobile-inbox-friendly," Burdsall said.

The updated preheader complemented the email's subject line. For example, a subject line of "We have new jobs in Chicago" might have a preheader that states "come search for new jobs," Burdsall said.

Step #3. Run an A/B test

The new design applied to what Burdsall calls the company's "relationship marketing emails." These messages are sent to registered users who recently visited the site or engaged an email. The buttons and links highlight jobs and articles, some of which are dynamically personalized for each recipient.

The audience is segmented into five groups ranging from the newest members to the least-engaged recipients. To test the new design, the team ran a 50/50 split A/B test across all the segments for three weeks.

"I really wanted to see the value of having this updated design and also this responsive element," Burdsall said.



RESULTS

CareerBuilder's new responsive email had great results with each of the five segments. The improvements ranged from:
  • 21% to 24% higher clickthrough rates

  • 15% to 17% higher open rates

But, the team had only started.

"That [design] then became our control for that particular program, but it also allowed us to open the door to adding a responsive element to existing templates for other programs," Burdsall said.

"It allowed me to go to other groups and say, 'Hey, we saw this kind of increase as a result of incorporating this new design tactic in our emails, and we recommend you guys do the same.'"

The team tested the responsive layout in its job recommendation email without changing the email's preheader.

The results:
  • 7.5% higher clickthrough rate overall

  • 15.2% higher clickthrough rate for mobile readers

The improved open rates in the first test also persuaded Burdsall to test more preheaders.

"That was a big takeaway for us, incorporating that into other programs, but thatís a really easy thing to do that doesn't require a developer or coder like the responsive design element," he said.

Creative Samples

  1. Relationship email — old template

  2. Relationship email — new template, desktop

  3. Relationship email — new template, mobile

  4. Job recommendation email

Source

CareerBuilder

Related Resources

Responsive Email Design with CSS

Email Marketing: 58% of marketers see mobile smartphones and tablets most impacting email

Mobile Marketing: 31% of marketers donít know their mobile email open rate

Email Marketing: Simple design change to incentive raises clickthrough rate from the dead by 48%

Email Design How-to: 5 insights to improve open and clickthrough rates



Post a Comment

Note: Comments are lightly moderated. We post all comments without editing as long as they
(a) relate to the topic at hand,
(b) do not contain offensive content, and
(c) are not overt sales pitches for your company's own products/services.










To help us prevent spam, please type the numbers
(including dashes) you see in the image below.*

Invalid entry - please re-enter




*Please Note: Your comment will not appear immediately --
article comments are approved by a moderator.