Tag Archives: unbounce

Thumbnail

Are AMP Landing Pages All They’re Cracked up to Be? A Look Into Page Speed

AMP landing pages worth the fuss?

For a while now you may have heard the buzz surrounding Google’s Accelerated Mobile Pages (AMP), and—if you haven’t already done some research—you might be wondering what all the fuss is about (or wondering why a landing page and conversion platform like us hasn’t mentioned this trendy topic yet).

Well, we’ll get to all of that! Today we’ll walk you through everything you need to know about AMP as a marketer and why your Google rep has likely been singing its praises.

First up: What is AMP?

AMP is a project that was first announced by Google back in 2015 as a means to serve up mobile pages faster. Accelerated mobile pages use a restrictive HTML format to serve up web pages almost instantly to your visitors, with the added benefit of pages being cached and pre-rendered by third parties (like Google, Facebook, Twitter, Bing News, and Cloudflare).

This is a stark change from waiting for every single element on your page to load and, at its core, it’s a way of developing simple web pages that meet strict guidelines for preventing slow load times. It’s helping bring the internet back to basics.

AMP pages on mobile
How AMP pages look in mobile search results.

Early adopters of AMP included publishers like The New York Times, The Guardian, and The Wall Street Journal. Much like Facebook’s Instant Articles, AMP gave these publishers a way to reach audiences in an almost-instant way (ultimately important for decreasing bounce rate, and signalling to Google your content is satisfying visitors). Since publishers run their business on page views, this was a natural place to start and great fit for AMP.

Google then created extra incentive for publishers by prioritizing AMP articles in their “top stories” carousel. You can currently spot AMP articles in your own mobile search results by looking for the AMP thunderbolt symbol.

Some AMP myths, debunked

The AMP Project has come a long way since 2015, but it’s still having a hard time shaking some of its roots. Here are a few of the myths floating around:

Myth 1: AMP is only for online publishers
AMP landing pages are a perfect match for publishers, but serving up news faster is not its only use case. Believe it or not, even eCommerce brands are increasing their revenue with the same traffic by converting their product pages to AMP.

While this giant conversion over to AMP may sound like a massive undertaking, remember: You don’t need to create an entire AMP mobile website like Aliexpress. You can start with a single landing page that lots of customers reach from organic or paid search. Simply decreasing your bounce rate on the visitor’s first entry and speeding load time up can have a big impact on first impressions, and ultimately your conversion rate.

Myth 2: AMP is owned by Google
We can’t deny that Google has been the driving force behind the AMP technology and its adoption around the world. But despite its massive role in driving AMP forward, the team is insistent that AMP is not a Google project, but rather an open-source project. Although the lion’s share of the more than 500 contributors on GitHub are Googlers, they’re not the only ones.

Myth 3: AMP is only for mobile
It’s true mobile is a huge part of Accelerated Mobile Pages (it’s in the name, after all), but that can be a little bit misleading. As Paul Bakaus from Google explains, AMP HTML is mobile first but not mobile only. He believes you’ll see better gains from AMP on mobile pages, but recommends trying AMP on desktop as well.

What are AMP landing pages good for?

We know that fast-loading pages equal lower bounce rates and higher conversions, and AMP provides an almost foolproof way of achieving fast mobile landing pages. Its strict guidelines for what can be included have speed best practices built in, which is why AMP landing pages have a medium load time in under one second. And let’s be honest: We could all use some extra conversions on our landing pages via speed increases.

So what does AMP mean for SEO?
While an AMP landing page does not necessarily equal a higher search ranking, Google recently announced that, starting this summer, page speed will finally become a ranking factor in its mobile search algorithm.

While Google has always favored content with a positive user experience (speed being a part of that) speed did not previously have a direct effect on the ranking algorithm. Before July 2018, it might be a good idea to do some spring cleaning of your mobile landing pages (swapping out massive images and keeping things small)—whether these pages are accelerated or not.

What do AMP landing pages mean for PPC?
For a long time now, “landing page experience” has played into your Ad Rank on AdWords, and we know that page speed factors into this experience. One of AdWords’ five tips for improving landing page experience is to “decrease your landing page load time,” for which they suggest to “consider turning your landing page into an Accelerated Mobile Page (AMP).”

AdWords expert and ex-Googler Frederick Vallaeys has even called AMP landing pages “the best kept AdWords secret” due to the opportunity for improving conversion rates.

It’s really all about page speed

At the end of the day, the reason you’d create an AMP landing page is to improve your page speed. By creating these pages, you ensure fast load time, but this doesn’t guarantee your content is good enough to keep people around. Page speed is only one factor in a positive landing page experience, and won’t solve the problem of bad content.

Moreover, if page speed is what you’re after, AMP is only one way of achieving it. Even the AMP Project’s website admits that the format puts user experience above the developer experience. Simply put, it’s not the easy way to do things. So before jumping straight into AMP, consider whether or not you can reduce page speed in simpler ways, like cutting back on scripts and image sizes.

Not sure where to start, try running your landing page through our free Landing Page Analyzer for some actionable tips.

What are the limitations?

AMP can do wonders for your page speed, but it doesn’t come without a few caveats. In fact, the reason the AMP framework creates a fast page is because it is so restrictive. AMP is constantly being improved, but it’s still far from perfect. Here are a few limitations to consider before going all in on AMP:

Scripts are often not supported

landing pages built with AMP sacrafice scripts
Photo by Henri L. on Unsplash.

Scripts are a speed killer, period. Support for JavaScript is incredibly restricted in the AMP framework, so if you build an AMP landing page, you won’t be able to add all the scripts you currently use. As an example, if you want to connect your page with your CRM (a pretty common integration via a script), you’d need an AMP version of this script to be supported. Scripts are supported currently on a case-by-case basis and more often than not they’re unsupported at this time.

Analytics aren’t straightforward

Photo by Igor Ovsyannykov on Unsplash.

One of the best features of AMP is also one of its biggest drawbacks. Since the AMP pages are pre-cached, they are served from a different domain than your own. That means that your website visitor might click an ad, then visit your AMP landing page served up pre-loaded from Google.com, and then click through to your website.

This can really throw off your site’s analytics, splitting up your user sessions between your domain and third-party domains. If you’re not comfortable giving up perfect analytics for gains in load time, AMP might not be for you.

Worried about your website visitors seeing inconsistent domains? As of last month, AMP released an update that will keep the display URL as your own domain even if the page is being served from another domain such as Google.com.

Even though AMP Analytics are available, there are a limited amount of options available. Here’s what you’ll be able to track:

  • Page data: Domain, path, page title
  • User data: client ID, timezone
  • Browsing data: referrer, unique page view ID
  • Browser data: screen height, screen width, user agent
  • Interaction data: page height and page width
  • Event data

Setup isn’t super quick
Just because AMPs format is restrictive doesn’t mean it’s a walk in the park to implement. Developing AMP pages could take your developers significantly longer to create than a non-AMP page. They’ll then need to validate that their code ticks all of the boxes of the AMP format and also upkeep the pages to make sure they continue to comply with these restrictions.

Browser versions are limited
A smaller restriction (but one nonetheless) is that AMP only supports the most recent two versions of major web browsers. This means if your visitors are hanging onto a circa 2014 version of Chrome, they won’t see your AMP page.

What naysayers are saying

Like anything, there are two sides to the AMP story. Because of its close ties to Google, some think the company has too much control, using its power to shift the internet to a new way of developing web pages altogether. Some think it’s unfair for Google to pressure companies to adopt the framework in order to reach the top stories carousel or maintain their organic rankings. Others worry that Google could abandon AMP at any moment, after more than 1.5 billion web pages have already been published using the format.

On the other side of the argument, web users are speaking for themselves by abandoning slow pages at a faster rate. They’re also choosing Google more than any other search engine. Although there are alternatives, Google holds 90% of mobile market share. There must be a reason for this, and I’d hazard a guess that it’s because Google gives a better user experience than its alternatives.

From the AMP Project’s website:

“The companies involved in the project want to make the mobile web work better for all — not just for one platform, one set of technologies, or one set of publishers, or one set of advertisers. Making the project open source enables people to share and contribute their ideas and code for making the mobile web fast. We are just at the beginning of that journey and we look forward to other publishers, advertisers and technology companies joining along the way.”

