Marketing and Sales

7 Principles of Conversion-Centered Design

12 minutes

7 Principles of Conversion-Centered Design

Experienced marketers have come to understand that there are certain patterns and triggers that make landing highly-converting. They’ve turned their observations into actionable guidelines, and here we are — that’s a brief story of conversion-centered design. There is no more need to read tea leaves and try to predict your users’ behavior. Now, you’re in control.

In this article, we’re going to talk about conversion-focused design and the ways you can use it in your emails and landing pages. Keep in mind that your design choices should never be random — every single detail can serve a purpose!

What is conversion-centered design, and why should you care?

Conversion-centered design (CCD) is a set of rules or principles for designing commercially effective landing pages, email templates, and other types of content. Using this strategy, you can create content that brings you more high-quality leads, subscribers, and customers.

Originally, these principles were coined by Unbounce’s team. They have entered the marketing vocabulary and are now freely adapted and interpreted by various experts and practitioners. However, their meaning and relevance haven’t changed a bit.

Let’s admit it, it’s 2021, but many landing pages remain confusing and unintuitive.

This landing page lacks conversion-centered design

A user lands on this page after clicking on an ad for an NY-based bakery. For starters, the page isn’t relevant to the ad. It has a slider with tons of low-quality images and duplicates, a bizarre number of links, a gigantic menu, and no explanation as to why users should even pay attention to this venue. It’s hard to understand what’s going on here, and this is far from an isolated case!

Conversion-centered landing page design helps avoid the confusion that users often experience after landing on a typical cluttered commercial page.

“Should I order before this sale is over? But how do I know it’s not a scam? Oh, wait, they have more products. Should I watch this video first? But it’s too slow. Ah, forget about it, I’ll just order something similar from Amazon.”

You certainly don’t want the same monologue to take place in your visitor’s head.

You want your landing pages and emails to gently guide your users and provide them with a delightful, smooth experience. Your goal is to stay connected with your audience and keep them interested in your brand. You want them to convert effortlessly.

Conversion-centered design is the exact approach you need to take to achieve that. Persuasive design will help your users recognize the value of your offer and act on your call to action. We’ll go as far as to say that every single design element on your page can drive conversions — and it should!

Learn how to improve your landing page conversions by changing your design, adding copywriting hacks, and using psychological tricks.

So, here are the seven principles of conversion-centered design you need to consider when creating a layout:

  1. Help visitors focus. Make sure users can grasp the meaning of your offer at a glance.
  2. Create a solid structure. Develop a content hierarchy that creates a natural flow.
  3. Maintain consistency. Give your content a coherent, unified look.
  4. Highlight benefits. Use every design element to point out how much easier life gets with your product or service.
  5. Make your CTAs stand out. Let your users convert at any point in their journey.
  6. Gain trust. Show what your customers and industry experts think about your product or service.
  7. Create a frictionless experience. Declutter and optimize your page to make it more intuitive and convenient.

Do you always need to go with a conversion-centered design? We dare to say no. There are some exceptions to the rule, such as purely entertaining or informational pages or emails that have no specific CTAs. However, commercial content almost always requires taking a conversion-oriented approach.

Principle 1. Help your users focus

Any idea, no matter how complex, can be outlined in a comprehensive, clear way. No one wants to read pages of text about something they have never even heard of before. You need to put forward and emphasize the top features of your product or service while omitting secondary details. Inject some directionality in your content to make sure your users stay on track after reading a couple of sentences.

The best way to do it is to create focal points throughout your text. Focal points are visually prominent elements, usually contrasting headlines, factoids, or parts of images such as a human face. They make it easier to scan text and work like bread crumbs, forcing a user to go from one section to another to collect them all.

Let’s see how it works in real life.

Conversion-centered email design in action; source: Really Good Emails

Ando’s email design highlights their unique selling proposition “Mobile banking for a more sustainable tomorrow.” The strong headline is followed by a concise description motivating readers to learn more about eco-banking and open an account in no time.

There is also a positive illustration, but it doesn’t steal the show — the main focus is still on the offer. In this example, we see how helpful it can be to break down complex texts into bullet points accompanied by custom icons. It increases the overall readability and makes the email more conversion-focused because its audience can immediately see the main advantages of this banking system. Last but not least, the complete lack of legalese helps readers focus on the meaning of the offer.

We previously demonstrated a restaurant landing page that had some room for improvement. Now, let’s take a look at the epitome of conversion-centered landing page design.

