Connect with us

SEO

How To Use Standard & Custom Markup

Published

on

How To Use Standard & Custom Markup

If you dig deep enough, you’ll find a good story embedded in pretty much everything.

One of the more interesting that I’ve been fortunate enough to witness is the story of Wix for structured data (and I’ve seen more than my fair share of SEO tools).

On the surface, you would think a CMS and structured data would make for a pretty lousy story, but it’s only a matter of digging deep enough.

Here’s what you need to know about working with structured data on a Wix site and how we got there.

A Post On Wix Structured Data – Why Now?

In fewer than three years, Wix went from supporting little by way of structured data to offering SEO pros and site owners the ability to do nearly whatever they want with relative ease.

Due to recent platform updates, any content on the internet around this topic is now out of date.

But I’m also writing this because, in its own weird way, it tells the story of SEO coming into its own and becoming a focus for so many major corporations and platforms over the past few years.

Here’s a quick timeline of how Wix’s structured data capabilities have evolved:

  • January 2020: Wix began creating out-of-the-box markup for vertical pages.
  • January 2020: Structured Data API introduced to Velo, Wix’s dev tool.
  • January 2021: Additional verticals get out-of-the-box markup.
  • February 2021: Customizable structured data on Wix static pages opened to all users.
  • August 2021: Users received the ability to add more than one markup per page and edit prefabricated markup at the page-type level.
  • February 2022: Wix sites with an updated physical address automatically have local business markup applied to the site.
  • March 2022: Product image markup added by default to out-of-the-box product markup.
  • April 2022: Wix’s out-of-the-box markup for vertical pages becomes customizable without using a dev tool for single pages.

How did this happen?

It came about because SEO became a C-level priority and structured data was the logical place to make that priority a reality.

This is what I was alluding to earlier: How Wix evolved around structured data tells the more recent story of SEO.

In this column, you’ll learn how structured data works on a Wix site and how it corresponds to how significant SEO has become as an industry.

This significance is the overarching catalyst for our more recent developments.

The Challenges Of Solving Structured Data For Wix Sites

Making structured data implementation accessible and scalable for a robust platform was not easy. I say robust not to use embellishing marketing terminology but because of the construction of Wix as a platform.

Essentially, you have your main pages for the site (static pages).

Pages, such as your homepage and about page, are “owned” by the team responsible for the main Wix Editor.

Wix offers, however, all sorts of page types, from product pages to blog pages to niche verticals, such as restaurant and fitness pages.

Adding any of these pages means you need to add the “app” for the page type to your Wix site.

To run a blog on your site, you need to add the Wix blog app to create those dynamic blog pages, for example.

Of course, each “app” or vertical is run by its own team, often with unique technical considerations.

Now to make matters just a bit more complicated, there are static pages within the Wix Editor.

You manage vertical pages (which, for this post, is how I will refer to pages such as product pages, courses, blog pages, forums, etc.) from the Wix dashboard.

 Wix’s vertical pages are managed within the dashboard, not the Wix Editor.Wix Dashboard Page Manager

To create an across-the-board change to structured data implementation, you make the change across two different sub-platforms within Wix (the Wix Editor and the Wix dashboard) and across any multiple (and unique) verticals.

Let’s make the problem more complicated: Wix has all sorts of users.

There are business owners with little technical know-how and professional developers using an in-built full-stack dev tool called Velo to build sites.

How do you cater to both?

Once we got up and running with improving structured data in a serious way (circa early 2020), we were left in a peculiar situation: Wix offered out-of-the-box markup for a variety of dynamic verticals ranging from courses to products to the blog, but without an easy way for customization.

Users had to rely on our dev tool to make changes to the markup we created.

This doesn’t work for business owners and it doesn’t work for many SEO experts.

And in either case, it’s not the most straightforward or streamlined approach.

Moreover, prefabricated markup at the folder level is great until you need to change the markup for a specific page within that group.

Again, you could, but you needed our dev tool, leading you to the same problem.

Out-Of-The-Box Structured Data Markup On Wix

Now let’s talk about solutions. We’ll start with the initial offering we created to make structured data scalable and help site owners who don’t have an SEO background – out-of-the-box markup.

There are a set of pages in Wix that (again) I will refer to as “vertical pages” throughout this post.

These are dynamic pages part of the various core verticals or “dynamic page types” Wix offers.

These verticals include:

  • Product pages (i.e., Wix Store).
  • Blog pages.
  • Courses.
  • Events.
  • Forums.

Wix automatically creates Rich Result-optimized JSON-LD structured data markup based on best practice recommendations from Google for these page types.

You don’t need to add any structured data markup to gain rich results – Wix handles that for you.

Since Wix is a closed-CMS, we understand the structure of vertical pages because we built these pages and can automatically create markup.

So, when your client creates a new event page, we can pull the necessary information from the page to create Event markup automatically.

The same is true for product pages, courses, forums, etc.

This is helpful for two reasons:

  • It can be a major time-saver when initially working on a site.
  • It can be a major time-saver when Google changes its rich result requirements.

To the latter, when Google changes its structured data requirements for rich result eligibility, you don’t need to start making changes to what can be hundreds (if not thousands) of pages.

When relying on Wix’s out-of-the-box markup, Wix’s SEO product team will implement these changes so that users don’t have to.

More recently, Wix’s automated markup already included Google’s new rich result eligibility requirements:

However, what about pages where Wix does not automatically create markup?

And, of course, what about instances where you want to either edit or override the markup Wix creates for you?

Creating & Customizing Structured Data Markup On Wix

Providing out-of-the-box markup solves some problems but, at the same time, can cause new ones.

What if you don’t want to use the implementation we created for you?

And, what if you want to create markup where we didn’t create any for you?

This is where it gets a little interesting.

Remember, Wix is fundamentally a website builder.

The SEO functionality will, at times, need to align with how the platform itself is constructed.

To that end, there is not one linear procedure for customizing structured data on a Wix site.

I hate to employ an SEO cliche, but it all depends.

In this case, it depends on the type of page you are working with and your goals.

We can essentially bucket structured data implementation for Wix sites into one of the following tasks:

  • Inserting custom markup on Wix static pages.
  • Editing or overriding the out-of-the-box markup created on vertical pages.
  • Implementing markup at scale.
  • Adding multiple markups to a page.

Creating Custom Markup On Wix Static Pages

With markup customization, we started with the site’s main pages (its static pages) because it was the path of least “complication.”

Not only were static pages the “simplest” page type for us to open up markup customization for, but they are also the simplest when discussing structured data implementation on Wix.

You can add whatever markup you want directly in the Wix Editor on these pages.

It’s pretty straightforward.

Once the Wix Editor is open, select the page you want to work with and open the SEO Panel by clicking where it says “SEO Settings,” as shown below:

SEO Settings in Wix Editor Screenshot from Wix, May 2022SEO Settings in Wix Editor

Once you do so, the full panel will appear and you can select “Advanced SEO.”

Once there, you will see the field to drop in the JSON-LD code:

Edit markup on Wix editorScreenshot from Wix, May 2022Edit markup on Wix editor

What if you want to add more than one markup to the page?

I’ll get to that shortly.

First, let’s deal with customizing Wix’s automated markup.

Editing & Overriding Wix’s Automated Markup

Once we open up the platform to structured data customization (at least without using a dev tool), we get to the next challenge – the markup we created for you and your desire to customize it.

Wix automatically creates markup for many of a site’s vertical pages.

If you create a product page via the Wix Store application, Product markup is automatically added to the page (again, since we designed the construct of the page, we understand what information to pull into the markup automatically).

But what if you want to customize this markup or disregard it altogether?

Bulk Schema Edits By Page Type

Until the recent past, you had to rely on Velo, Wix’s dev tool, to make bulk edits to your structured data markup.

However, it is now possible to do it from the Wix dashboard (as opposed to the Editor, as vertical pages are managed via the dashboard, whereas static pages are managed in the Editor).

Once you access the SEO Tools within the dashboard, select the page type you want to customize the markup for.

Remember, we’re working with the site at the page-type level here, so any changes you make will apply across the board to all pages of that type.

For this example, I’m going to work with product pages.

SEO settings for Wix product pagesScreenshot from Wix, May 2022SEO settings for Wix product pages

With the page type selected, you can exclude the markup from all pages within the vertical (again, in this case, all product pages):

Exclude structured data markup Wix SEO settingsScreenshot from Wix, May 2022Exclude structured data markup Wix SEO settings

Conversely, you customize the existing automated markup by clicking Preview Preset:

Preview button Wix structured data markupScreenshot from Wix, May 2022Preview button Wix structured data markup

This will bring up a preview of the markup code. From here, you need to click on Convert to custom markup:

Edit Wix automated structured data markupScreenshot from Wix, May 2022Edit Wix automated structured data markup

Now’s where the fun starts. You can add variables from the available dropdown list:

Add variable to Wix structured data markupScreenshot from Wix, May 2022Add variable to Wix structured data markup

Or, you can add whatever custom code you want right in the field:

Adding new markup on WixScreenshot from Wix, May 2022Adding new markup on Wix

Notice that if you enter an invalid code, the field will immediately indicate that there is an error.

As stated, all of these capabilities are not for specific pages. Any change here impacts all of the pages within the folder.

But, what if you want to leave the pages in the folder alone and customize the markup on a few exceptions?

This leads us to our most recent structured data update, which has been quite a popular request of Wix users.

Customizing Structured Data On A Single Vertical Page

Things were moving along quite nicely, but there was still one major snag in the “Wix markup customization experience” – tailoring the automated markup on single vertical pages.

This was, in fact, a major pain point for a lot of our users.

It was also a more complicated problem to solve internally.

As of April 2022, it became possible to update a single vertical page’s markup while leaving the rest of the pages within the folder as is. This was really one of the last major customization roadblocks for us to solve.

(For the record, this post is not written in chronological order, so there are still other pain points that we’ll soon get to.)

Before this update, the only way to work with the markup on a single dynamic vertical page was by using Velo (Wix’s dev tool), making the process less efficient than it should have been.

While static pages are managed in the Editor, editing the markup for a specific vertical page is done within the Wix dashboard.

Keeping with products pages, to customize the out-of-the-box markup of a specific page, first select the vertical from within the dashboard, select a specific page, and click on the Edit SEO settings button:

SEO settings for Wix individual product pageScreenshot from Wix, May 2022SEO settings for Wix individual product page

This will open the SEO Panel, where you can access the settings for structured data via the Advanced tab.

Once you have that open, access the markup settings and click to exclude the automated markup from that specific page:

Advanced SEO settings tab in Wix dashboardScreenshot from Wix, May 2022Advanced SEO settings tab in Wix dashboard

You might be asking, but isn’t that only half the problem?

Don’t you need to create new custom markup to replace the out-of-the-box markup that we just excluded from the page?

The answer is yes, we do!

Just click Add New Markup from the panel and paste your code into the field that pops up:

Adding new structured data markup in Wix dashboardScreenshot from Wix, May 2022Adding new structured data markup in Wix dashboard

Wait a second, does this mean you can add more than one markup for a page (if you’ve been following the screenshots, the option to add a new markup was there the whole time, not just after I excluded the automated code)?

Short answer: Yes.

Before we get to that, there’s another question to address: If I want to exclude Wix’s out-of-the-box markup for the entire subfolder, can I create new markup at scale, or do I need to do it page-by-page?

Creating & Customizing Wix Markup At Scale

To be honest, we’ve already indirectly covered some of the scalability when using Wix to implement structured data markup. As we’ve already seen, you can either exclude or customize the automated markup across all pages within a vertical.

In cases where you exclude the automated markup across the board, you can create a custom markup that applies across all of the pages within a vertical to replace it.

Once the markup is excluded from a given page type, use the SEO Settings (as found within the Wix dashboard under SEO Tools) to add a new markup and paste in whatever code you would like:

Adding structured data markup in Wix SEO settingsScreenshot from Wix, May 2022Adding structured data markup in Wix SEO settings

Hit apply and you have just added custom markup for all pages of that type in a single click.

Great, can I do that and add another markup to all pages of a single type?

In other words, let’s talk about adding multiple markups to a single page.

Adding Multiple Markups To Wix Pages

As we began to open up the Wix platform for structured data markup customization, we knew that one limitation was going to be the inability to add multiple markups to a single page.

However, from a development and infrastructure standpoint, it made sense to tackle this at the same time as opening up our out-of-the-box markup for customization.

This means developing the ability to add more than one markup to vertical pages and static pages, along with the ability to customize the out-of-the-box markup.

For static pages, the SEO Panel in the Editor presents an option to add a new markup. After that, you can keep adding and adding new markups:

Adding multiple markups in Wix EditorScreenshot from Wix, May 2022Adding multiple markups in Wix Editor

When you’re working with a single vertical page within the dashboard, you have the same options within the SEO Panel there:

Adding multiple markups to Wix vertical pageScreenshot from Wix, May 2022Adding multiple markups to Wix vertical page

So, if you want to exclude the out-of-the-box Product markup completely, custom create the markup, and then throw FAQ markup on top of that for a single page, you can certainly do so, as was shown earlier.

For example, here’s what you could do with this capability: Let’s say you sell cookware and offer your cooking course on all of your product pages. You can custom create Event markup and apply it to all of your product pages in one shot:

Adding multiple markups to Wix at scaleScreenshot from Wix, May 2022Adding multiple markups to Wix at scale

Here again, you’ve customized what could be thousands of pages in three to four clicks.

One Last Gap: Custom Dynamic Pages

There is still one gap we have left to close.

There is one often used core type of page that still requires our dev tool (Velo) to create structured data, and those are custom dynamic pages.

Custom dynamic pages are pages you create as part of a larger dataset or custom collection.

Let’s say you have a section on your site for the latest industry news but want to keep it separate from your blog. You can use the Wix Content Manager to create a set of dynamic pages to manage this section of your site.

And while you can do things like custom-set the title tag or meta description within the SEO Panel for these pages, we do not yet support structured data implementation unless you use our dev tool.

SEO settings panel Wix custom dynamic pagesThe SEO settings for custom dynamic pages include your title tag and meta description but not the implementation of structured data.SEO settings panel Wix custom dynamic pages

While there is not yet a streamlined way to implement structured data on these pages, either through the Wix Editor or Dashboard, there is an API in Velo that is dedicated to structured data.

Wix Velo structured data codeSample code from Wix’s Velo Structured Data API.Wix Velo structured data code

So, if you are working with custom dynamic pages within Wix, it’s important to understand the limitation and the way to work around it – until we get to supporting markup customization within the Wix dashboard.

Summing Up Wix Structured Data Implementation

I know I’ve thrown a lot of information at you. Here’s a summary of some of the key points and capabilities outlined above (because at least one section of this post should have some glimmer of brevity).

  • You can customize markup on Wix static pages and Wix vertical pages in two locations; the former within the Wix Editor and the latter inside the Wix dashboard.
  • You can add more than one markup to Wix static and vertical pages.
  • You can edit and override the out-of-the-box markup Wix creates on many of its vertical pages, both at the page-type level and for specific pages within a folder.
  • Implementing structured data markup on custom dynamic pages still requires the Wix dev tool, Velo.

Of course, there are still various things we have on our roadmap to continue evolving our structured data capabilities.

Wix is always looking to improve our structured data offering and would be happy to hear your thoughts and feedback.

More resources: 


Featured Image: ra2 studio/Shutterstock

!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version=’2.0′;
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window,document,’script’,
‘https://connect.facebook.net/en_US/fbevents.js’);

if( typeof sopp !== “undefined” && sopp === ‘yes’ ){
fbq(‘dataProcessingOptions’, [‘LDU’], 1, 1000);
}else{
fbq(‘dataProcessingOptions’, []);
}

fbq(‘init’, ‘1321385257908563’);