What Unbounce is doing about AMP

This info’s all well and good, but you’re probably wondering: what’s Unbounce—best known as a conversion and landing page platform—going to do about AMP?

I’m glad you asked.

We’re happy to share that we’re currently building AMP capabilities into the Unbounce builder.

We’re premiering this functionality with a tight-knit group of customers in an alpha test before we open up to a wider closed beta of additional customers. The reason we’re working with a small group first is to ensure that we are able to get early feedback while we work on adding more capabilities. We’ll be closely monitoring conversion data from the alpha participants to ensure customers are seeing the value that we think they’ll see with AMP.

Here’s a taste of what it might look like in the Unbounce builder:

What took us so long?

By now you’re likely convinced that fast pages are critical to your conversion rates, and AMP can help, so you may be wondering, what took Unbounce so long to build (let alone talk about) it?

Well, we began investigating AMP and how it would work in the Unbounce builder back in 2017, and our friends at Google have been supporting us along the way. We made the decision not to publicly share our progress on AMP until we officially kicked off the development of our alpha program last month.

Trust us, page speed is something that’s been on our mind for quite some time. Last summer, our team became one of the first to complete Google’s Mobile Site Certification, and in September we returned to Google’s Canadian HQ in Toronto to join the search giant in co-hosting a mobile speed hackathon. Most recently, Google mentioned our alpha at their annual developer conference, and in a few months, they’ll be hosting the very first Canadian West Coast date of the AMP Roadshow right here in our Vancouver office.

Sign up for the AMP Roadshow at Unbounce HQ hosted by Google, on September 5, 2018.

We had hoped to bring you AMP a little bit earlier, but our team has been heads down for the past several months focused on the new General Data Protection Regulation (GDPR). Keeping your data safe and secure is our top priority, and we believe it is important to provide you a landing page solution that is GDPR compliant as this sets a critical foundation.

We are proud to say after months of hard work, Unbounce is GDPR compliant. Less than a month ago, AMP also released an update designed to help AMP pages become GDPR compliant as well.

Not sure what we’re talking about? Learn all about GDPR and how it affects your business here. (It’s a big deal).

Our next steps with AMP

Now that we’ve got your data safe and secure via GDPR compliance, our team is full steam ahead experimenting and developing AMP capabilities in the Unbounce builder. We’ve made some great progress and it’s looking pretty darn cool if I do say so myself (seriously, we can’t wait to show you). Once we’ve completed our alpha test, we’ll be widening the scope to a closed beta test.

The progress will look something like this:

  • Alpha >> Closed Beta >> Open Beta >> General Availability >> Public Launch

We’ll be sharing our progress right here on the Unbounce blog, and—if you’re a current customer (or about to create landing pages with us)—we invite you to sign up for early access to the beta once it’s launched.

Not sure whether AMP is for you? You can still achieve faster pages without this markup. Try running your landing page through our free Landing Page Analyzer to get some quick tips on how to improve your landing page today.

Read more: 

Are AMP Landing Pages All They’re Cracked up to Be? A Look Into Page Speed

Thumbnail

Could the Breadcrumb Technique Help Boost Your Landing Page Conversions?

We’ve all heard the term “less is more”. And we’ve been told this applies for landing pages too. I.e. your forms should be short and only ask for only the bare minimum of required information if you want to convert.

However, when used across the board, this advice can backfire.

As an example, one of the main questions someone typically has when faced with a landing page is is how much your offer will cost. But if the offer on your landing page is for a free quote, you can’t necessarily disclose pricing on the page. When there’s no pricing, but instead a form requiring a name, phone number, and email, the visitor knows:

  • They’re going to need to talk to someone to get an answer to their question (they’re well aware you can’t give a customized quote from such limited info), plus, prospects are very reluctant to give their information out to just anyone.
  • They can click the back button and find a competitor that will give them what they want faster.

So why would we expect a form with super generic fields to be compelling enough for someone to engage with us in all cases?

As we’ve found at our agency KlientBoost, by increasing the amount of steps and the amount of form fields, we could actually increase conversion rates. The key here for us has been the order in which we present our steps and what info we ask for first.

Can more form fields really increase conversions?

As you may know, adding form fields goes against everything we’ve typically been advised to do:

You can find the sources for the above here, here, and here.

And while there are certainly cases in which fewer form fields are best, we’ve found adding more of the right form fields in progression can help ease conversion anxiety. When done correctly, it can take your free quote/lead generation landing pages to the next level.

At our agency we call our multi-step form approach the Breadcrumb Technique – think Hansel and Gretel where the breadcrumbs lead them in the right direction.

Experimenting with the Breadcrumb Technique

This is the landing page version of the sales technique called the “Yes Ladder”. It’s the art of eventually getting to what you want (the conversion) as a marketer, by getting visitors to say yes to much smaller requests first.

Click above to see a larger image of our landing page form flow. As each step progresses, the questions become more personal in nature.

Instead of having one page and one form to capture leads, you spread the form fields across two or more steps. So potential leads that visit the first page via your ads will fill in a short form and, after clicking the CTA button, they’re directed to the next step.

The first step starts with the least personal questions that allow the visitor to stay anonymous, whereas the second (and possible additional steps) ask for more, (albeit) reasonable, personal information. Here’s an example from one of our clients ZipLending. Their landing page offers a quote for rates on mortgages:

Notice the questions being asked in the step one form:

  • What kind of property are you considering?
  • What is your estimated credit score?
  • What is your desired loan amount?

All fairly low threat questions that allow the prospect to stay anonymous but feel like they’re going to get a quality answer they’re looking for, tailored to them.

Next, they’re directed to the second step form fields:

This step asks for more personal information, but logically reminds the prospect we need this information to send custom rates their way.

And while I can’t share the nitty gritty numbers of this test, I can share some high-level results. After the multi-step changes were made in the form above, we were able to bring in 35 more leads for ZipLending from March 2017 to May 2017. The client also noticed they were really high quality leads because of the qualifying questions we had included in our first step.

When we experimented with a multi-step form for another client, Garza Law, we were able to steadily increase the number of leads, bringing in 66 more in March 2018 than in December 2017, for example. Here’s a look at that:

Depending on the industry you’re working with and the typical value of a lead, 35-66 more leads in a given month can be a huge upgrade for a client and it’s why we’re thrilled to be able to deliver this via the multi-step form approach.

Why the BreadCrumb Technique is a cool experiment

If you want to try this with your landing pages, on the first step form, you set up questions pertinent to what the prospect might ask had they called you on the phone. This establishes the custom nature of what they will receive in return.

In the particular example we’ve outlined above, the visitor is interested in getting a no-obligation quote. So surely we’d need certain information on what they’re looking for to be helpful, and because the prospect understands this they’re more willing to participate for the perceived, increased value.

Replacing highly personal, red-flag-raising questions in the first step with questions that help the prospect hone in on exactly what they’re looking for will not only grow your conversions, but often improves lead quality as well.

Additionally, on the ZipLending page, notice the the headline changes between step one and two to let people know that they’re not yet finished with the process.


The “get rates” CTA button text also changes to “send rates”.
If the language does not differ from your step one to step two, this could cause a drop in conversions as people may think the form just refreshed and they’re done with the process.

Remember: all your landing page forms need to be GDPR compliant by May 25, 2018 (featuring privacy policies and opt-in checkboxes). Learn how to make your landing pages compliant by design here.

The psychology backing up this technique

After filling out the initial questions in step one, the last step of filling out the more sensitive fields like name, email, phone number becomes much easier because of compliance psychology.

Dr. Robert Cialdini said it best:

“Once we’ve made a choice, we will encounter personal and interpersonal pressures to behave consistently with that commitment.” Influence – The Psychology of Persuasion

In other words, once you commit to small things, you’re more likely to continue onto bigger commitments aligned with your initial decision.

Scott Fraser and Jonathan Freedman also conducted research on how to get people to say yes. They went door to door asking people to put up a sign that read: “Drive Carefully” in their front yard, but only 20% of people agreed to this.

They then did the same test in a nearby neighborhood, but this time they asked people to put much smaller signs in their yard. This created the opportunity to get them to eventually say yes to putting up the original, larger signs.

