(This is a guest post created by guest author Karli Jaenike)


Google is committed to fulfilling user expectations. It rewards websites with high ranks and greater visibility if they provide a better user experience. Unfortunately, only 55% of companies perform any testing to measure and improve their customers’ experience, but this number will increase. That’s because Google plans to roll out new page experience signals every year so they can measure user satisfaction and factor it in ranking.

Till now, Google has measured web usability through bounce rate, content quality, and cross-platform adaptability. Since these matrices are a prominent ranking factor, websites can increase their ranking and conversion probability by focusing their efforts on making the website user-friendly.

Google’s newest update, Core Web Vitals, is another way to measure and reward a good page experience. According to Patrick Kettner, “It sets a baseline goal that teams can develop towards to ensure users are getting that great user experience.”


CRO-Related Ranking Signals for Page Experience

A higher conversion rate is already tied to a good user experience by default. Page experience signals measure a site’s user experience and factor it into the SERP ranking. These factors directly affect the conversion rate optimization (CRO) elements, such as load time, pop-ups, adverts, etc. Let’s briefly see how conversion rate optimization aligns with Google’s page experience signals.


Core Web Vitals

These signals are centered around page load time and easy usability. Google has set a standard threshold for each of these metrics that websites must achieve to improve their ranking potential.

Largest Contentful Paint (LCP): Essentially, this is a measure of the time it takes for the largest image or text block to appear. A good loading time is from 2.5 seconds to 4 seconds. If your webpage begins to load after 4 seconds, it can adversely affect its ranking.

First Input Delay (FID): This is the time a page takes to respond to users’ actions for the first time after loading. For example, if someone clicks on a link or uses a button, the page should respond within the first 100 to 300 milliseconds.

Cumulative Layout Shift (CLS): This is the measure of the visual stability of the page, i.e., the unexpected and sudden layout shifts on a webpage as it’s loading. Remember the times when you click or tap on something, but the page elements move suddenly, and you end up clicking on something else? Ideally, the CLS score should be less than 0.1 and never above 0.25.

All the above elements directly involve CRO elements such as images, pop-ups, and adverts that encourage people to convert. However, if not optimized properly, they can adversely affect Core Web Vitals and user experience.


Boolean Checks

These are the checkpoints that Google already uses to measure Page Experience and rank websites. These checks consist of the following:

Mobile-Friendliness: This ensures your website is easy to use on mobile devices.

Safe-Browsing: There should be no malicious or deceptive pages, suspicious links, or other kinds of harmful downloads, or you’ll get a penalty.

HTTPS: All websites should be served on the encrypted network protocol HTTPS.

No Intrusive Interstitials: Google explains intrusive and non-intrusive interstitials in detail. It favors sites that offer a non-disruptive user experience with responsible use of interstitials.  

Let’s look at how you can optimize CRO elements to keep your page experience at par with Google standards.


How to Optimize CRO Elements for Page Experience


1. Preload Key On-Page Elements And Visuals

The Largest Contentful Paint (LCP) is the first Core Web Vitals metric which measures how quickly the first block of image or text appears on the page.

Typically it’s the content above the fold, such as banners or video adverts. If visitors have to wait for the page to load due to heavy adverts or unrelated videos ads, it can annoy them and reduce conversion chances.

You can find the LCP of a page through Chrome DevTools. Just right-click on the page and click Inspect. Under the Performance tab, you can find the LCP of your page.


If LCP duration is long, you can identify the relevant elements and use preloaded commands to prioritize their loading. It tells the browser to prioritize loading the above-the-fold content or the largest content on that page, such as video, image, or text block.


2. Resolve Issues Than Can Freeze The Page

If your page freezes when visitors interact with a button or a link, the First Input Delay (FID) can increase. It’s another Core Web Vitals metric to measure user experience. Of course, if it takes a lot of time for the page to respond to clicks and taps, it can annoy the buyers and distract them from shopping or interacting.

Usually, response time increases because of pieces of JavaScript code that prevent the main thread from loading. The browser has to parse these entire codes before it can render the page. Sometimes it can cause the page to freeze, pause or become unresponsive.

You can discover these long tasks at the top of the waterfall chart in Chrome DevTools under the Performance tab. Locate red triangles, which indicate long tasks, and you can also see the breakdown of different activities that took place while they were loading.



You will need to isolate problematic code snippets and remove them. If removing them is not an option, consider splitting them into smaller chunks so that they won’t block the main thread from loading.

The decision of removing or splitting the code will vary from situation to situation. You can also increase page speed dramatically by removing unused code, comments, and other characters.


3. Reserve Space for Embedded Graphics

Have you ever had on-page elements suddenly move or shift, and you ended up clicking or tapping on something you didn’t intend to? Almost all of us have faced this annoying situation.

