Trying to get more folks to sign up for your email list? Hitting them with a flashy pop-up ad the second they get to your site almost never works.
Think about it: if someone were to walk up to you on the street and ask for your email address without any explanation, you’d probably shake your head and keep walking.
In that scenario, they didn’t even say hello or attempt to build trust, something that’s necessary if you’re trying to get people to use your product for the first time. One of the best ways to do this: create a user flow that allows your content to first build the user’s trust, and place your call-to-action boxes more strategically.
For this post, our example business objective is to build an email list. We can assume that the user’s objective is to subscribe to our product once they learn a little bit about it. First we’ll look at some examples of effective call-to-action placement, and then we’ll check out some design strategies to help grow your email list
.
Design a user flow that keeps readers captivated
A user flow is the journey a visitor takes on your website. Ideally, this path will end in the completion of a specific task, such as purchasing a product, signing up for something, or giving their email.
“Want your CTA to be the first thing people see? Try designing an elegant CTA page.”
In order to design the best user flow possible, keep 2 things in mind:
- Establish your business objective, or the action you want users to take on your site
- Identify the objectives, needs, and desires of your users
You need to determine these 2 things before designing your user flow so that you can foresee and prevent anything that might interrupt this process.
This is the path you want someone to take: a person arrives at your site directly or through another source like social media. From there, they see engaging, meaningful content that gives them joy or sparks their interest. Based on this content, they sign up for your email list.
We can design the user flow to look something like this:
Once you’ve established your user flow, everything on your site should serve to meet your end goal.
4 tools to improve your call-to-action placement
1. On-exit lightbox
Rather than accosting people with a lightbox, design your call-to-action to pop up once someone’s scrolled to the bottom of the page. This is a much less disruptive way to ask for their email.
Editor’s note: We’ve found success with this strategy, so be sure to test your own CTA options on your audience.
This strategy relies on the assumption that they’ve taken the time to get to know your product—or your writing, if it’s a blog—and they now feel more comfortable sharing information.
“Design your CTA to pop up once someone’s scrolled to the bottom of the page.”
Just because someone’s reached the bottom of your site, they might not be trying to leave. If they’d like to learn more, your call-to-action could be really helpful.
On-exit lightboxes have a way of simplifying the visitor’s decision-making process. They present users with a yes/no process as opposed to having no decision-making platform at all.
“Just because someone’s reached the bottom of your site, they might not be trying to leave.”
OptinMonster is a useful tool to help you create your own exit lightbox. Here’s an example:
They set up their box so that right as you’re just about to leave the site, you see a message offering you valuable information in exchange for your email.
2. Scroll box
You can have a scroll box pop up after “x” amount of content gets read. This is assuming “they’ve come this far, so they’re probably interested.” Scroll boxes are most effective on blog sites.
Scroll boxes are also less disruptive than call boxes because you don’t have to exit out of them. You can keep scrolling, and the scroll box just sits at the bottom corner until the user is ready.
They’re gentle reminders that a user can subscribe whenever they feel ready.
Here’s an example of a scroll box on AddThis:
Their scroll box stays out of the way enough so that people can still read the content until they decide to subscribe.
SumoMe has a scroll box app you can insert in any corner of your site. You can also design your scroll box to look and say whatever you want. Bonus: it also works on mobile, which is great because for most sites, 30% of traffic happens on mobile phones.
3. Call-to-action bar at the top of your page
If you don’t like the idea of having a box pop up, consider placing a call-to-action box at the top of your page.
This method is effective because it also isn’t annoying or disruptive—it’s a clear and easy way for users to subscribe.
It allows users to explore your content first, but since it’s one of the first things someone sees, they’ll know to return to it if they’re interested in subscribing.
Customer.io does this on their blog page.
Their call-to-action is simple and clear—and it doesn’t interrupt user experience on the site.
2 excellent tools for this are Smart Bar by SumoMe and Hello Bar. Each tool acts as a gentle reminder for users to subscribe to your content.
4. Minimalist, single call-to-action page
If you want your call-to-action to be the first thing that visitors see, rather than trying an immediate light-up box, try designing a simple and elegant call-to-action page.
This is less annoying because it doesn’t interrupt a visitor when they first land on your site. That initial light-up box might come across as a trick or as a nuisance, but clear, attractive landing pages act as a nice form of introducing a user to your site.
SumoMe’s landing page gives you their mission in a concise statement, a fact citing the 100,000+ other users of their product, as well as their call-to-action.
SumoMe’s Welcome Mat is a great tool to help you design a beautiful and clear call-to-action landing page, and has proven to double or even triple daily email conversion rates.
Make your call-to-action visually appealing
Now that you have some excellent tools to help better place your call-to-action on your site, it’s time to think about design. Your call-to-action should be noticeable and attractive, especially if it is not the first thing a user will see.
“The design is just as important as the placement.”
Studies show that people are wired to respond to visual marketing. The design is just as important as the placement because sight is our main sensory skill. The use of visual information has increased on the internet by 9,900% since 2007.
4 factors to consider in your call-to-action design:
1. Color
Color is one of the most important components to consider when designing your visual information. Information with color will be located 70% faster, and it’ll help boost your sales by 80%.
This is largely because we inherently attach meaning to colors. We tend to like colors that are either evolutionarily or individually associated with objects or memories that are affectively positive.
“Trust is an important component to growing your email list.”
Blues and greens tend to be associated with amicability and peacefulness, whereas browns and yellows tend to evoke a negative affect. Reds denote a brashness, but they can be used strategically.
ProfitWell implements these color strategies in their call-to-action header:
Their choice to use blues and greens actually helps garner trust. Trust is an important component to growing your email list. The color wheel below shows which colors are most associated with trust.
Colors set your content apart and are a way to make a certain message visually stand out.
2. Images
Images have been shown to greatly increase user engagement with content because images reduce a lot of information to a simple idea. We can also understand visual information in an instant.
Think about this traffic symbol and the actual idea behind it written in text.
This concept is especially important for calls-to-action, because if you can entice a viewer with an image or symbol that’s associated with an abundance of positive information, then they’ll be more likely to want to follow through with your request.
Here’s a fun example by GetResponse:
Fireworks are associated with happy memories and celebration, so you’re thinking of these things as you choose to subscribe.
3. Faces
We’re naturally drawn to the faces of others so much so that evidence suggests there’s a special cell in our brains that fires when we recognize faces.
Faces are also strong indicators of feelings. And as humans, we’re attracted to emotions. We’re constantly analyzing and assessing others’ expressions and micro-expressions in an attempt to figure out their emotions.
Take Noah Kagan’s landing page, for example, on his blog OkDork:
His smiling face signifies joy and honesty, and we can identify that he’s probably a friendly person. He also gives you an enticing and concise introduction about what you can expect from his blog.
4. Movement
Like color, movement also has a way of capturing our attention. Used in visual marketing, movement keeps users alert and interested in what they’re seeing.
When you see something moving, you’re immediately drawn to it. Movement stands out when everything else in our field of vision is still.
“Movement keeps users alert and interested in what they’re seeing.”
Scroll boxes and on-exit lightboxes would then be the best choices if you want to rely on movement to signal your call-to-action. The user’s eyes will drift right to that box. It’s just a matter of doing it in a way that isn’t disruptive or annoying.
When designing your email call-to-action, consider user flow. Outline your business objective and your users’ goals to design a call-to-action box that’ll get the best results.
Once you’ve established that, keep in mind placement and the design. The less annoying and more visually appealing something is, the more conversions—and the bigger your email list will become.
by Walter Chen
Walter Chen is the founder and CEO of iDoneThis, the easiest way to run a remote daily standup with your team.