Next time around, 76% people agreed to put up the larger signs compared to the original 20%. Psychology baby!

Following the multi-step model designed to ease visitors into a commitment, here’s another successful built-in-Unbounce landing page example from one of our clients:

The first step

The first form step asks about what the prospect needs.

The second step

The second step, reminding the prospect that what they want is almost ready to go.
Notice how the first step asks for make, model, and year of the car. In this first step, make sure to ask questions that are super easy for the visitor to answer, but also strongly relate to your offer.

Successful multi-step forms weren’t a one-time thing for us

What’s cool is that this multi-step landing page technique has worked for us at KlientBoost several times for different clients.

Below you can see our client Mention’s Unbounce landing page offering their free demo, Auto Buyer’s landing page for their offer on your vehicle, and Watchex’s estimate for purchasing your Rolex. These campaigns all followed the same breadcrumb technique:

Client example: Mention.
Another client example: Auto Buyer’s.
Another client example: Watchex.

Progress bars can help light the way

When it comes to multi-step landing pages, something to consider testing is adding a progress bar, or a step wizard. This is especially handy when you have more than two steps, like the following example:

Step 1 says 0% complete.
Step 2 let’s the user know that this is the last step before completion.

The wizard signals to people just how much they will need to fill out, which can help ease any uncertainty about how much information is required.

In our experience, we’ve found it works best to include the wizard starting on the second step form fields and not the first. Visitors are more likely to continue through the whole process if they start the process, as per compliance psychology.

How do you try out The Breadcrumb Technique on your Unbounce landing pages?

It’s easy! Instead of having your usual one-step form, head to your form confirmation dialog and make your first-step’s form destination direct to the url of your second step (See below).

When you select the form in the Unbounce builder, you will see options on the right of where the form confirmation goes. Under confirmation, select “Go to URL”, then paste in the url of the second step form, and make sure that the “Append form data to URL” is checked.

For the second step of the form, you must make sure a very crucial step is completed, otherwise the information from your first step will not pass over and you will not receive a full lead. See below:

You will need to create hidden fields with the same field IDs of the form fields on your first step. If they don’t match, the information will not pass over. As long as you have all fields from the first step as hidden fields on the second step, you should be just fine.

Now that your first and second step are linked together correctly, you can continue with your regularly scheduled programming of sending the second step form to your form confirmation dialog (or a thank you page). All done!

Unbounce has an easy multi-step function

There’s always more than one way to do something! Although this requires some development work, Noah Matsell from Unbounce has some helpful tips on creating multi-step forms within the same page/url. This means you won’t need to paste in the second form url as the destination of your first form.

Note that this workaround allows you to create a form with one field per step, so this may not work for those who would like to have several form fields appear in a given step, however you can test out what works for you.

To create these multi-step forms on the same page:


Step 1.
Create your form in Unbounce.

Step 2.
Create a new button element for your ‘Next’ button and one for your ‘Previous’ button. Keep in mind when positioning these buttons (and your form submission button) that only one field will be shown at a time.

Step 3.
Copy the JS from ‘multistep_form.js’ and paste it into the Javascripts section of your page with placement ‘Before Body End Tag’.

Step 4.
Update the script with the ID of your ‘Previous’ and ‘Next’ button elements. Tip: Make sure you exclude the ‘#’ in the ID.

Step 5.
Copy the CSS from ‘multistep_form.css’ and paste it into the Stylesheets section of your page.

That’s it! See the whole process and the required code here.

Test out the technique on your next landing page

It might take a bit of practice to figure out the correct questions to be asking on your first step, or to find out the type of language to use on your form; but that’s what conversion rate optimization is all about: testing and trying new things to see what sticks. Ask the questions your visitors want answers to, and ask the questions your sales people need answers to to give a prospect a more personal answer.

If you give this a try, we would love to hear about your experience with a comment below.

Remember, all your forms (multi-step or otherwise) need to be GDPR compliant by May 25, 2018. See how to make your landing pages compliant by design and allow a visitor to opt-in here.

Read original article: 

Could the Breadcrumb Technique Help Boost Your Landing Page Conversions?

Thumbnail

How to Choose the Right Testing Software For Your Business

Every customer base is unique. Your ability to win your own marketing victories depends on understanding the users visiting your website each and every day. If you’ve spent any amount of time on The Daily Egg or similarly focused blogs, you know that thorough testing is paramount to your web business’ success. You might be intuitive (or lucky) enough to correctly read your customers on any given campaign, but over the long run, success WILL depend on data analysis. Despite the hundreds of voices claiming that marketing is an art, you’ve heard of Neil Patel, Avinash Kaushik, Danny Sullivan, and…

The post How to Choose the Right Testing Software For Your Business appeared first on The Daily Egg.

Visit site: 

How to Choose the Right Testing Software For Your Business

Thumbnail

See The Landing Pages These Shopify Merchants Used to Scale Ad Revenue 33X

Year round Liz and Bill Farrell, a husband and wife team, work the dirt at Fat Stone Farm in Lyme, Connecticut with their two kids.

After making the move from cubicles to the great outdoors, the Farrells realized they loved growing fresh food, and creating healthy, farm-grown products ranging from elderberry apple shots to their own maple syrup.

Now—when you think of a typical farmer’s marketing strategy—you might picture a hand-painted sign at a local market, but Liz and Bill run a digital elderberry empire.

The couple started as Shopify merchants and then partnered with digital agency Webistry to take their business to new heights. They wanted to see better return on ad spend, and prepare for winter (their best sales season of the year).

It was a perfect partnership from the start, but nobody could predict that a combo of Unbounce landing pages, popups, a Shopify integration, and near obsessive audience building and retargeting on Facebook would:

  • Lower cost-per-acquisition from $145 (at its highest) to just $1.55(!) for the company’s Elderberry Apple Shots and DIY Gummy kits.
  • Increase return on ad spend for their Elderberry Apple Shot campaigns from 1.66X to an incredible 33.12X.
  • Deliver a cost-per-lead for a sweepstakes campaign of just $0.51.
  • See sweepstakes conversion rates from ad click to entry of up to 79.55%.
  • And garner Facebook relevance scores of 8s and 9s.

Overall, with Webistry’s help, Fat Stone Farm tripled ROAS in just five months (December ‘16–April ‘17), and—via continued optimizations—reached returns of 33X over a year and three months.

Here’s their epic ecommerce story, and the paid media tactics that could work for you too.

Winter is Coming

Historically, sales of Fat Stone Farm’s Elderberry Apple Shots go up in winter to help fight off flu season. So in early winter 2016, Bill and Liz approached Jonathan Naccache, Co-Founder at Webistry to prep some advertising.

The agency discovered that they couldn’t look to AdWords for a huge win. The search volume for elderberries or related products wasn’t super high, and this approach simply wasn’t scalable. Instead, they needed to generate extremely targeted custom audiences on Facebook (which can be difficult because prospects on Facebook aren’t necessarily screaming about their love of elderberry – these prospects need to be uncovered).

In Webistry’s approach, each ad campaign would target a group of interests that could coincide with elderberry products. They’d target Facebook users who’s interests included: alternative medicine, natural remedies, homesteading, or those engaging with popular health blogs like Mother Earth News and Wellness Mama.

It took a lot of research, and as Jonathan says this is where the agency advantage comes into play: “having access to several strategic minds, resources and thorough research gets you a significant edge right off the start.”

The First Ad to Shopify Landing Page Combo

From December 2016 to January 2017, Webistry ran campaigns on Facebook targeting each of the audience segments they’d identified might be interested in the elderberry shots.

Here’s an example of some of the ads (corresponding to fall and winter seasons):

Pictured above: the ads Webistry ran to the associated landing page.

All elderberry apple shots ads led to this Unbounce-built PPC landing page, which converts at 4.7% (lifetime average conversion rate). A conversion in this case was a purchase via the ‘add to cart’ button):

Notice the benefit copy from the ad headlines is carried through to the Unbounce landing page. Click to see a larger version.

And while the orange ‘add to cart’ button on the page looks deceptively simple, it’s actually where the magic happens. Instead of redirecting prospects to the brand’s Shopify store, Webistry fashioned custom javascript to make the button integrate seamlessly with Shopify and offer a slick, on-page checkout experience:

Interested in adding a Shopify cart to your Unbounce landing pages? Webistry shared the custom Javascript in our community. Head over, grab the script, and drive purchases on your own pages.

Two months into this campaign, return on ad spend was 1.66X, and cost-per-purchase was fluctuating between $19 and $145. Jonathan knew they could improve upon these early results and began targeting audiences of vegetarians, vegans, healthy eating affectionados, and homesteaders.

And so, in April 2017 the agency launched a new landing page campaign for smoothie lovers.

The idea was to position the elderberry product as the ideal ingredient to add to a smoothie. Here’s a sample ad used to launch this campaign:

And of course, the landing page this ad pointed to:

This beautiful landing page converts traffic to purchase at 9.44%

Beyond driving sales, the agency realized there was potential for lead capture here too (as a means of remarketing to especially interested prospects later), so they added an on-exit popup to this page. It offered up a free smoothie recipe book and integrated with a Mailchimp autoresponder.

With an 18% conversion rate, here’s the popup built in Unbounce:

The smoothie campaign helped drop cost-per-purchase down to ~$9.65, and Bill and Liz saw a return on ad spend of 3X from their initial investment after just five months of executing this strategy.

This was great, but Webistry wanted to help Fat Stone Farm stay present in their potential buyer’s world year round. They could lie low waiting for winter again all summer, or they could start developing highly refined retargeting and lookalike audiences to reach all year long.

The Sweepstakes That Raised the Stakes

In May 2017, continuing in the off-season, it was time to start preparing for their next winter. Fat Stone Farm was seeing major benefits from refined Facebook audience targeting, so Jonathan and the team extended this strategy with sweepstakes.

They used weekly sweepstakes as a means to gauge and track prospect’s interest in the products, then later in the winter, they created Facebook lookalike and retargeting audiences to get in front of similar groups of interested people regularly.

As Jonathan shares, this allowed the team to generate even better target audiences:

“Our goal was to create campaigns that helped us measure different levels of interest, and to identify these audiences by tracking every event with a pixel. We had a drip campaign setup, and non-winners of the first sweepstakes were given access to a second sweepstakes.”

That is – those who didn’t win each week were offered access to another sweepstakes prize (either the breakfast pack or gummy pack product). This helped introduce prospects to other Fat Stone Farm products and gauge interest for these versus a complementary offering like smoothies.

Here’s a sample ad for the sweepstakes:

And here’s the first landing page touchpoint:

Click the image above for a closer look.

If you didn’t win, you might be sent a second offer in the sweepstakes, with a chance to win an Elderberry Gummy Kit via the landing page below:

Click the image above to see the full landing page.

Of the people who clicked through on the Facebook ad and reached the first landing page above, 18.79% converted. Moreover, of the people who did not win the first sweepstakes, but clicked through the email announcing the second sweepstakes, 79.55% converted via the landing page.

Hot tip: Webistry embedded a third party tool called ViralSweep on these pages. It’s a sweepstakes application to help manage entries, select a winner at random, and allows people to win bonus entries by referring friends via social.

Not only did this campaign collect over 15,000 relevant leads that Fat Stone Farm could remarket to year long with terrific offers, but it reduced cost-per-lead down to a mere $0.51.

Which brings us to…

Winter Season, 2018

After all the ad testing, landing page alterations, and lessons along the way, Webistry re-launched the sales campaigns using six months of audience-segmented data.

They launched the gummy kits as a standalone product landing page (vs. the sweepstakes page) and continued to sell the Elderberry Apple Shots. The best part? From January to March 2018 Webistry achieved the highest return on ad spend for Bill and Liz since starting to work with them: a whopping 33.12X.

Additionally, this season they saw the lowest cost-per-acquisition of just $1.55.

As Bill Ferrell says of the partnership with Webistry:

“These guys are worth every penny. Excellent results (very high CTRs, good CPA, [and] lots of new customers!). The Webistry co-founders are hands-on, creative, and keep tweaking throughout. Their attentiveness to the campaigns and my crazy ideas have exceeded my expectations month after month.”

Berry good results indeed.

Continue at source – 

See The Landing Pages These Shopify Merchants Used to Scale Ad Revenue 33X

See How Dynamic Text on a Landing Page Helped Increase Conversions by 31.4% [A/B Test Reveal]

a/b testing with ConversionLab

Pictured above: Rolf Inge Holden (Finge), founder of ConversionLab.

Whether your best ideas come to you in the shower, at the gym, or have you bolting awake in the middle of the night, sometimes you want to quickly A/B test to see if a given idea will help you hit your marketing targets.

This want to split test is real for many Unbounce customers, including Norway-based digital agency ConversionLab, who works with client Campaign Monitor.

Typically this agency’s founder, Rolf Inge Holden (Finge), delivers awesome results with high-performing landing pages and popups for major brands. But recently his agency tried an experiment we wanted to share because of the potential it could have for your paid search campaigns, too.

The Test Hypothesis

If you haven’t already heard of San-Francisco based Campaign Monitor, they make it easy to create, send, and optimize email marketing campaigns. Tasked with running especially effective PPC landing pages for the brand, Finge had a hypothesis:

If we match copy on a landing page dynamically with the exact verb used as a keyword in someone’s original search query, we imagine we’ll achieve higher perceived relevance for a visitor and (thereby) a greater chance of conversion.

In other words, the agency wondered whether the precise verb someone uses in their Google search has an effect on how they perceive doing something with a product, and—if they were to see this exact same verb on the landing page— whether this would increase conversions.

In the case of email marketing, for example, if a prospect typed: “design on-brand emails” into Google, ‘design’ is the exact verb they’d see in the headline and CTAs on the resulting landing page (vs. ‘build’ or ‘create’, or another alternative). The agency wanted to carry through the exact verb no matter what the prospect typed into the search bar for relevance, but outside the verb the rest of the headline would stay the same.

The question is, would a dynamic copy swap actually increase conversions?

Setting up a valid test

To run this test properly, ConversionLab had to consider a few table-stakes factors. Namely, the required sample size and duration (to understand if the results they’d achieve were significant).

In terms of sample size, the agency confirmed the brand could get the traffic needed to the landing page variations to ensure a meaningful test. Combined traffic to variant A and B was 1,274 visitors total and—in terms of duration—they would run the variants for a full 77 days for the data to properly cook.

To determine the amount of traffic and duration you need for your own tests to be statistically significant, check out this A/B test duration calculator.

Next, it was time to determine how the experiment would play out on the landing page. To accomplish the dynamic aspect of the idea, the agency used Unbounce’s Dynamic Text Replacement feature on Campaign Monitor’s landing page. DTR helps you swap out the text on your landing page with whatever keyword a prospect actually used in their search.

Below you can see a few samples of what the variants could have looked like once the keywords from search were pulled in (“create” was the default verb if a parameter wasn’t able to be pulled in):

A/B test variation 1
A/B test sample variation

What were the results?

When the test concluded at 77 days (Oct 31, 2017 —Jan 16, 2018), Campaign Monitor saw a 31.4% lift in conversions using the variant in which the verb changed dynamically. In this case, a conversion was a signup for a trial of their software, and the test achieved 100% statistical significance with more than 100 conversions per variant.

The variant that made use of DTR to send prospects through to signup helped lift conversions to trial by 31.4%

What these A/B test results mean

In the case of this campaign, the landing page variations (samples shown above) prompt visitors to click through to a second page where someone starts their trial of Campaign Monitor. The tracked conversion goal in this case (measured outside of Unbounce reporting) was increases to signups on this page after clicking through from the landing page prior.

This experiment ultimately helped Campaign Monitor understand the verb someone uses in search can indeed help increase signups.

The result of this test tell us that when a brand mirrors an initial search query as precisely as possible from ad to landing page, we can infer the visitor understands the page is relevant to their needs and are thereby more primed to click through onto the next phase of the journey and ultimately, convert.

Message match for the win!

Here’s Finge on the impact the test had on the future of their agency’s approach:

“Our hypothesis was that a verb defines HOW you solve a challenge; i.e. do you design an email campaign or do you create it? And if we could meet the visitor’s definition of solving their problem we would have a greater chance of converting a visit to a signup. The uplift was higher than we had anticipated! When you consider that this relevance also improves Quality Score in AdWords due to closer message match, it’s fair to say that we will be using DTR in every possible way forwards.”