This bakery’s landing page helps users convert by feeding them the most important information

This page really grabs the user’s attention and makes them crave those cookies — it’s just impossible to focus on anything else. Popping headlines and mouthwatering photos instantly explain what the page is about, and clear-cut descriptions do the rest. The creators of the page placed less important sections, such as brand history and user-generated content feed, closer to the footer so as not to distract their first-time visitors.

Principle 2. Create a solid structure

Just like us humans, commercial content also needs a strong and healthy backbone — a structure that will keep all of the elements in place. The right email or landing page hierarchy will help your users grow awareness, develop trust towards your brand, and convert naturally with ease.

It’s a rookie mistake to just pick a template that looks nice — you’ll have to retrofit your content and make some sacrifices. Instead, create a rough draft yourself, mentally or manually. Define your goals and outline what you need to communicate to your audience. Then, look for a template that will fit that very structure.

Here is how it can be done — a special offer email from Diadora.

A typical eCommerce email that converts

This conversion-centered structure isn’t random at all — most eCommerce emails have the same hierarchy of importance. There is a neat menu on top, an attention-grabbing visual element, a short description, and a CTA button. These key elements are usually followed by slightly less important clickable product previews and additional descriptions.

Find out more eCommerce email examples that illustrate some design and copy golden rules.

Having a sturdy structure doesn’t mean adding block after block and making your email or page chock-full of text and images. Reserving some negative, or white space is just as important — it gives your layout some air to breathe and makes it look light-weight, simple, and elegant. White space only increases conversions when used wisely because it draws attention to the remaining elements.

Take a look at this precisely assembled landing page for an AI speech analysis service.

This landing page has a lot of evenly spaced elements

This page makes good use of white space. It has a lot of information, but the elements don’t sit on top of each other and don’t create a visual conflict. Yet the page is conversion-friendly — it has many contrasting CTA buttons, actionable copy, and value-based content. The structure is there, but it also has just enough air to let visitors breathe.

Principle 3. Maintain consistency

It’s nice to experiment and play around with styles, but you need to maintain a coherent look for your content assets to be recognized, gain authority, and turn your leads into repeat customers. Easily identifiable graphic elements, unique font combinations, or a color palette — use anything that corresponds with your branding and makes your content distinguishable.

Make sure to check out our post about different types of branding to understand which strategy to choose for your business.

Brand recognition is not just something that big companies like Apple and Tesla worry about. A brand of any size can not only be recognized but also appreciated, loved, and promoted by its core audience. Take Judy, an emergency kit producer, as an example.

Emails from Judy perfectly correspond with their brand style; source: Really Good Emails

Compare this email with the Judy website, and you’ll immediately notice similarities: recognizable typefaces, the same shade of orange, a friendly and caring tone, educational elements, and an emphasis on family safety. There is no disconnection — you feel that you are interacting with the same brand, just through different mediums.

When users receive emails from a specific company on a regular basis, they get used to that unique communication and visual style, and come to recognize emails from that brand in an instant. If you want to deepen relationships with your audience, you need to provide them with a unified experience across different channels every time.

Principle 4. Highlight benefits

We write a lot about email design and landing page design in our blog, so you may have already heard about the importance of a customer-centric and benefit-driven approach. It’s a crucial component for increasing conversions — benefits make a certain product or service desirable for consumers. You can highlight them with the help of witty copy and attractive imagery or videos.

Let’s look at a landing page promoting David Horsager, a bestselling author, speaker, and expert on leadership trust.

Make your product or service stand out by describing its benefits

It’s really hard to convey personal charisma over text, but this landing page successfully does it with its straight-to-the-point copy, convincing reviews, and eye-catching videos. The website makes it clear why big companies hire David to speak at their events, and how he can bring actual value and positively impact every event attendee. Visitors are encouraged to contact David’s team after learning about his expertise.

You can also translate the benefits of your product through selected images to convey a certain mood or atmosphere.

Try including relatable images with people using your product in real life

Instead of talking the talk, this email just invites users to celebrate the power of exercise and movement by tapping into their emotional side. It includes authentic, real-life photos with free-spirited characters living an active life while wearing Asics trainers. A fish-eye effect makes the images look more spontaneous and captures that vibe perfectly — it’s very tempting to order a pair and join the Asics community.

Principle 5. Make your CTAs stand out