fbq(‘track’, ‘PageView’);

fbq(‘trackSingle’, ‘1321385257908563’, ‘ViewContent’, {
content_name: ‘wix-structured-data’,
content_category: ‘seo digital-marketing-tools’
});

Source link

Keep an eye on what we are doing
Be the first to get latest updates and exclusive content straight to your email inbox.
We promise not to spam you. You can unsubscribe at any time.
Invalid email address

SEO

Optimizing Interaction To Next Paint: A Step-By-Step Guide

Published

on

By

Optimizing Interaction To Next Paint: A Step-By-Step Guide

This post was sponsored by DebugBear. The opinions expressed in this article are the sponsor’s own.

Keeping your website fast is important for user experience and SEO.

The Core Web Vitals initiative by Google provides a set of metrics to help you understand the performance of your website.

The three Core Web Vitals metrics are:

This post focuses on the recently introduced INP metric and what you can do to improve it.

How Is Interaction To Next Paint Measured?

INP measures how quickly your website responds to user interactions – for example, a click on a button. More specifically, INP measures the time in milliseconds between the user input and when the browser has finished processing the interaction and is ready to display any visual updates on the page.

Your website needs to complete this process in under 200 milliseconds to get a “Good” score. Values over half a second are considered “Poor”. A poor score in a Core Web Vitals metric can negatively impact your search engine rankings.

Google collects INP data from real visitors on your website as part of the Chrome User Experience Report (CrUX). This CrUX data is what ultimately impacts rankings.

Image created by DebugBear, May 2024

How To Identify & Fix Slow INP Times

The factors causing poor Interaction to Next Paint can often be complex and hard to figure out. Follow this step-by-step guide to understand slow interactions on your website and find potential optimizations.

1. How To Identify A Page With Slow INP Times

Different pages on your website will have different Core Web Vitals scores. So you need to identify a slow page and then investigate what’s causing it to be slow.

Using Google Search Console

One easy way to check your INP scores is using the Core Web Vitals section in Google Search Console, which reports data based on the Google CrUX data we’ve discussed before.

By default, page URLs are grouped into URL groups that cover many different pages. Be careful here – not all pages might have the problem that Google is reporting. Instead, click on each URL group to see if URL-specific data is available for some pages and then focus on those.

1716368164 358 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of Google Search Console, May 2024

Using A Real-User Monitoring (RUM) Service

Google won’t report Core Web Vitals data for every page on your website, and it only provides the raw measurements without any details to help you understand and fix the issues. To get that you can use a real-user monitoring tool like DebugBear.

Real-user monitoring works by installing an analytics snippet on your website that measures how fast your website is for your visitors. Once that’s set up you’ll have access to an Interaction to Next Paint dashboard like this:

1716368164 404 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the DebugBear Interaction to Next Paint dashboard, May 2024

You can identify pages you want to optimize in the list, hover over the URL, and click the funnel icon to look at data for that specific page only.

1716368164 975 Optimizing Interaction To Next Paint A Step By Step GuideImage created by DebugBear, May 2024

2. Figure Out What Element Interactions Are Slow

Different visitors on the same page will have different experiences. A lot of that depends on how they interact with the page: if they click on a background image there’s no risk of the page suddenly freezing, but if they click on a button that starts some heavy processing then that’s more likely. And users in that second scenario will experience much higher INP.

To help with that, RUM data provides a breakdown of what page elements users interacted with and how big the interaction delays were.

1716368164 348 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the DebugBear INP Elements view, May 2024

The screenshot above shows different INP interactions sorted by how frequent these user interactions are. To make optimizations as easy as possible you’ll want to focus on a slow interaction that affects many users.

In DebugBear, you can click on the page element to add it to your filters and continue your investigation.

3. Identify What INP Component Contributes The Most To Slow Interactions

INP delays can be broken down into three different components:

  • Input Delay: Background code that blocks the interaction from being processed.
  • Processing Time: The time spent directly handling the interaction.
  • Presentation Delay: Displaying the visual updates to the screen.

You should focus on which INP component is the biggest contributor to the slow INP time, and ensure you keep that in mind during your investigation.

1716368164 193 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the DebugBear INP Components, May 2024

In this scenario, Processing Time is the biggest contributor to the slow INP time for the set of pages you’re looking at, but you need to dig deeper to understand why.

High processing time indicates that there is code intercepting the user interaction and running slow performing code. If instead you saw a high input delay, that suggests that there are background tasks blocking the interaction from being processed, for example due to third-party scripts.

4. Check Which Scripts Are Contributing To Slow INP

Sometimes browsers report specific scripts that are contributing to a slow interaction. Your website likely contains both first-party and third-party scripts, both of which can contribute to slow INP times.

A RUM tool like DebugBear can collect and surface this data. The main thing you want to look at is whether you mostly see your own website code or code from third parties.

1716368164 369 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the INP Primary Script Domain Grouping in DebugBear, May 2024

Tip: When you see a script, or source code function marked as “N/A”, this can indicate that the script comes from a different origin and has additional security restrictions that prevent RUM tools from capturing more detailed information.

This now begins to tell a story: it appears that analytics/third-party scripts are the biggest contributors to the slow INP times.

5. Identify Why Those Scripts Are Running

At this point, you now have a strong suspicion that most of the INP delay, at least on the pages and elements you’re looking at, is due to third-party scripts. But how can you tell whether those are general tracking scripts or if they actually have a role in handling the interaction?