Interested in A/B testing your own campaigns?

Whether you work in a SaaS company like Campaign Monitor, or have a product for which there are multiple verbs someone could use to make queries about your business, swapping out copy in your headlines could be an A/B test you want to try for yourself.

Using the same type of hypothesis format we shared above, and the help of the A/B testing calculator (for determining your duration and sample size), you can set up some variants of your landing pages to pair with your ads to see whether you can convert more.

ConversionLab’s test isn’t a catch all or best practice to be applied blindly to your campaigns across the board, but it could inspire you to try out Dynamic Text Replacement on your landing pages to see if carrying through search terms and intent could make a difference for you.

View this article: 

See How Dynamic Text on a Landing Page Helped Increase Conversions by 31.4% [A/B Test Reveal]

Marketing Optimization Week is coming! 4 Free Days of Advice From Experts in PPC, Automation, AI, and Strategy

Starting to feel like you’ve been working in overdrive to (maybe) bring in only half the leads you used to? Not to mention your paid budget seems to be climbing way outta hand?

Well, it’s definitely not just you. Marketing’s changing and it’s getting tougher to see strong results.

Two weeks ago Facebook tweaked it’s publisher settings, fewer advertisers can justify current CPCs in AdWords, and—while there’s a lot of talk about artificial intelligence—how the heck can you make use of it today, exactly?

Fortunately you’re not alone, and we’ve got your back.

Learn new tactics at Marketing Optimization Week


Dedicated to helping you optimize your marketing, we’re hosting four days of FREE, tactical advice you can implement now to guarantee success in the future and get more results from your existing channels.

From February 20-23, you and your team can tune in to learn from major players in the marketing space with four daily sessions covering PPC, marketing automation, AI and marketing strategy tracks.

We don’t kid around with online events, and this is sure to be one of our best yet. Find the full agenda here, or read on for some highlights.

Learn how (and why) to kiss gated content goodbye with Drift’s David Gerhardt

February 22, 2018. Time: 3:00pm PST | 6:00pm EST | 5:00pm CST

David Gerhrdt – Director of Marketing at Drift

Breaking expectations can help your marketing thrive, and nobody knows this better than David Gerhardt – Director of Marketing at Drift. Having spent the last 6+ years working in SaaS companies including HubSpot and Constant Contact, he’ll reveal insight into Drift’s 2016 decision to do away with gated content and rely on conversations instead.

In this session, get a behind-the-scenes look at the impact the decision to remove forms has had on this leading SaaS business, and what it could mean for yours.

Improve Your AdWords Quality Score with Hanapin’s Jeff Baum and Diane Anselmo

February 22, 2018. Time: 9:00am PST | 12:00pm EST | 11:00am CST

Associate Director of Services, Diane AnselmoJeff Baum, Director of Services at Hanapin Marketing

You already know the importance of your quality score, but making significant improvements to it can be a challenge if you’re not sure where to start.

In this absolutely-don’t-miss session, Hanapin PPC experts Jeff Baum and Diane Anselmo walk you through some changes you can make to your landing pages today to positively impact your quality score.

Get clear on how to prep for AI with Microsoft’s Purna Virji

February 21, 2018. Time: 11:00am PST | 2:00pm EST | 1:00pm CST

Microsoft’s Senior Manager of Global Engagement, Purna Virji

At best, you know AI is already all around us, and at worst you think of it as something to fear. Hear from Microsoft’s Senior Manager of Global Engagement on how AI is going to shake up the industry (for the better) and how you can be ready.

Bringing over 15 years in search experience to the table, Purna’s an expert in SEO, everything Bing, and voice search. You’ll walk away with three critical steps you can take today to set yourself up for AI success.

Secure 10X Results Across Channels with Larry Kim of Mobile Monkey

February 23, 2018. Time: 9:00am PST | 12:00pm EST | 11:00am CST

founder of Mobile Monkey, Larry Kim

Self-professed unicorn obsessor Larry Kim is ready to show us all the magic of a unicorn campaign (campaigns so effective they perform in the top 1–3%).

In this session, learn the WordStream founder’s unusual tips and processes for getting 10-100x more value from paid ad campaigns on Facebook, Twitter, Taboola and other networks, including how to drive exponentially more traffic to your content and convert more of those clicks into sales.

There’s something for everyone on your team

Above are just four of the sessions you can look forward to – there are four days(!) of carefully curated content to enjoy. Registration gets you access to:

  • The Google Ventures Sprint process via your host, Unbounce’s own Alexa Hubley
  • How to have your best year of email ever by Karen Gragg of Emma
  • How to get more out of your marketing tools via integrations by Sean Kennedy of Zapier
  • And much, much more.

Bonus: There’ll be a massive giveaway

During MOW we’re giving away the Ultimate Marketing Optimization kit. The package retails at over $4,000 and includes 2 tickets to Unbounce’s Call to Action Conference in August, a free year of Unbounce Premium, tons of swag, a printed copy of the Conversion Benchmark Report and more.

Here’s how you can gain more entries:

  1. Hop on over to the Unbounce Landing Page Analyzer and get a comprehensive analysis of your landing page based on nine specific performance categories.
  2. Scroll down to the bottom of your customized report and share on Twitter. Make sure to include the #marketingoptweek hashtag.

Best of luck, and we’ll see you February 20th to kick things off.

This article is from:

Marketing Optimization Week is coming! 4 Free Days of Advice From Experts in PPC, Automation, AI, and Strategy

9 Creative Sticky Bar Examples – Plus 21 New Unbounce Templates

alt : https://unbounce.com/photos/sticky-bar-condoms.mp4https://unbounce.com/photos/sticky-bar-condoms.mp4

Sticky Bars are the less intrusive cousin of the noble Popup. They appear at the top or bottom of the page (and sometimes the sides) when a visitor arrives, leaves, scrolls down or up, stays on the page for a certain time period or clicks a link or button. They have a million useful use cases, some of which you may not have considered.

In today’s Product Awareness Month post, I’ll be sharing:

  • 9 Sticky Bar Examples From Out in the Wild: These are examples the team has found on other folks websites, and a couple of our own.
  • 21 New Unbounce Sticky Bar Templates: Check out our latest designs that you can use today.

To get things started, here’s an example that I’ll talk about later in the new templates section. Click to show a Sticky Bar with a countdown timer.

I’d love to see your Sticky Bars too, so drop me a link in the comments, please.

9 Creative Sticky Bar Examples to Inspire Your Next Campaign

Discounts and newsletter subscriptions are valid, common and effective use cases, but I want to explore different types of interaction design, or campaign concepts that can compliment what you’re already using them for.

#1 Maybe Later

If you’ve been following along with Product Awareness Month (PAM), you’ll have seen the “Maybe Later” concept. This is where an entrance popup morphs into a persistent Sticky Bar when your visitors click the middle “Maybe Later” button instead of yes or no.

You can see a live demo of how it works here. A popup will appear when you arrive. Click “Maybe Later”, then refresh the page and a Sticky Bar will appear, and can be configured to show up site-wide until you convert or say “No Thanks”.


#2 Sticky Bar to Popup

This concept is the exact opposite of “Maybe Later”, and it uses a concept known as a two-step opt-in. Instead of showing a form on the Sticky Bar, it just shows a button to express interest.

Click-Through Sticky Bar

When you click the Sticky Bar CTA it launches a popup to collect the email address. This two-stage concept can increase conversions because the first click establishes intent and a level of commitment to continue – while not showing a scary form right away. I’ll be discussing the two-step opt-in in a future post.

Lead Gen Popup


#3 Sticky Video Widget

You’ve seen these on many blogs I’m sure. It’s really cool functionality for increasing engagement in your videos. You can see a demo here. And instructions on how to implement it can be found in the Unbounce community here.


#4 E-commerce Product Reminder

This example is really cool. As you scroll down a product page on an e-commerce site, an “Add to Cart” Sticky Bar appears when you scroll past the main hero image.


#5 E-commerce Checkout Discount Nudge