What happens is, as the webpage loads, some elements like text blocks load quicker than images, buttons, or videos. When the heavier elements finally render, they push other blocks out of their place. This makes for a horrible user experience and can render CTAs and other conversion elements ineffective.

The Cumulative Layout Shift (CLS) attempts to measure this instability time and use it as a ranking factor to encourage developers to rectify the situation.

CLS can increase if you neglect to reserve panels for images, ads, embeds, iframes, and other elements, especially when they don’t have fixed dimensions. That’s why in responsive designs, modern browsers have a default aspect ratio to allocate space for each embed.

From the Performance tab, you can see whether the various CRO elements on your page have space allocated for them to load into or not.


4. Ensure Cross-Device Adaptability

About half of the web traffic worldwide comes from mobile accounts. During Q1 2020, 54.8% of global traffic was generated from mobiles alone, without even including the traffic from tablets.


Source


That’s why websites must have a responsive design. The website layout on mobile devices can critically affect conversion rate and user experience. Plus, what good is having killer calls to action if people can’t click on them?

For instance, the font style, button text, size, and color, paragraph size all need to adjust to facilitate user experience on the small screens. Users should see all the content without having to zoom in or scroll all across the screen. Easy navigating from one page to another is also a significant factor in ensuring a good user experience.

Notice the side-by-side examples below. The text on the right is too small to be read on a mobile screen. The links are also too tiny to tap on without zooming.



You can find out whether your website offers a good user experience on mobile through Google’s Mobile-Friendly Test or access the Mobile Usability report in Google Search Console. If breakdowns and flags all the mobile usability issues for you to fix.



5. Ensure User Security

Website security is crucial for both users and Google. That’s why it’s a prominent ranking factor and page experience metric. As a baseline, Google rewards websites served over HTTPS and labels HTTP websites insecure, and avoids showing them in the SERP.




The search engine also looks for any indication of malware, deceptive content, doubtful links, phishing, or suspicious software. Questionable links also include social media links such as links to influencer giveaways. Ensure to link to credible content only or add rel:nofollow to outbound links to uncredible sites.

As you create link magnets for your site, remember to monitor your backlinks and disavow links from suspicious-looking websites.

You can find out whether or not your website has any issues by looking at the Security Issues report in Google Search Console under Security & Manual Actions heading. This not only helps you rank better but keeps folks who are clicking on your CTAs safe.



6. Optimize Popups and Interstitials

Pop-ups and interstitials are crucial elements to convert visitors into subscribers and customers. However, Google is quite particular about how you should and shouldn’t add interstitials to maintain a positive user experience.

Intrusive interstitials are frustrating because they obstruct most of the page, especially the content readers wish to consume. A user-friendly way to add these pop-ups is to make sure they don’t cover essential on-page elements and are easy to close.


 


In this side-by-side comparison, notice that Stigma subscribe pop-up is too in-your-face and covers the entire screen space disrupting the user experience. In contrast, the Nordstrom survey pop-up is neatly tucked at the bottom and doesn’t cover the crucial on-page elements.

Pop-ups and interstitials are most annoying on mobile devices, so it’s worthwhile to visit your website pages and notice how they might be affecting your visitors.


7. Include CTAs Strategically

Compelling content and strategic call-to-action buttons (CTAs) are the backbones of conversion optimization. Ensure CTA buttons have a prominent color with easy-to-read text that prompts the reader to act and click on them. If you have all of the above elements optimized, your CTAs will be user-friendly and highly convertible.

According to Chris Dayley of Content Marketing Institute, “With calls to action, we need to tell our audience exactly what we want them to do.”

Pay particular attention to the button size to accommodate mobile users. Similarly, avoid large paragraphs and experiment with the font style and size such that it looks best on both larger and smaller screens.

Make sure the landing pages, created specifically for conversion, have enough information and no distractions so that the visitors can gravitate toward the CTA and take the desired action. Since text blocks load quickly, words are effective in persuasion and don’t interfere with Core Web Vital metrics by Google.

Conversion means different things for users at various stages of the buyers’ journey. For a new customer at the awareness stage, clicking on your result or hitting the subscribe button can be enough. Whereas at the transactional phase, the conversion will be measured by the amount of generated revenue. Page Experience needs to be baked into your conversion strategy at all stages of your marketing strategy.

Just because a pop-up appears on your page or you add a solid CTA doesn’t mean the visitors will subscribe to your website or buy your product. Your need to woo your visitors and Google by optimizing your CRO elements for a superb page experience and low Core Web Vital metrics.


Author Bio:

Karli is a content marketer and founder of content marketing and SEO collective Wild Idea. With over 10 years in the marketing industry, she’s worked with brands large and small across many industries to grow organic traffic and reach new audiences. She writes on everything from marketing, social and SEO to travel and real estate. On the weekends, she loves to explore new places, enjoy the outdoors and have a glass or two of vino!