DebugBear offers a breakdown that helps see why the code is running, called the INP Primary Script Invoker breakdown. That’s a bit of a mouthful – multiple different scripts can be involved in slowing down an interaction, and here you just see the biggest contributor. The “Invoker” is just a value that the browser reports about what caused this code to run.

1716368165 263 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the INP Primary Script Invoker Grouping in DebugBear, May 2024

The following invoker names are examples of page-wide event handlers:

  • onclick
  • onmousedown
  • onpointerup

You can see those a lot in the screenshot above, which tells you that the analytics script is tracking clicks anywhere on the page.

In contrast, if you saw invoker names like these that would indicate event handlers for a specific element on the page:

  • .load_more.onclick
  • #logo.onclick

6. Review Specific Page Views

A lot of the data you’ve seen so far is aggregated. It’s now time to look at the individual INP events, to form a definitive conclusion about what’s causing slow INP in this example.

Real user monitoring tools like DebugBear generally offer a way to review specific user experiences. For example, you can see what browser they used, how big their screen is, and what element led to the slowest interaction.

1716368165 545 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of a Page View in DebugBear Real User Monitoring, May 2024

As mentioned before, multiple scripts can contribute to overall slow INP. The INP Scripts section shows you the scripts that were run during the INP interaction:

1716368165 981 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the DebugBear INP script breakdown, May 2024

You can review each of these scripts in more detail to understand why they run and what’s causing them to take longer to finish.

7. Use The DevTools Profiler For More Information

Real user monitoring tools have access to a lot of data, but for performance and security reasons they can access nowhere near all the available data. That’s why it’s a good idea to also use Chrome DevTools to measure your page performance.

To debug INP in DevTools you can measure how the browser processes one of the slow interactions you’ve identified before. DevTools then shows you exactly how the browser is spending its time handling the interaction.

1716368165 526 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of a performance profile in Chrome DevTools, May 2024

How You Might Resolve This Issue

In this example, you or your development team could resolve this issue by:

  • Working with the third-party script provider to optimize their script.
  • Removing the script if it is not essential to the website, or finding an alternative provider.
  • Adjusting how your own code interacts with the script

How To Investigate High Input Delay

In the previous example most of the INP time was spent running code in response to the interaction. But often the browser is already busy running other code when a user interaction happens. When investigating the INP components you’ll then see a high input delay value.

This can happen for various reasons, for example:

  • The user interacted with the website while it was still loading.
  • A scheduled task is running on the page, for example an ongoing animation.
  • The page is loading and rendering new content.

To understand what’s happening, you can review the invoker name and the INP scripts section of individual user experiences.

1716368165 86 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the INP Component breakdown within DebugBear, May 2024

In this screenshot, you can see that a timer is running code that coincides with the start of a user interaction.

The script can be opened to reveal the exact code that is run:

1716368165 114 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of INP script details in DebugBear, May 2024

The source code shown in the previous screenshot comes from a third-party user tracking script that is running on the page.

At this stage, you and your development team can continue with the INP workflow presented earlier in this article. For example, debugging with browser DevTools or contacting the third-party provider for support.

How To Investigate High Presentation Delay

Presentation delay tends to be more difficult to debug than input delay or processing time. Often it’s caused by browser behavior rather than a specific script. But as before, you still start by identifying a specific page and a specific interaction.

You can see an example interaction with high presentation delay here:

1716368165 665 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the an interaction with high presentation delay, May 2024

You see that this happens when the user enters text into a form field. In this example, many visitors pasted large amounts of text that the browser had to process.

Here the fix was to delay the processing, show a “Waiting…” message to the user, and then complete the processing later on. You can see how the INP score improves from May 3:

1716368165 845 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of an Interaction to Next Paint timeline in DebugBear, May 2024

Get The Data You Need To Improve Interaction To Next Paint

Setting up real user monitoring helps you understand how users experience your website and what you can do to improve it. Try DebugBear now by signing up for a free 14-day trial.

1716368165 494 Optimizing Interaction To Next Paint A Step By Step GuideScreenshot of the DebugBear Core Web Vitals dashboard, May 2024

Google’s CrUX data is aggregated over a 28-day period, which means that it’ll take a while before you notice a regression. With real-user monitoring you can see the impact of website changes right away and get alerted automatically when there’s a big change.

DebugBear monitors lab data, CrUX data, and real user data. That way you have all the data you need to optimize your Core Web Vitals in one place.

This article has been sponsored by DebugBear, and the views presented herein represent the sponsor’s perspective.

Ready to start optimizing your website? Sign up for DebugBear and get the data you need to deliver great user experiences.


Image Credits

Featured Image: Image by Redesign.co. Used with permission.

Source link

Keep an eye on what we are doing
Be the first to get latest updates and exclusive content straight to your email inbox.
We promise not to spam you. You can unsubscribe at any time.
Invalid email address
Continue Reading

SEO

International SEO For 2024: 9-Point Checklist For Success

Published

on

By

International SEO For 2024: 9-Point Checklist For Success

Getting your international SEO strategy right can be an elusive feat.

There are a lot more factors at play than people give credit for, and it’s often a thankless job.

A successful international SEO strategy requires a deep knowledge of your company’s commercial strategy as well as technical SEO knowledge, cultural sensitivity, and excellent data skills.

Yet the industry often regards international SEO as just your hreflang setup.