This Sticky Bar sticks with you for every step in the photo creation and checkout process. Clearly, they are comfortable with the coupon being applied to the sale because it’s an incredibly competitive business niche and let’s face it when you see a coupon code field you go searching for one. So why not just offer it straight up.

For the record, trying to buy canvas prints to deliver to family in the UK is a freakin’ nightmare. I had to try 8 different sites before one of them would allow me to put a Canadian address in the billing info fields. They are losing a TON of money by not realizing that customers can be in other places.


#6 On-Click Side Slide

On-click Sticky Bars and Popups are the best kind when it comes to a permission-based interaction. You make something interesting and ask people to click on it. In this example, there is an element on the left side of the page which slides in from the side when clicked.

Unbouncer Noah Matsell created a similar thing in Unbounce (see demo here). It doesn’t actually use a Sticky Bar. Instead it’s just a box with text in it. I love how it works. Try it out, and think about all the cool stuff you could stick in a sidebar.


#7 EU Cookie Policy

European Union laws around privacy are some of the toughest in the world, and for the last few years, the EU Cookie Privacy Law required that all EU businesses, as well as international businesses serving EU customers, show a privacy statement with a clickable acknowledgment interaction. I’m not a lawyer so I don’t know all the ins and outs, but needless to say, it’s a great use case that you may not even know that your web team or legal team actually needs.

Coming up in May is the new GDPR legislation which will usurp this law, but offer its own needs and requirements, so stay tuned for more on that, and how you should be dealing with it. In fact, I did a quick poll on Twitter to see what people thought about the cookie law and got an interesting mix of responses. Don’t be in the “Haven’t dealt with it yet” camp when it comes to GDPR. That could get you dinged.

We released a new Cookie Bar template below that you can use until you deal with the new legislation.

#8 Microsite Navigation

Another example from earlier in Product Awareness Month. You can use a Sticky Bar as the connective global navigation that turns a group of landing pages into a microsite.

A really simple way to create a multi-page marketing campaign experience.

#9 Net Promoter Score (NPS)

Net Promoter Score surveys are a method of measuring how your customers feel about your product or service. Based on a scale from 0-10 and the question “How likely are you to recommend company name to a friend?”

Co-founder Carter Gilchrist made this NPS demo to show how it works:


Follow our Product Awareness Month journey >> click here to launch a popup with a subscribe form (it uses our on-click trigger feature).


21 New Unbounce Sticky Bar Templates You Can Use Today

We just released a whole bunch of new Sticky Bar and Popup templates which you can see inside the Unbounce app screenshot below. I chose a few of them to showcase below based on some of the examples I discussed above.


Sticky Bar Template #1: Countdown Timer

Countdown timers are great for creating a sense of urgency, and can have a positive influence on conversions as a result.


Click to show this Sticky Bar at the bottom | at the top.


Sticky Bar Template #2: Location Redirect

If you have multiple websites or online stores, you can use Location Targeting (Unbounce supports city, region, country, and continent) to let people know there is a local version they might want to switch to.


Sticky Bar Template #3: Product Release

Announce product releases on your website to drive people to the features page of the new product.


Sticky Bar Template #4: Cookie Privacy Law

As I mentioned earlier, this is big for companies in Europe, and also businesses who have European customers. On May 25, 2018 this law will be usurped by the new General Data Protection Regulation (GDPR).


Sticky Bar Template #5: Product Beta Access

Build an email list for an upcoming beta release.


Sticky Bar Template #6: Product Hunt Launch

Product Hunt can be a great place to launch new products. To be successful you need to get upvotes and you can use a Sticky Bar to send people there from your website.

Check Out Our Sticky Bar Live Demo

We built a cool tool that shows what Sticky Bars and Popups look like on your site. Simply enter your URL here to preview. It even grabs your brand colors and in this case, Amanda from Orbit Media makes a cameo appearance.

Cheers
Oli Gardner

p.s. You should check out The Landing Page Analyzer. Why? Because – hyperbole alert – it’s the single greatest tool in the history of the world when it comes to grading your landing pages.

Jump to original:  

9 Creative Sticky Bar Examples – Plus 21 New Unbounce Templates

A Blueprint for the Perfect Popup: Structured Design for Unstructured Marketers

Is it possible to design the perfect popup? One so fiercely potent that people just can’t refuse to convert?

Of course not.

As small as seemingly simple as a popup is, it’s still important to understand a little about its anatomy. There are five primary elements to make up the architecture of a popup, and then there’s a layer of interaction design beneath that which deals with the functional aspects such as triggers and targeting.

The five primary elements of a popup blueprint are:

  1. Headline and subhead
  2. Offer details
  3. Hero images
  4. Trust and social proof
  5. Call to Action

Using a structural approach to your popup designs helps us avoid mistakes and choose the right interaction modes and content elements that will create a good conversion experience.

Obviously, you can’t use every version of every element on a single small popup, but you can choose the best parts of each anatomical section to craft something that presents your offer in the best possible way.

An important thing to know is that the circled icons beneath each section represent Unbounce functionality that allows you to make your popups way more awesome than they would be if you simply showed it to everyone.

Got any weird and wonderful popup designs?

If you have designs that include elements I didn’t include in the blueprint, share them in the comments so I can add them to my layout specs.

Popups that don’t suck, rule! Make better popups, please.

Cheers,
Oli

p.s. See what Unbounce Popups look like on your website with the new Live Preview Tool. It’s really cool.

p.p.s. Don’t forget to subscribe to the weekly updates for the rest of Product Awareness Month. If you click that link a popup will appear!

Read more:

A Blueprint for the Perfect Popup: Structured Design for Unstructured Marketers

“Maybe Later” – A New Interaction Model for Ecommerce Entrance Popups

I’d guess that over half of the e-commerce stores I visit use entrance popups to advertise their current deal. Most often it’s a discount.

What is an Entrance Popup and What’s Wrong With Them?

They are as they sound. A popup that appears as soon as you arrive on the site. They’re definitely the most interruptive of all popups because you’ve not even had a chance to look around.

I get why they are used though because they work really well at one thing – letting you know that an offer exists, and what it is. And given high levels of competition for online dollars, it makes sense why they would be so prolific.

The intrusion isn’t the only point of frustration. There’s also the scenario where you arrive on a site, see an offer appear, you find it interesting and potentially very valuable (who doesn’t want 50% off?), but you want to do some actual looking around – the shopping part – before thinking about the offer. And when you’re forced to close the popup in order to continue, it’s frustrating because you want the offer! You just don’t want it right now.

So, given the fact that they are so common, and they’re not going anywhere anytime soon, and they create these points of frustration, I’ve been working on developing a few alternative ways to solve the same problem.

The one I want to share with you today is called “Maybe Later”.

“Maybe Later” is a Solution to Increase Engagement and Reduce Frustration

As you saw in the header image, instead of the now classic YES/NO popup – the one that gets abused by shady marketers (Technology isn’t the Problem, We Are.) – “Maybe Later” includes a third option called, you guessed it!

The middle option gives some control back to the shopper.

It’s more than just a third button, here’s how it works (I’ll refer to the sketch opposite):

  1. The popup appears when you enter the site. You can choose “No” to get rid of it, “Yes” to take advantage of it, or “Maybe Later” to register your interest but get it out of your way.
  2. When you click “Maybe Later” a cookie is set to log your interest.
  3. Now while you are browsing the rest of the site, a Sticky Bar – targeted at the cookie that was set – appears at the bottom (or top) of the page, with a more subtle reminder of the offer, so that you know it there and ready if you decide to take advantage of it.
  4. If you decide against the offer, you can click “No thanks” on the Sticky Bar, the cookie is deleted, and the offer is hidden for good.

The core purpose of this idea is to put the control back with the shopper while creating an effective method for the retailer to engage with you, with your permission.


Follow our Product Awareness Month journey >> click here to launch a popup with a subscribe form (it uses our on-click trigger feature).


Visual Hierarchy on Popup Buttons

When you have more than a single button, it’s important to establish visual design cues to indicate how the hierarchical dominance plays out. For you as a marketer, the most important of the three buttons is YES, MAYBE LATER is second, and NO is the least.

You can create a better user experience for your visitors by using the correct visual hierarchy and affordance when it comes to button design. In the image below, there is a progression of visual dominance from left to right (which is the correct direction – in Western society). Left is considered a backward step (in online interaction design terms), and right is a progression to the goal.

