Best Practices For Website Conversion — Review

I don’t know about you, but I love to learn the newest info when it comes to media and design. I also love when I don’t have to seek out what the latest trends are, but I can have them all at my fingertips, compiled into one place. Oh, and did I mention I really love when the learning content is easy to digest? I really love that.

With this week’s course content I’m taking on CXL Institute (check out their website here: https://cxl.com), I have been able to absorb SO much content regarding web design and how you construct your site to increase conversion. There’s a lot I want to share with you, so let’s not waste any time and jump right in!

A big aspect of what I read involved webforms.

Something to keep in mind is: There are no absolute truths.

“Blindly copying and implementing “best practices” is stupid — nothing scientific about it. You’re essentially using somebody else’s solution to their problems for your problems.”

Wow. That’s a good truth-slap in the face. No solution is the only solution in the digital realm. We can certainly utilize other’s design practices as one part of our hypotheses, a way to get initial data on what works and what does not. Just don’t forget that relying solely on another’s outcome, will vary due to location, audience, product, and more.

You know those forms that you find that are long or require a bunch of info before you can move on? We don’t want to use those. Remember:

• No one likes to fill out website forms. Since they’re very closely tied to conversion, we do want to use them… but tastefully!
• Higher completion rates = higher profit

“As designers and optimizers, it’s our responsibility to embrace the power of forms, to optimize them, and ultimately to get higher conversions out of them.”

• This is a great mindset to have, because if we look at these forms as a source of revenue, rather than something to dread, we can actually utilize them to their fullest

I enjoyed the comparison of the stranger-conversion-questions that the CXL writer chose… If we were to get asked the questions that are commonly found on these website forms in person by a stranger, we would likely be skeptical or even fearful of supplying our personal information. The same can be said if we approach our site forms in the same manner. Until we have created valuable reasons for viewers to engage, or built some semblance of trust with them, we have no reason to expect their confidence in us as a brand.

We want to reduce the friction that might be caused by asking questions that could potentially make a user uneasy. You can get quality leads if you have a quality form. Here are some amazing tips to making it happen:

1. Set clear expectations

• Be transparent up-front about what’s going to happen
• How much time it takes, personal details, payment info > we want to eliminate any chances of negative surprise
• Negative surprise = huge drop-offs
• Is there a benefit to draw them in? “Get special access to X”

2. Minimize the number of form fields

• Less work = less friction
• Don’t expect too much from a customer
• Only ask for the info you absolutely need
• Identify anything that might be misinterpreted
• A study found that 7 was the optimum number of form fields

3. Increase friction to improve lead quality

• 3 things longer forms do:
• Higher quality leads
• Unqualified people will go away
• More info = better lead scoring

4. Multi-step forms

• Reduce the perception of friction
• Longer forms, make it a 2-step

5. Start with easier fields

• Name & email first. They gain momentum and can move to the “harder” ones
• Use regular over bold text
• Use drop down when you have more than 5 choices > less than, just use the click-to-fill-in button
• Pre-select what you can
• Typing in zip code and then having the state fill in, etc.

6. Feedback & error validation

• Use Google Analytics (via event tracking) to see recorded error messages displayed on site
• When user sees error messages that weren’t made clear beforehand, they’re likely to drop off
• Inline validation gives real-time feedback
• Can confirm an appropriate answer, suggest valid answers, and provide regular updates to help people stay within necessary limits
• Can be presented before or after answers are provided
• Immediately validate the answer after entered > tell them how to correctly enter their info as specifically as possible.
• If you want a specific entry for a phone number, that should be done on the backend with code. Let them enter their phone number however they want (with or w/o dashes)

7. Avoid captchas

• Can deter bots, but potentially humans as well
• Use something like honeypot instead
• Only make human verification code pop up if there is some sign of abuse on the form (multiple submissions from the same IP in the same day, blacklisted IP, keyword submissions)

8. Address fears (Identify FUDs)

• Fears, uncertainties, doubts > address them one way or another to reduce friction
• Don’t over-emphasise security protection or it can sound sketchy. Find the balance

9. Form analytics

• Which form field is causing the most friction?
• 3 ways to assess:

1. User testing & pay attention to field that takes most time
2. Watching user session replay videos (Hotjar or Clicktale)
3. Using form analytics that gives quantifiable data

Tools that do form analytics: Zuko (dedicated to forms) built into VWO/Hotjar/Clicktale

ECOMMERCE CATEGORY PAGES

What is the most powerful instrument when designing a good category page? Understanding the role it plays to help people find something they want, like, or need. Sounds simple, but it’s a bit more complex than I originally thought.

Lucky for us, CXL breaks it down into several steps:

• narrow down their choices based on preferences/key criteria,
• sort products in a way that makes sense for them and makes the search journey easier,
• understand whether a product in the list is the right one for them, and
• focus the page on finding the right product.

When we evaluate category pages, we analyze how these four key roles have been met, and what can we do to improve the page

Narrow Down Choice

Sometimes too many choices can backfire. When we have a plethora of options, we can become overwhelmed, and even wind up choosing nothing, despite all the amazing options at our fingertips. When it comes to an ecommerce site, there is an art to creating simple to use, enjoyable pages, regardless of how many items are available. Utilizing tools that can filter out options the user is not seeking will assist them in locating desired products much quicker, and give the illusion of a simplistic site.

As a frequent online shopper myself, this makes perfect sense. I can log onto my favorite clothing store site and see 20+ pages of items to look through, and instantly feel a “sigh” slip through my lips. While I thoroughly enjoy fashion, when I am after one particular item, I like to see if it’s there before I continue scrolling. The option to narrow down choices as the user sees fit is essential in conversion, otherwise, they are likely to drop right off the page.

A great suggestion is to pause and identify the criteria involved in decision-making for the products on the category page. Think about the items you are marketing and determine how they can be categorized. Clothing items can be filtered by color, size, price, length, and much more. How can your products be quickly specified and ultimately lead to a transaction?

I found the tips for how to layout your website to be practical as well. The traditional placement for the filter guide is a menu on the left-hand side of the page. CXL recommends sticking with the left-hand filters, unless there is an occasion where a top filter might be more fitting. They suggest this could be the case if you have fewer options that can fit horizontally, or your main goal is featuring the products and minimizing distractions.

Have you ever heard of product badges? These are great for higher margins, to help certain products stand out. If a customer is unsure of what they want, a stand out item might be able to sway them. A “staff pick,” or “best seller” might be the make it or break it moment for the individual who is unsure of what the best pick is. Throwing up a “New!” badge can also bring attention, but CXL says to focus on the pictures to catch a user’s eye.

Another thing to note is that badges are most effective when they are used sparingly. Having every item smacked with a badge will become cluttered and lose the novelty. The overarching goal is to highlight specific items (perhaps on sale or limited supply) that brings users a sense of urgency to purchase.

Sort Products

How do we make the most out of the space we have to feature our products? We make clear and concise paths that make sense to the user. Provide shoppers with options that enable them to obtain the results they are after with minimal effort. We want the listings of our products to add value to potential customers. Listing your items in “sort by best selling” will be more beneficial than listing them by the date they were added or by the ID. Figuring out what will be the best organization for your target audience will optimize your conversion rate.

How Do I Know?

Looking for the product that will work best for whatever it is that the consumer needs can be tricky online. While they will never truly know if it exactly fits their needs until it arrives, we can eliminate some doubt by adding photos or video to each item.

While most ecommerce pages have plenty of side by side photos, small in dimensions, larger photos have a powerful effect. Despite large photos taking up space, having a combination of both smaller and larger pictures will emphasize your products page. Studies show that having alternate photos (different angles, perhaps being worn or in a new location) can increase sales by 25%. Users want to see what this item could look like in various situations.

While we do want there to be a transaction at the end of the viewer’s visit, having a call to action button that is too direct can scare potential customers away. Call the user to learn more about the product with a “see details” button, rather than a BUY NOW. Lead them to more, and allow them to continue browsing.

In conclusion, optimizing category pages should be thought of as a structured approach to determining how the page can help users. First, we want to narrow down the choices based on their key criteria. Next, sort the products in a sensible manner. Make it simple to find their desired item. Then, we have to understand if the item listed is the best option for them. Finally, we focus our page on discovering the best product for our guests.

Buttons & Call To Actions

Whether or not a customer advances on to the next action depends on key factors…

For starters, do they even notice the CTA (Call to action) in the first place?

• Have one primary CTA
• Each page should have a defined, most wanted action
• Make the first primary goal stand out, and make secondary call less eye-catching in comparison
• Buttons are better than clickable links
• They’re more noticeable
• Creates better customer experience
• Make them big enough to pop
• Darker buttons get 135% higher click throughs and 51% higher earnings per click
• Use the right amount of white space to surround buttons
• Even if your buttons aren’t huge, be sure to have the right colors and enough white space surrounding them
• Use a button color that is different than your website
• Don’t let your CTA blend in
• Choose the right wording
• Selecting text for the button is crucial. It’s going to be something you have to test overtime, so keep that in mind what works best
• A formula to follow is to have your CTA finish the sentence: “I want to…”
• Keep in mind when writing your CTA

1. It’s specific. > Make it clear by saying: Add to Cart, Get a Quote, Start Free Trial, etc.
2. It conveys a benefit for the consumer. > Make sure the button reflects the value that will follow. This could be written such as: Get Conversion Tips, Get The Look, etc.
3. It utilizes a trigger word. > “Trigger words are the words and phrases that trigger a user into clicking.” This might be words like “pricing” or “free” — something that you know is going to hook them, depending on the page they’re on. Surveys and qualitative research or user testing will provide some insight into what exactly your audience will be seeking after.

• CXL notes that very few users will respond when they see words such as “SUBMIT.” Keep this in mind when you are button brainstorming!

Fold & Page Length

Who would have thought that the “fold” has such an impact on conversions? What is the fold, anyway? It is the top portion of a web page — it’s what people see when they click on a site before they have to do any scrolling. Since this is essentially a user’s first impression of any website, the most critical items should be above the fold, looking fresh and ready to attract attention.

When using tracking tools (SessionCam, Clicktale, Crazyegg), CXL states that across the board of websites, the further along the page you track, you will find less people have scrolled there. This is why designing all of your pages on each website with the most important content up top is absolutely imperative. You should never risk visitors leaving before they even get to the meat of your site.

Some helpful tips from the pros at CXL Institute are:

• Checkout pages should have the checkout option available without having to scroll (either by multi-step approach with shorter pages, or the accordion/expand and collapse technique)
• Cart pages should have “continue to checkout” above and below cart contents
• Form pages (sign up, lead generation, requests) ideally would have the entire form above the fold. Cut out all unnecessary fields.
• Pricing pages should allow users to understand pricing and select a plan above the fold

What are some reasons we should take shorter pages into account? For starters, the loading time. If a site takes too long to load, you can pretty much guarantee that you’re going to lose a chunk of people with drop off. The shorter your page is, the faster it will load. While the content of your website is more important than site speed, you do want to make sure that a slow website won’t deter potential conversions from occurring.

ECOMMERCE SIGNUPS

We have all been to the websites that require you to register or make an account before you can make a purchase with them. CXL teaches (in very plain terms) — Don’t do it! Not having the alternate option of a guest checkout will only affect conversion negatively. According to their studies, 1 in 4 will desert the transaction process if they are forced to create an account. Yikes. Let’s not do that. One way to get around this is to have a “thank you” page after the guest transaction has been completed. You can offer to have them get connected with just 1 or 2 clicks. Since they’ve already entered their name and email address (in order to receive updates about their package), they would only have to click once more to officially become a member.

This information is so accurate in my experience. If I am a new customer to a website and want to buy a couple of items, perhaps even 1 thing, I don’t always want to sign up. If I don’t think I’ll be repurchasing from them again or often enough, I want to be in and out. The option to opt into registering after the transaction is complete, however, and also getting an incentive, is very clever. That would likely catch me if I saw it presented that way more often.

PHONE LEADS & CALL TRACKING

Is your conversion goal a phone call? CXL Institute has plenty of tips for optimizing your website with phone conversations in mind. If increasing the number of phone calls coming in is an important metric to track, then we need to measure and track it.

If we look at our phone calls as more than just a conversation, but a potential conversion, we need to break away from the myths we are accustomed to hearing.

1. “If someone wants to call you, they will.”

• This might ring true for friendships, but not in business. Getting calls is no different than getting a customer to purchase something… it takes work!

2. Just putting the phone number in the header or footer is not enough. Catchy phrases like “Call Us!” is not enough.

Optimizing for more phone calls can be done in a handful of ways:

• Have the right offer
• What is so important that they would have to call you? Make this so beneficial to the consumer that they can’t pass up the offer. Use language such as “immediate help,” rather than “call for help”
• Put offers in optimal places
• Remember our talk about putting important content in before “the fold”…? Well, this is your time to put it to the test. If phone calls are vital to your business, put it both above the fold and in the bottom half of the content (about 75% down the page)
• Ensure all elements are in sync
• If you have PPC (Pay-per-click) ads that funnel traffic to landing pages with contact options, be sure that everything is fluid. Add a phone number in the ad that indicates a real person is available to talk to them.
• Measure the money

So what about phone tracking? You can actually add Analytics event or tag for phone calls — which is down right genius. It’s an inexpensive and dependable way to get more data. If you can measure something, you can see areas that need a little assistance. CXL suggests:

1. Use unique phone numbers on all channels

• Numbers that are provided by call tracking company can sometimes use your existing numbers

2. Add the option of “tap to call” for phones

Google Analytics can dig deep into the data and retrieve crucial info for us. What pages were they on before they decided to call? What PPC or SEO keyword did the trick? Think about how much money we can save by knowing which words we are either over or under bidding for PPC ads.

On a tight budget? One way to get a bit of data without spending money is utilizing “click to reveal.” In basic terms, it’s a link, button, or collapse section where visitors have to click to reveal the phone number. While it won’t tell you if they actually called or not, this option at least gives you some insight over nothing at all.

TYPOGRAPHY & CONTENT

Is anyone even reading the content on your website? It’s a scary thought. What if all the effort we have put into creating our websites is missing the vital element of readability? Here is a summary CXL has to say about it…

• Select an easy to read font size.
• For the body of text, don’t dip below 16 pixels
• Instructions (i.e. form labels) can be between 12px and 14px, while headlines and CTAs need to be much larger to catch the eye
• Prototypically
• Common fonts are easiest to read
• Arial, Georgia, Tahoma — they are all relatively the same in terms of legibility
• Stay away from the more unique fonts for larger bodies of text, as they are more difficult to read
• Avoid ALL CAPS
• Don’t yell at your readers!
• Use ordered & unordered lists
• Use images to break up bodies of text
• Start a new paragraph every 3–4 lines for easy reading
• Sub-headline every 1–2 paragraphs

For reference, studies indicate that an optimal sentence length is between 50–75 characters.

What if your line of text is…

Too long? We don’t want to lose our reader’s attention. Too long creates an issue for the reader’s eyes to discover where the sentence begins & ends, and they might just quit altogether.

Too short? The eye will travel back & forth, likely disrupting their concentration. Studies show readers will skip to the next line before finishing the current one, due to the shortness of length.

The reality is, the less words, the better. People simply don’t like to read much. For this reason, write your text in a manner that is easy to scan.

Focus on:

• Headline
• Intro paragraph
• Bullets above the fold
• Sub-headlines
• Keep in mind that most people won’t be reading the text below your sub-headlines.
• Utilize the info by answering important questions, rather than asking them in this section.

THE HOMEPAGE

I love the simplicity that CXL uses to explain this next segment. When constructing your homepage, there are 2 main goals you’ll want to keep in the forefront of your mind:

• Give Users Information
• Provide Top-Level Navigation
• How can they easily get around your site?

Your homepage should answer viewer questions such as: What can I do here? How is this different from other websites? How is this going to benefit me? You want to make sure your homepage is driving users to other parts of the site, specifically pages assisting in conversion.

Does it have both clear text and visuals to guide you? Ensure there are primary calls to action, in addition to links that provide information. Make your text concise, enlarge the important things, add images, and create bulleted lists.

CONCLUSION

Well, dang. That was pretty intense (in the best possible way), if I do say so myself. I hope I was able to adequately relay some of the amazing things I’ve learned this week with the Conversion Rate Optimization course through CXL Institute. I’ll see you next week with some more truth bombs.

Now get to work!