Your content remains powerless without CTAs. Make sure you have at least one prominent CTA button above the fold and additional CTAs across the text if your content requires scrolling. Keep your CTA copy short and include active verbs motivating users to take action right now.

Find out some valuable tips and tricks on how to improve your website and email CTAs.

We can go to Blendjet’s resources for some conversion-centered landing page design inspiration.

Blendjet utilizes all principles of conversion-centered design

“Get yours today” is a fantastic example of an effective CTA. If you offer express delivery, mention it in your CTA to let your users know they can get their hands on your product just in a couple of hours or days. On this page, we also see additional CTAs such as “Explore recipes,” but they are intentionally made see-through and, therefore, are less noticeable.

If your brand’s color palette doesn’t include bright colors, you can just make your call to action buttons bigger to make them pop, like in this example from Under Armour.

Emails from Under Armour include elegant and effective CTA buttons

A good rule of thumb is to keep your CTA’s font-weight heavier than your plain text but lighter than your first headline. Buttons are much easier to notice and click on than hyperlinks, so you can’t go wrong using them in all types of commercial emails.

Supporting copy isn’t always necessary — it makes a page or email look a bit more cluttered, but you need it if your CTA implies making a purchase. Then, “Money-back guarantee” or “Try it for free for 14 days” may dissolve users’ doubts and ultimately boost your conversion rate.

Principle 6. Gain trust

Social proof can be the key to your audience’s heart if you use it right. We’ve already talked about the means of collecting customer feedback on our blog — make sure you have positive reviews to start working with.

Don’t limit yourself to logo bars — they barely show the brands you worked with, not their sentiment towards your business. We recommend turning every customer’s testimonial into a small success story. The more touching, diverse, and authentic your social proof is, the more trustworthy it will appear. Add real names, occupations, and photos of your clients if they are ready to provide them. But, more importantly, ask them to describe their real impressions and emotions sparked by your product or service.

Working Against Gravity is an online nutrition coaching program, and their clients don’t shy away from sharing their impressive transformation stories with before and after photos.

Make your social proof tangible and confirmable

Another way to win customer trust is by reminding them about your brand’s heritage and rich history. That’s the way Sergio Tacchini, a fashion sportswear brand, prefers.

Emphasize your brand heritage to gain customer trust

If your business has cultural influence on a local or a global scale, you can also turn that fact into an engaging story to tell. People are drawn to brands with history because it shows their reliability and integrity, as well as their commitment to quality.

Principle 7. Create a frictionless experience

The user experience starts with the loading speed of your content. If you suspect that your landing page is too heavy and is hindering your conversions, don’t guess, just check it using Google PageSpeed Insights.

The next example will convince you that you can create a nice and colorful website without stuffing it with special effects and other heavy elements.

Bombas offers a great shopping-friendly experience

Bombas is a company producing durable socks, underwear, and shirts. They also support homeless people by donating an item from every purchase made. This incredible purpose-driven business somehow made shopping for underwear more pleasant, thanks to its simple and intuitive website that’s just fun to use.

Do you know how to conduct UX/UI research? Make sure to check out our new post!

You also need to analyze your content and make it user-friendly and mobile-first. Use one-field forms, single-column layouts, and responsive design to make your emails and pages easy to read on the go. Keep in mind that more than half of all emails are opened on a mobile device.

There is one way to be absolutely sure your emails are displayed correctly on any device and even with slow Internet speeds — you can embrace simplicity and intentionally strip your content of flourishes and bulky elements.

VSCO’s team uses plain text emails and gifs to announce their new features and improve their click rates

There is a clear trend in favor of plain text emails that have that imperfect, natural feel to them, so it’ll also be a smart stylistic choice. Clean, minimalistic emails will create a smooth experience and softly push your users to convert without overwhelming them.

Tying it all together

Follow these seven principles of conversion-focused design, and you’ll give your content a harmonious, balanced look while also capturing new leads and growing your customer base. You can also try SendPulse tools to implement what you’ve just learned.

How about starting with our drag and drop landing page builder? You can customize any of our templates and create conversion monsters by only including the elements you need. Or, supercharge your email marketing campaigns with our code-free email builder and automation service. With our tools, you get enough creative freedom and open new ways to increase your conversion rates!

Date of publication:

July 22, 2021

Elena Timofeeva

Good writing makes my heart beat faster. So does a good conversion rate. In my free time, I obsessively learn...

1 Star2 Stars3 Stars4 Stars5 Stars
Average Rating: 5/5
Total Votes: 33


Facebook Twitter