From left to right we see:

  • The NO button: is designed as a ghost button which has the least affordance and weight of the three.
  • The MAYBE LATER button: gains some solidity by increasing the opacity
  • The YES button: has a fully opaque design represented by the primary call to action colour of the theme.

You can achieve a similar level of dominance by making the secondary action a link instead of a button, which is a great visual hierarchy design technique. What I don’t like is when people do this, but they make the “No thanks” link really tiny. If you’re going to provide an option, do it with a little dignity and make it easy to see and click.

See the “Maybe Later” Popup-to-Sticky-Bar Model in Action

Alrighty, demo time! I have a few instructions for you to follow to see it in action. I didn’t load the popup on this page as it’s supposed to be an entrance popup and I needed to set the scene first. But I’ll use some trickery to make it happen for you.

Follow these instructions and you’ll see “Maybe Later” in action:

Please note: this is desktop only. Reason being is that Google dislikes entrance popups on mobile. Sticky Bars are the Google-friendly way to present promos on mobile, so they work, but the combo isn’t appropriate.

  1. Visit this page (opens in new window).
  2. Click the “Maybe Later” button and the popup will close.
  3. Refresh that page and you’ll see a Sticky Bar with the same offer appear at the bottom.
  4. Come back to this page.
  5. Refresh this page and you’ll see the Sticky Bar here too.
  6. Click “No thanks” to get rid of it when you’ve had enough :D

Here’s the entrance Popup you will see:

Maybe Later - A New  interaction model for ecommerce entrance popups

And the Sticky Bar you will see following that:

How to Use “Maybe Later” on Your Website

If you’d like to give it a try, follow the instructions below in your Unbounce account. (You should sign up for Unbounce if you haven’t already: you get Landing Pages, Popups, and Sticky Bars all in the same builder).

You can also see what Popups and Sticky Bars look like on your website by entering your URL on our new Live Preview Tool.

“Maybe Later” Setup Instructions

Caveat: This is not an official Unbounce feature, and as such is not technically supported. But it is damn cool. And if enough people scream really hard, maybe I’ll be able to persuade the product team to add it to the list. And please talk to a developer before trying this in a production environment.

Step 1: Create a Popup in Unbounce

Step 2: Add “Maybe Later” Script to the Popup

In the “Javascripts” window located in the bottom-left.

Add the following script “Before the body end tag”, replacing “lp-pom-button-50” with the id of your “Maybe Later” button, and unbounce.com with your own domain.

document.getElementById("lp-pom-button-50").onclick = function() 
parent.postMessage(JSON.stringify('later'), 'https://unbounce.com');

Step 3: Set URL Targeting on Popup

Set up the URL targeting for where you want the popup to appear. I chose the post you’re reading right now (with a ?demo extension so it would only fire when I sent you to that URL).

Step 4: Set Cookie Targeting on Popup

Set up the cookie targeting to “Not show” when the “Maybe Later” cookie is present. The cookie is set when the button is clicked. (You’ll see how in step 9).

Step 5: Create a Sticky Bar in Unbounce

Step 6: Add “Maybe Later” Script to the Sticky Bar

Add the following script “Before the body end tag”, replacing “lp-pom-button-45” with the id of your “No Thanks” button, and unbounce.com with your own domain.

document.getElementById("lp-pom-button-45").onclick = function() 
parent.postMessage(JSON.stringify('laterForget'), 'https://unbounce.com');

Step 7: Set URL Targeting on Sticky Bar

Set up the URL targeting for where you want the Sticky Bar to appear. This might be every page on your e-commerce site, or in my case just this post and another for testing.

Step 8: Set Cookie Targeting on Sticky Bar

Set the Trigger to “Arrival”, Frequency to “Every Visit”, and Cookie Targeting to show when the cookie we’re using is set. (You’ll see how it’s set in the next step).

Step 9: Add “Maybe Later” Code to Your Website

This is some code that allows the Popup and Sticky Bar to “talk” to its host page and set/delete the cookie.

// On receiving message from the popup set a cookie
window.onload = function() 
function receiveMessage(e) 
var eventData = JSON.parse(e.data);
// Check for the later message
if (eventData === 'later') 
document.cookie = "mlshowSticky=true; expires=Thu, 11 May 2019 12:00:00 UTC; path=/";

if (eventData === 'laterForget') 
document.cookie = "mlshowSticky=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

}
// Listen for the message from the host page
window.addEventListener('message', receiveMessage);
}

Step 10: Enjoy Being Awesome

That’s all, folks!


What Do You Think?

I’d love to know what you think about this idea in the comments, so please jump in with your thoughts and ideas.

Later (maybe),
Oli

p.s. Don’t forget to see what Popups and Sticky Bars look like on your website with the new Live Preview Tool

View original: 

“Maybe Later” – A New Interaction Model for Ecommerce Entrance Popups

Technology isn’t the Problem, We Are: 5 Horrific Website Popup Examples

It’s Day 5 of Product Marketing Month. Today I get to bash some really bad popup examples. Yuss! — Unbounce co-founder Oli Gardner

But before I bring the heat, I want to talk a bit about what it’s like, as a product marketer, to be marketing something that’s difficult to market.

You see, there’s a common problem that many marketers face, and it’s also one of the most asked questions I hear when I’m on the road, as a speaker:

“How do I great marketing for a boring product or service?”

That’s a tough challenge for sure, although the good news is that if you can inject some originality you’ll be a clear winner, as all of your competitors are also boring. However, I think I can one-up that problem:

“How do I do great marketing for something that’s universally hated, like popups?”

We knew we had a big challenge ahead of us when we decided to release the popups product because of the long legacy of manipulative abuse it carries with it.

In fact, as the discussion about product direction began in the office, there were some visceral (negative) reactions from some folks on the engineering team. They feared that we were switching over to the dark side.

It makes sense to me that this sentiment would come from developers. In my experience, really good software developers have one thing in common. They want to make a difference in the world. Developers are makers by design, and part of building something is wanting it to have a positive impact on those who use it.

To quell those types of fears requires a few things;

  • Education about the positive use cases for the technology,
  • Evidence in the form of good popup examples, showcasing how to use them in a delightful and responsible manner,
  • Features such as advanced triggers & targeting to empower marketers to deliver greater relevance to visitors,
  • And most important of all – it requires us to take a stance. We can’t change the past unless we lead by example.

It’s been my goal since we started down this path, to make it clear that we are drawing a line in the sand between the negative past, and a positive future.

Which is why we initially launched with the name “Overlays” instead of popups.

Overlays vs. Popups – The End of an Era

It made a lot of sense at the time, from a branding perspective. Through podcast interviews and public speaking gigs, I was trying to change the narrative around popups. Whenever I was talking about a bad experience, I would call it a popup. When it was a positive (and additive) experience, I’d call it an overlay. It was a really good way to create a clear separation.

I even started to notice more and more people calling them overlays. Progress.

Unfortunately, it would still require a lot of continued education to make a dent in the global perception of the terminology, that with the search volume for “overlays” being tiny compared to popups, factored heavily into our decision to pivot back to calling a popup a popup.

Positioning is part of a product marketer’s job – our VP of Product Marketing, Ryan Engley recently completed our most recent positioning document for the new products. Just as the umbrella term “Convertables” we had been using to include popups and sticky bars had created confusion, “Overlays” was again making the job harder than it should have been. You can tell, just from reading this paragraph alone that it’s a complex problem, and we’re moving in the right direction by re-simplifying.

The biggest challenge developing our positioning was the number of important strategic questions that we needed to answer first. The market problems we solve, for who, how our product fits today with our vision for the future, who we see ourselves competing with, whether we position ourselves as a comprehensive platform that solves a unique problem, or whether we go to market with individual products and tools etc. It’s a beast of an undertaking.

My biggest lightbulb moment was working with April Dunford who pushed me to get away from competing tool-to-tool with other products. She said in order to win that way, you’d have to be market leading in every tool, and that won’t happen. So what’s the unique value that only you offer and why is it important?

— Ryan Engley, VP Product Marketing at Unbounce