In this article, I will distill the complexities of international SEO success into an actionable step-by-step list that will take you from beginner to advanced practitioner. Let’s begin!

Part I: Be Commercially Aware

1. Understand Why Your Company Is Going International

Companies can grow by expanding their products and services, focusing on gaining market penetration or expanding into new markets.

While your team’s goal might be traffic, leads, or revenue, the leadership team is likely working under a different set of parameters. Most of the time, leadership’s ultimate goal is to maximize shareholder value.

  • In founder-owned companies, growth goals might be slower and more sustainable, usually aimed at maintaining and growing profitability.
  • VC-owned companies have high growth goals because they must provide their investors with a return that’s higher than the stock market. This is what is known as the alpha, or your company’s ability to beat the market in growth.
  • Publicly traded companies are likely aiming to grow their share value.
  • Startups, depending on their maturity stage, are likely looking to prove product-market fit or expand their reach fast to show that their operations are scalable and have the potential to be profitable in the future. The goal of this is to aid in raising further capital from investors.

Understanding why businesses go international is essential for informing your SEO decisions. What’s best practice for SEO isn’t always what’s best for business.

You must adapt your strategy to your company’s growth model.

  • Companies choosing to grow sustainably and maintain profitability will likely expand more slowly to a market that resembles their core market.
  • VC-owned companies will be able to invest in a wider range of countries, with a smaller concern for providing their users with an experience on par with that of their core markets.
  • Startups can try to beat their competitors to market by expanding quickly and throwing a lot of money at the project, or they might be concerned with cash flow and try to expand fast but cut corners by using automatic translation.

2. Stack Rank Your Target Markets To Prioritize Your Investment

I promise I’ll get to hreflang implementation soon, but so much about international SEO has to do with commercial awareness – so bear with me; this will make you a better professional.

Many companies have different market tiers to reflect how much of a priority each market is. Market prioritization can happen using many different metrics, such as:

  • Average order value or lifetime customer value.
  • Amount of investment required.
  • Market size.
  • And market similarity.

American companies often prioritize developed English-speaking countries such as the UK, Canada, or Australia. These are most similar to their core market, and most of their market knowledge will be transferable.

After that, companies are likely to target large European economies, such as Germany and France. They might also target the LatAm market and Spain in the same effort.

The last prioritization tier can vary widely among companies, with a focus on the Nordic, Brazilian, or Asian markets.

Part II: Know Your Tech

3. Define Your International URL Structure

When doing international SEO, there are 4 different possible URL structures, each with its pros and cons.

ccTLD Structure

A ccTLD structure is set up to target different countries based on the domain type.

This structure is not ideal for companies that target different languages rather than different countries. For example, a .es website is targeting Spain, not the Spanish language.

An advantage to this kind of structure is that the ccTLD sends a very strong localization signal to search engines as to what market they are targeting, and they can lead to improved trust and CTR in your core country.

On the other hand, ccTLDs can dilute your site’s authority, as links will be spread across domains rather than concentrated on the .com.

gTLD With Subdirectories

This is my personal favorite when it comes to international SEO.

These URL structures can look like website.com/en if they’re targeting languages or website.com/en-gb if they’re targeting countries.

This configuration aggregates the authority you gain across your different territories into a single domain, it’s cheaper to maintain, and the .com TLD is widely recognizable by users worldwide.

On the other hand, this setup can look less personalized to people outside the US, who might wonder if you can service their markets.

gTLD With Subdomains

This setup involves placing international content on a subdomain like us.website.com. While once popular, it’s slipping in favor because it doesn’t bring anything unique to the table anymore.

This setup offers a clear signal to users and search engines about the intended audience of a specific subdomain.

However, subdomains often face issues with SEO, as Google tends to view them as separate entities. This separation can dilute link, similar to the ccTLD approach but without the geo-targeting advantages.

gTLD With Parameters

This is the setup where you add parameters at the end of the URL to indicate the language of the page, such as website.com/?lang=en.

I strongly advise against this setup, as it can present multiple technical SEO challenges and trust issues.

4. Understand Your Hreflang Setup

In the words of John Mueller: hreflang can be one of the most complex aspects of SEO.

Screenshot from Twitter, May 2024

Hreflang reminds me of a multilingual form of a canonical tag, where we tell search engines that one document is a version of the other and explain the relationship between them.

I find hreflang implementation very interesting from a technical point of view. Because development teams mostly manage it, and it can be very much hit or miss.

Often, hreflang is constructed from existing fields in your content management system (CMS) or content database.

You might find that your development team is pulling the HTML lang tag, which follows a different ISO standard than hreflang, leading to a broken implementation.

Other times, there is a field in your CMS that your development team pulls from to build your hreflang setup.

Finding out how your hreflang tags are generated can be extremely helpful in identifying the sources of different issues or mitigating potential risks.

So speak to your engineering team and ask them how you’re currently generating hreflang.

5. Implement Hreflang Without Errors

There are three ways to implement hreflang on your site:

  • On your sitemap.
  • Through your HTTP header.
  • On your HTML head.

The method most of us are most familiar with is the HTML head. And while you can use more than one method, they should match each other perfectly. Otherwise, you risk confusing search engines.

Here are some basic rules for getting it done correctly:

  • In your hreflang implementation, the URL must include domain and protocol.
  • You must follow the ISO 639-1 language codes – don’t go around making up your own.
  • Hreflang tags must be reciprocal. If the page you’re listing as a language alternative does not list you back, your implementation won’t work.
  • Audit your hreflang regularly. My favorite tool for this, since it added the hreflang cluster analysis and link graphs, is Ahrefs. For the record, Ahrefs is not paying me to say this; it’s a genuine recommendation and has helped me a lot in my work.
  • You should only have one page per language.
  • Your hreflang URLs should be self-canonicalizing and respond with a 200 code.

Follow the above rules, and you’ll avoid the most common hreflang mistakes that SEO pros make.

And if you’re interested in the technical SEO aspect beyond hreflang, I recommend reading Mind your language by Rob Owen.

Part III: Invest In Content Incrementally

6. Translate Your Top-performing Content Topics

Now that you have the basic commercial and technical knowledge covered, you’re ready to start creating a content strategy.

You likely have a wealth of content in your core market that can be recycled. But you want to focus on translating high-converting topics, not just any topic; otherwise, you might be wasting your budget!

Let’s go step by step.

Cluster Your Website’s Content By Topic

  • Crawl your site using your favorite SEO tool and extract the URL and H1.
  • Use ChatGPT to classify that list of URLs into topics. You might already know what you usually write about, so include those topics in your prompt. You don’t want to have a classification that’s too granular, so you can prompt chatGPT to only create groups with a minimum of 10 URLs (adjust this to reflect the size of your website) and class everything else as other. This is an example of what your prompt might look like: “I will provide you with a list of article titles and their corresponding URL. Classify this list into the following topics: survey best practices, research and analysis, employee surveys, market research and others. Return this in a table format with the URL, title and group name.”
  • Start a spreadsheet with all your URLs in the first column, titles in the second column, and the group they belong to in the third column.

Measure Your Performance By Topic

  • Export your GSC data and use a =VLOOKUP formula to match your clicks to your URLs.
  • Export your conversion data and use a =VLOOKUP formula to match your conversions (leads, sales, sign-ups, or revenue) to the right URL.
  • You can then copy your topics column onto a new sheet. Remove duplicates and use the =SUMIF formula to aggregate your click data and conversion data by topic.

Choose What Topics You’ll Be Translating First

Using this data, you can now choose what topics are most likely to drive conversions based on your core market data. Choose how many topics or pieces of content you’ll be translating based on your budget.

Personally, I like translating one topic at a time because I’ve found that generating topical authority on one specific topic makes it easier for me to rank on an adjacent topic that I write about next.

7. Localize Your English Content

Once you’re set up with all your key pages and a few content topics, it’s time to evaluate your investment and see where you could be getting a bigger return.

At this stage, many companies have translated their content into a few different languages and likely copied the US content into their UK and Australian sites. Now that you’ve done some translation, it’s time to work on localization.

If you’ve just copied your US content into your UK and Australian sites, your Google Search Console indexing report might be screaming at you, “Duplicate, Google selected a different canonical than the user.”

A very easy fix that could yield great returns is to localize your English content to the nuances of those English-speaking markets.

You will want to instruct your translation and localization providers to adapt the spellings of certain words, change the choice of words, introduce local expressions, and update any cited statistic for the US with their local equivalent.

For example, if I’m targeting a British audience, “analyze” becomes “analyse,” a “stroller” becomes a “pram,” and “soccer” becomes “football.”

8. Invest In In-market Content

Once you’ve got the basics in place, you can start tackling the specific needs of other markets. This strategy is expensive, and you should only use it in your priority markets, but it can really set you apart from your competitors.

For this, you will need to work with a local linguist to identify pain points, use cases, or needs exclusive to your target market.

For example, if France suddenly made it mandatory to run a diversity and inclusion study for companies with over 250 employees, I’d want to know this and create some content on DEI surveys at SurveyMonkey.

9. Integrate With Other Content Workflows

In step six, we evaluated our top-performing content, chose the best articles to translate, and got it all down. But wait. Some of these source articles have been updated. And there is even more content now!

To run a successful international SEO campaign you must integrate with all the other teams publishing content within your organization.

Usually, the teams creating content in an organization are SEO, content, PR, product marketing, demand generation, customer marketing, customer service, customer education, or solutions engineering.

That’s a lot, and you won’t be able to integrate with everyone all at once. Prioritize the teams that create the most revenue-generating content, such as SEO, content, or product marketing.

Working with these teams, you will have to establish a process for what happens when they create a new piece, update some content, or remove an existing piece.

These processes can differ for everyone, but I can tell you what I do with my team and hope it inspires you.

  • When a piece of content that’s already been localized into international markets is updated, we get the content in a queue to be re-localized the next quarter.
  • When they create a new piece of content, we evaluate its performance, and if it’s performing above average, we add it to a localization queue for the next quarter.
  • When they change the URL of a piece of content or delete it, all international sites must follow suit at the same time, since due to some technical limitations, not making the change globally would create some hreflang issues.

Wrapping Up

International SEO is vast and complex, and no article can cover it all, but many interesting resources have been created by SEO pros across the community for those who want to learn more.

Navigating the complexities of international SEO is no small feat. It’s an intricate dance of aligning commercial strategies with technical precision, cultural insights, and data-driven decisions.

From understanding your company’s core motives for global expansion to meticulously implementing hreflang tags and localizing content, every step plays a crucial role in building a successful international presence.

More resources: 