You can read more about our initial product adoption woes, and how our naming conventions hurt us, in the first post in the series – Product Marketing Month: Why I’m Writing 30 Blog Posts in 30 Days.

Let’s get back to the subject of popups. I think it’s important to look back at the history of this device to better understand how they came about, and why they have always caused such a stir.

Browser Interaction Models & the History of the Popup

The talk I was doing much of last year was called Data-Driven Design. As part of the talk, I get into interaction design trends. I’ve included the “Trendline” slide below.

You can see that the first occurrence of a popup was back in 1998. Also, note that I included Overlays in late 2016 when we first started that discussion.

Like many bad trends, popups began as web developers started trying to hack browser behavior to create different interruptive interaction modes. I know I made a lot of them back in the day, but I was always doing it to try to create a cool experience. For example, I was building a company Intranet and wanted to open up content in a new window, resize it, and stick it to the side of the screen as a sidebar navigation for the main window. That was all good stuff.

Tabbed browsers have done a lot to help clean up the mess of multiple windows, and if you couple that with popup blockers, there’s a clear evolution in how this type of behavior is being dealt with.

Then came the pop-under, often connected to Malware virus schemes where malicious scripts could be running in the background and you wouldn’t even know.

And then the always fun “Are you sure you want to do that?” Inception-like looping exit dialogs.

Developers/hackers took the simple Javascript modal “Ok” “Cancel” and abused it to the point where there was no real way out of the page. If you tried to leave the page one modal would lead to another, and another, and you couldn’t actually close the browser window/tab unless you could do it within the split second between one dialog closing and the next opening. It was awful.

So we have a legacy of abuse that’s killed the perception of popups.

What if Popups Had Been Built Into Browsers?

Imagine for a moment that a popup was simply one of many available interaction models available in the browsing experience. They could have had a specification from the W3C, with a set of acceptable criteria for display modes. It would be an entirely different experience. Sure, there would still be abuse, but it’s an interesting thought.

This is why it’s important that we (Unbounce and other like-minded marketers and Martech software providers) take a stance, and build the right functionality into this type of tool so that it can be used responsibly.

Furthermore, we need to keep the dialog going, to educate the current and future generations of marketers that to be original, be delightful, be a business that represents themselves as professionals, means taking responsibility for our actions and doing everything we can to take the high road in our marketing.

Alright, before I get to the really bad website popup examples, I’ll leave you with this thought:

Technology is NOT the problem, We Are.

It’s the disrespectful and irresponsible marketers who use manipulative pop-psychology tactics for the sake of a few more leads, who are the problem. We need to stop blaming popups for bad experiences, and instead, call out the malicious marketers who are ruining it for those trying to do good work.

It’s a tough challenge to reverse years of negative perception, but that’s okay. It’s okay because we know the value the product brings to our customers, how much extra success they’re having, and because we’ve built a solution that can be configured in precise ways that make it simple to use in a responsible manner (if you’re a good person).


Follow our Product Marketing Month journey >> click here to launch a popup with a subscribe form (it uses our on-click trigger feature).


5 Really Bad Website Popup Examples

What does a bad popup actually look like? Well, it depends on your judging criteria, and for the examples below, I was considering these seven things, among others:

  1. Clarity: Is it easy to figure out the offer really quickly?
  2. Relevance: Is it related to the content of the current page?
  3. Manipulation: Does it use psychological trickery in the copy?
  4. Design: Is it butt ugly?
  5. Control: Is it clear what all options will do?
  6. Escape: Can you get rid of it easily?
  7. Value: Is the reward worth more than the perceived (or actual) effort?

#1 – Mashable Shmashable

What’s so bad about it?

If you peer into the background behind the popup, you’ll see a news story headline that begins with “Nightmare Alert”. I think that’s a pretty accurate description of what’s happening here.

  • Design: Bad. The first thing I saw looks like a big mistake. The Green line with the button hanging off the bottom looks like the designer fell asleep with their head on the mouse.
  • Clarity: Bad. And what on earth does the headline mean? click.click.click. Upon deeper exploration, it’s the name of the newsletter, but that’s not apparent at all on first load.
  • Clarity: worse. Then we get the classic “Clear vs. Clever” headline treatment. Why are you talking about the pronunciation of the word “Gif”? Tell me what this is, and why I should care to give you my email.
  • Design: Bad. Also, that background is gnarly.

#2 – KAM Motorsports Revolution!

What’s so bad about it?

It’s motorsports. It’s not a revolution. Unless they’re talking about wheels going round in circles.

  • Clarity: Bad. The headline doesn’t say what it is, or what I’ll get by subscribing. I have to read the fine print to figure that out.
  • Copy: Bad. Just reading the phrase “abuse your email” is a big turn off. Just like the word spam, I wasn’t thinking that you were going to abuse me, but now it’s on my mind.
  • Relevance: Bad. Newsletter subscription popups are great, they have a strong sense of utility and can give people exactly what they want. But I don’t like them as entry popups. They’re much better when they use an exit trigger, or a scroll trigger. Using a “Scroll Up” trigger is smart because it means they’ve read some of your content, and they are scrolling back up vs. leaving directly, which is another micro-signal that they are interested.

#3 – Utterly Confused


(Source unknown – I found it on confirmshaming.tumblr.com)

What’s so bad about it?

I have no earthly clue what’s going on here.

  • Clarity: Bad. I had to re-read it five times before I figured out what was going on.
  • Control: Bad. After reading it, I didn’t know whether I would be agreeing with what they’re going to give me, or with the statement. It’s like an affirmation or something. But I have no way of knowing what will happen if I click either button. My best guess after spending this much time writing about it is that it’s a poll. But a really meaningless one if it is. Click here to find out how many people agreed with “doing better”…
  • It ends with “Do Better”. I agree. They need to do a lot better.

#4 – Purple Nurple

What’s so bad about it?

  • Manipulation: Bad. Our first “Confirm Shaming” example. Otherwise known as “Good Cop / Bad Cop”. Forcing people to click a button that says “Detest” on it is so incongruent with the concept of a mattress company that I think they’re just being cheap. There’s no need to speak to people that way.
  • I found a second popup example by Purple (below), and have to give them credit. The copy on this one is significantly more persuasive. Get this. If you look at the section I circled (in purple), it says that if you subscribe, they’ll keep you up to date with SHIPPING TIMES!!! Seriously? If you’re going to email me and say “Hey Oli, great news! We can ship you a mattress in 2 weeks!”, I’ll go to Leesa, or Endy, or one of a million other Casper copycats.


#5 – Hello BC

What’s so bad about it?

Context: This is an entry popup, and I have never been to this site before.

  • Relevance: Bad. The site is Hellobc.com, the title says “Supernatural British Columbia”, and the content on the page is about skydiving. So what list is this for? And nobody wants to be on a “list”, stop saying “list”. It’s like saying email blast. Blast your list. If you read the first sentence it gets even more confusing, as you’ll be receiving updates from Destination BC. That’s 4 different concepts at play here.
  • Design: Bad. It’s legitimately butt ugly. I mean, come on. This is for Beautiful Supernatural British Columbia ffs. It’s stunning here. Show some scenery to entice me in.
  • Value: Bad. Seeing that form when I arrive on the page is like a giant eff you. Why do they think it’s okay to ask for that much info, with that much text.
  • Control: Bad. And there’s not any error handling. However, the submit button remains inactive until you magically click the right amount of options to trigger it’s hungry hungry hippo mouth to open.

Trainwreck.


Well, that’s all for today, folks. You might be wondering why there were so few popup examples in this post, keep reading and I’ll explain why.

Coming Up Tomorrow – Good Popups, YAY!!!

One of the most interesting things I’ve noticed of late is that there is a shift in quality happening in the popup world. When the team rallied to find the bad popup examples above, we found at least 10x as many good ones as bad. That’s something to feel pretty good about. Perhaps the positive energy we’re helping to spread is having an impact.

So get your butt back here tomorrow to see 20+ delightful website popup examples. More importantly, I’ll also be sharing “The Delight Equation”, my latest formula for measuring quantifying how good your popups really are.

See you then!

Cheers
Oli

p.s. Don’t forget to subscribe to the weekly updates.

Excerpt from: 

Technology isn’t the Problem, We Are: 5 Horrific Website Popup Examples

Just another WordPress site