Featured Image: BritCats Studio/Shutterstock



Source link

Keep an eye on what we are doing
Be the first to get latest updates and exclusive content straight to your email inbox.
We promise not to spam you. You can unsubscribe at any time.
Invalid email address
Continue Reading

SEO

Google’s AI Vision Driven By Panic, Not Users: Former Product Manager

Published

on

By

Hand pressing the red button. vector illustration

A 16-year Google veteran is raising concerns about the company’s current focus on AI, labeling it a “panic reaction” driven by fear of falling behind competitors.

Scott Jenson, who left Google last month, took to LinkedIn to critique the tech giant’s AI projects as “poorly motivated and driven by this mindless panic that as long as it had ‘AI’ in it, it would be great.”

Veteran’s Criticism Of Google’s AI Focus

Jenson stated that Google’s vision of creating an AI assistant for its ecosystem is “pure catnip” fueled by the fear of letting someone else get there first.

He parallels the ill-fated Google+ product, which he calls a “similar hysterical reaction” to Facebook’s rise.

Jenson wrote:

“This exact thing happened 13 years ago with Google+ (I was there for that fiasco as well). That was a similar hysterical reaction but to Facebook.”

Lack Of User-Driven Motivation

Jenson argues that Google’s strategy lacks motivation driven by genuine user needs, a sentiment echoed by a recent Gizmodo article that described this year’s Google I/O developer conference as “the most boring ever.”

The article, which Jenson linked to in his post, criticized Google for failing to clarify how Gemini’s new AI technology would integrate into its existing products and enhance the user experience.

See Jenson’s full post below:

Can You Turn Off Google’s AI Overviews?

One prime example of Google’s AI overreach is the AI overviews feature, which generates summaries to directly answer search queries by ingesting information from across the web.

This controversial move has sparked legal battles, with publishers accusing Google of violating intellectual property rights and unfairly profiting from their content without permission.

Related: Google’s AI Overviews Documentation: Key SEO Insights

Turning Off AI Overviews

While Google doesn’t provide an official setting to turn off AI overviews, a viral article from Tom’s Hardware suggests using browser extensions.

Alternatively, you can configure Chrome to go directly to web search results, bypassing the AI-generated overviews.

Here are the steps:

  • Open Chrome settings by clicking the three dots in the top-right corner and selecting “Settings” from the menu.
  • In the Settings window, click on the “Search Engine” tab on the left side.
  • Under the “Search Engine” section, click “Manage search engines and site search.”
  • Scroll down to the “Site search” area and click “Add” to create a new entry.

In the new entry, enter the following details:

  • Name: Google (Web)
  • Shortcut: www.google.com
  • URL: {google:baseURL}/search?udm=14&q=%s
  • Click “Add
Screenshot from: chrome://settings/searchEngines, May 2024.

Lastly, click the three dots next to the new “Google (Web)” entry and select “Make default.”

1716224163 590 Googles AI Vision Driven By Panic Not Users Former ProductScreenshot from: chrome://settings/searchEngines, May 2024.

After following these steps, Chrome will now default to showing regular web search results instead of the AI overview summaries when you perform searches from the address bar.

Tensions Over Data Usage

The controversy surrounding AI overviews creates tension between tech companies and content creators over using online data for AI training.

Publishers argue that Google’s AI summaries could siphon website traffic, threatening independent creators’ revenue streams, which rely on search referrals.

The debate reflects the need for updated frameworks to balance innovation and fair compensation for content creators, maintaining a sustainable open internet ecosystem.


FAQ

What concerns has Scott Jenson raised about Google’s AI focus?

Scott Jenson, a former Google product manager, has expressed concerns that Google’s current AI focus is more of a “panic reaction” to stay ahead of competitors rather than addressing user needs. He critiques Google’s AI initiatives as poorly motivated and driven by a fear of letting others get ahead.

How does Scott Jenson compare Google’s AI strategy to past projects?

Jenson parallels Google’s current AI focus and the company’s response to Facebook years ago with Google+. He describes both as “hysterical reactions” driven by competition, which, in the case of Google+, resulted in a product that failed to meet its objectives.

Why are content creators concerned about Google’s AI overviews?

Content creators worry that Google’s AI overviews, which generate summaries by ingesting web content, could reduce site traffic. They argue that this practice is unfair as it uses their content without permission and impacts their revenue streams that rely on search referrals.

How can users turn off Google’s AI overviews in Chrome?

Although no official setting exists to disable AI overviews, users can use a workaround by enabling a specific Chrome setting or using a browser extension.

Here are the steps:

  • Open Chrome settings by clicking the three dots in the top-right corner and selecting “Settings” from the menu.
  • In the Settings window, click on the “Search Engine” tab on the left side.
  • Under the “Search Engine” section, click “Manage search engines and site search.”
  • Scroll down to the “Site search” area and click “Add” to create a new entry.

In the new entry, enter the following details:

    • Name: Google (Web)
    • Shortcut: www.google.com
    • URL: {google:baseURL}/search?udm=14&q=%s
    • Click “Add

This will force Chrome to skip AI-generated overviews and show the classic list of web links.


Featured Image: Sira Anamwong/Shutterstock

Source link

Keep an eye on what we are doing
Be the first to get latest updates and exclusive content straight to your email inbox.
We promise not to spam you. You can unsubscribe at any time.
Invalid email address
Continue Reading

Trending