Author: Nick Schäferhoff

If you want to rank well in search engines, links, specifically backlinks, are essential. They signal to Google and other search engines that others like your content and endorse it.

Besides content, they are the most important ranking factor that Google considers. The search engine uses links to gauge the relevancy of you pages for different topics and also to discover new pages to index.

Usually, Google is not super forthcoming about their algorithm and how exactly they judge websites, however, they recently published a guide for link building best practices. The earlier version only contained information about how to make sure your links are crawlable. However, the new edition also talks about making sure your links are understandable and relevant.

To make it easier for you to know what that means for your website, we have gone through the guide and summarized the most important points for you below. That way, you can get all the crucial information with examples and some extra explanations without having to do the work yourself.

1. Ensure Crawlability By Using the Right Format

This is what the original document was mainly about. For this topic, the guide says to only provide links in the form of HTML anchor tags with an href attribute. In case you don’t know that looks like, here’s an example:

<a href="https://yoursite.com">anchor text</a>

In HTML an <a> element creates a link and is called anchor tag. The href attribute defines where the link points to and the part between <a> and </a> (the opening and closing anchor tag) is called anchor text. This will become relevant soon.

For now, the important part to understand is that this is the format the Google prefers. It does not crawl links in most other styles, e.g. links created with JavaScript.

2. Anchor Text: Make It Clear and Relevant

If you are still not sure about what exactly anchor text is (because you don’t know HTML), think of it as the part of text in your content that gets highlighted when you add a link to it.

This, too, has relevance for helping Google understand what your content and the pages you link to are about.

One of the best practices Google talks about in their link guide is to use rich anchor text. That means, people and search engine should be able to guess what you are linking to from looking at the link itself.

For example, here is a bad link:

<a href="https://yoursite.com></a>

This link does not provide any information about what you might find at yoursite.com. On the other hand, here is a link with good anchor text:

<a href="https://yoursite.com/seo-services>Our SEO services</a>

Immediately, you have an idea where a click on this link would lead you, don’t you? This is both good for your visitors’ user experience and so the Google crawler can figure out the topic of the link target.

If, for some reason, you can’t add anchor text, at least provide a title attribute:

<a href="https://yoursite.com/seo-services" title="seo services page"></a> 

According to Google’s document, the search engine is also able to understand that.

For images that link elsewhere, and also generally for image SEO, be sure to include descriptive ALT tags with information what the visual contains, like so:

<a href="/seo-services.html"><img src="service-page-call-to-action-banner.jpg" alt="a banner image leading to the seo services page"/></a> 

How to Write Good Anchor Text

Ok, so your links should contain anchor text. So far so good. But what exactly does Google consider good anchor text?

Well, besides being descriptive, the search engine asks it to be concise and relevant to both the page the link is on and the one it links to. That means, avoid generic text like “read more” or “click here”. Instead, make sure the link itself provides enough context for anyone coming across it:

• Are you trying to rank better in Google? Get in touch with us about our link building services.

One of the best practices the Google guide gives is to try and read the link out of context and think whether you would still be able to understand what it links to without the surrounding text.

In addition, use natural, precise language. That means, don’t keyword stuff your anchor text or you’ll get penalized. Google has enough technology (see BERT, RankBrain) to understand proper language these days. Simply keep the reader in mind and what kind of information they would need to decide if a link is interesting to them or not.

At the same time, don’t make your links too long, focus on what is most relevant.

• So, if you want to learn more about our SEO services including site audits, on-page optimization, link building, and performance improvements, get in touch!

Remember the part about being concise? The link above is too descriptive, a better solution would be this:

• So, if you want to learn more about our SEO services including site audits, on-page optimization, link building, and performance improvements, get in touch!

So, what’s the right number of words to use in your anchor text? A good goal is to shoot for between two and five words. This allows you to find a good balance between brevity and sufficient detail.

3. Space Out Your Links

Another guideline that Google’s document on linking best practices contains is to provide enough space between individual links on your pages. Avoid having many of them in a row in the same sentence.

• We offer a wide range of SEO services, including on-page SEO, link building, site optimization, keyword research, and more.

Instead, be sure to place at least a few words or sentences in between. Here is a better example:

• We offer a wide range of SEO services. We can help you with on-page SEO to improve your search performance. Link building is also part of our service. In addition, we do keyword research as well as site optimization.

4. Use Both Internal and External Links

Google uses both internal links (to pages on your own site) and external ones (links to other websites) to understand what your page is about and should rank for. Therefore, they want you to use both kinds.

External links are also not something that takes away value from your own website. In fact, they can make it more valuable by establishing trustworthiness, such as when you use them to cite your sources.

Exceptions are links that you have been paid for. You should mark those with the sponsored or nofollow attribute. Also use nofollow when linking to pages you don’t trust or don’t want to endorse. However, avoid using them for all external links on your site, that’s not in accordance to Google link best practices.

As for internal links, all your important pages should have at least one link pointing to them. This is necessary for Google to even be able to discover them naturally. In addition, use internal links to provide additional relevant resources for the page that your visitors are on.

What’s more, be sure to follow the same practices as discussed above and include descriptive and relevant anchor text and don’t overdo it with linking. While there is no right or wrong number of internal links on a page, keep it so they don’t detract from the content and make it hard to read.

If you are not sure how to best do this, check our article on internal linking strategy (notice the anchor text?). That way, both Google and your visitors can understand better what the rest of your website is about.

In a Nutshell: Google Link Best Practices

Google is not always forthcoming when it comes to information how to better optimize your web pages. However, in their new guide on best practices for links, they provide some concrete information how they would like you to use links. Let’s summarize the main points once more:

1. Use HTML anchor tags to ensure crawlability
2. Make your anchor texts rich, meaning informative and relevant
3. Be precise and don’t keyword stuff anchor text
4. Space out links to ensure readability
5. Include both internal and external links, the same rules apply to each of them

Follow the above to provide Google with all the information it needs to better understand what your pages and links are about. Besides that, follow general best practices for linking, especially making sure that what you link to is high-quality content and relevant to what you are talking about.

What’s the most surprising lesson you have learned from Google’s new link guidelines? Let us know in the comments below!

The post Google Link Best Practices Guide: What It Means for Your SEO appeared first on Torque.

AI continues to dominate the headlines. Everyone is wondering how it will change the way we live and do things, including if it will replace us all. One area where it is relevant especially for website owners and online marketers to examine the impact that generative AI will have is search and SEO.

Since search engines and websites are both in the business of answering users’ search for information, it makes sense to ask if artificial intelligence will take over their job as well. In the future, if someone wants to know the birthplace of Leonardo da Vinci or how to cook a three-course gluten-free menu, won’t they just type it into ChatGPT?

To answer this and many other questions, in this post we will take a deep dive into the topic of AI in search and SEO. We will look at why artificial intelligence will likely have an impact in those areas and predict concrete ways the technology will change how we do online search and optimize our websites.

Why Would AI Impact Search and SEO?

If you haven’t been paying attention too much to this topic, you might be asking yourself how artificial intelligence and search engines are even related. Why would one affect the other?

Considerable Service Overlap

As already alluded to in the introduction, artificial intelligence and search engines intersect in major ways in what they do. Two of their main functions are answering questions and delivering information. Only that generative AI is arguably way better at it.

Think about it. When you enter a query into a search engine such as Google, it shows you the usual blue links and other SERP elements with content that relates to your query.

Depending on your question or the information you are looking for, you might even find it already answered in the results themselves.

However, especially when trying to learn more complex things, you often have to go through one or several web pages before you find all the information you’ve been looking for.

Generative AI like ChatGPT, on the other hand, directly delivers exactly the information you requested and only that.

(It also doesn’t tell you long-winded stories before giving you a recipe in order to please the Google algorithm.)

In addition, if you have follow up questions or need clarifications, you can pose those right away and have them delivered to you as well — all in the form of a conversation. It’s basically a shortcut to finding out what you want.

On Opposite Ends of the Content Equation

In addition, generative AI also dabbles in one of the other main areas that Google is interested in: content. We all know that content is one of the main ways Google ranks web pages, which is why content marketing has been one of the go-to techniques for building traffic for websites for a long time.

Content creation is also one of the main ways that humans are currently using AI. ChatGPT and other large language models (LLMs) are able to string words together and create written content faster than humans.

Therefore, it’s not unreasonable to expect a flood of new AI-written content to hit the web, creating more work for search engines to index and additional competition for those who wish to rank in them. In some corners of the Internet, the fear is that this could greatly dilute the quality of search results.

Is AI the End of Search Engines and Organic Traffic?

Understandably, many of those who depend on Google and other search engines for their website traffic look at this development with skepticism. It seems that both of of generative AI’s main functions have potentially the same outcome: less traffic from organic search for websites. That’s both because fewer people will use search engines and because they will have a harder time not drowning in the amount of content out there.

And there are good reasons to think that:

• Paul Buchheit, the creator of Gmail, predicted on Twitter that ChatGPT will completely disrupt Google’s main business within two years.
• When Google introduced its own AI assistant, Bard, its stock fell by seven percent (a cool $100 billion). Granted, this was mostly because the AI gave a wrong answer but it did not seem like a good sign at the time.

And it is a valid question how Google will adapt to the change. 80 percent of its revenue comes from its ad business and a large part of that from search results. It’s also not that they don’t know how to build AI, they have been working on it for years.

Their problem seems to be more about how to monetize AI and integrate it into their existing business model. If there is no more need to visit search results, how will they continue to make money? That currently seems to be the biggest impact AI has on the search engine.

These Kinds of Predictions Aren’t New

On the other hand, predictions for the end of Google and other search engines aren’t something we haven’t heard before.

• When Alexa, Siri, and other voice activated assistance came out, some people predicted their ability to directly answer user questions would greatly impact the traffic that Google and other websites receive. As we know now, that didn’t happen.
• When Google started answering questions directly in the search results, resulting in more zero-click searches, there were fears that it would stop sending actual traffic to websites, making them obsolete. That didn’t happen either.

Sure, both of these technologies have had an impact on how much traffic goes to websites from search. That’s especially true for those specialized in answering simple questions. However, the reality is also that Google keeps sending billions of visitors to websites every day.

In addition, in the past, the rise of new technologies simply changed the way we search instead of doing away with it. See voice search from virtual assistants, people adapted to that by doing voice SEO.

Finally, one of the the strongest arguments that the Googlepocalypse isn’t upon us right this moment is that Google’s market share remains flat. And that’s even though ChatGPT has been around for a while now.

The Future of Search and SEO With AI

However, even though the changes we are seeing might not be as drastic as some predict, it is unlikely that the emergence of generative AI will have no impact on search engines at all. So, to get a better understanding of what to expect, here are some predictions for what will change with the rise of AI.

1. Search Engines Will Offer Their Own Generative AI

One way that AI will have an impact on online search is that it will increasingly integrate with it. Microsoft, the owner of the Bing search engine, is not only one of the biggest investors into OpenAI, the company behind ChatGPT, but is already offering generative AI in their search (the downside is, you have to use the Edge browser to use it).

Plus, as mentioned above, Google recently announced their own thing, called Search Generative Experience.

In addition, the Chinese search engine is Baidu apparently working on a ChatGPT competitor of their own. So, one change we can expect to search from AI is that we will interact with it on search pages.

It’s also important to note, however, that AI in search is not a new thing. Google has been using RankBrain for years in delivering search results. What’s going to be new is that AI is going to be front and center and you will directly interact with it instead of it just running in the background.

2. Easily-Answered Content Will Perform Worse

The writing’s been on the wall for quite a while but if your website only contains content about questions that are easily and quickly answered, it probably won’t survive the age of AI. There are fewer and fewer reasons for people to visit these types of websites. We can already see that with zero-click searches and Google answering questions directly in the SERPs.

This isn’t going to get any better with generative AI. Both standalone AI products and AI in search engines will answer these kinds of questions with ease. Therefore, purely informational content geared at answering singular questions is probably not a good long-term strategy for building website traffic.

Of course, you can include this type of information in your content for context and additional value. However, as standalone content it’s not really a good option and will become less so over time.

3. Quality, Above All, Remains King

Yes, generative AI makes it easier to generate content. Yes, that means we will likely see an influx of new content on the web, meaning more competition for keywords. However, for a while now, ranking hasn’t been about content quantity but quality.

Google is already pretty good at filtering out the noise and delivering quality content to its users. That means, if you want to rank well, you have to continue to create high-quality and relevant content. That also includes the usual suspects like E-A-T, structured data, and other quality markers.

Whether you use ChatGPT to do so or not doesn’t matter. What matters is the end result, if it delivers what users want and are happy to link to.

This isn’t very different from the way it has been for a while. Only the bottom has been raised now that ChatGPT allows people to write “original” articles who would otherwise simply have scraped and plagiarized existing content. To paraphrase an expert panel of copywriters I recently watched, “you are only in trouble if you were already creating content that is worse than what ChatGPT can do.”

4. Generative AI Results Will Continue to Struggle With Credibility

The problem with AI content is the extra work you need to spend on fact checking. Currently, ChatGPT does not have access to the Internet. It is relying on its training data for answers, which only goes until October 2021 at this point. After that, it doesn’t have any knowledge of current affairs.

Why don’t its makers keep it up to date? Because training it is a cost and labor-intensive endeavor and can’t be done all the time. Therefore, ChatGPT is an unreliable source of knowledge for certain information.

Apart from that, generative AI generally has a bit of a problem with delivering false information. For example, OpenAI’s flagship has been found to simply make up citations.

You also need to keep in mind that AI’s answers are highly dependent on the data it has been fed. That’s its entire horizon, it can not do additional research in order to check its statements for truth. Therefore, any biases or factual errors in the training data will be part of the output.

Finally, there is the problem of plagiarism. We don’t know where AI is getting its information from and if it’s inadvertently stealing the content elsewhere. So, until that is fixed, you still need to rely on other sources of information and fact checking before AI assistants can fully replace search engines or create flawless content. Seeing as search engines still struggle with showing irrelevant or false information, it’s probably something that won’t fully go away.

5. Originality Becomes a Big Plus

Something that’s important to keep in mind is that AI tools don’t have their own knowledge base. Instead, they get trained on content that already exists and can base their responses only on that.

As consequence, by definition, these tools can only rewrite what is already out there. They are incapable of original thought, doing their own research, or other creative tasks. Therefore, originality is always something you can use to your advantage.

That’s doubly so because of what we talked about earlier about AI training data. Because of the costs and effort involved, it’s likely going to be real-time data, at least not for a while. Therefore, if you can conduct and publish original research, it will remain exclusive to your site for quite a bit.

Again, this is not anything new. It has been relevant since E-A-T and will likely continue to be with AI in the mix.

6. Content Promotion Remains Key

Another thing to keep in mind is that content creation is just one part of the equation. Promoting your content and getting it in front of people. While organic search is the main traffic source for many websites, it’s not the only basket you should put your eggs into.

Already pre-AI, you needed a content promotion strategy to earn links and get the word out. This is not going to change with artificial intelligence in the mix.

However, what might grow in importance is platform diversity. As can you see in the Google video above, search engines of the future pull content from a lot of different sources including TikTok and YouTube. Therefore, it’s a good idea to branch out to different formats for better visibility and engagement.

What will also become an interesting question is how to get AI to use your content for their answers and possible citations. That’s very hard to answer at this point and really depends on how LLMs will evolve. In the future, they will likely become just another source of traffic that you need to try and optimize for.

7. AI Will Help With SEO

On the content end, we likely to not only see artificial intelligence on the side of search engines but also those who wish to rank in them. AI has the potential to take over many tasks related to search engine optimization. There was actually an interesting discussions at WordCamp Europe 2023 on that topic (the video below starts at the right time for it).

Tools like SEMrush already use artificial intelligence for keyword research, competitor analysis, and other SEO measures. However, it can also help with content optimization, do grunt work like filling in image ALT tags, and provide proofreading.

In addition, AI can help create visuals, including charts and graphs, to further improve the content. What’s more, in the future we will likely use AI to better understand our analytics, spot trends, and analyze user behavior and search intent. Google Analytics 4 already has some machine learning capabilities built in for that.

Finally, AI could help improve overall user experience by analyzing your site and making recommendations for how to improve it.

8. Vertical Search Will Become a Thing

One way to address the shortcomings that generative AI still demonstrates as a search tool is to use it in a more targeted fashion. That means training models in datasets for specific topics and topical areas.

This is called vertical search because it is deep rather than broad. It makes it easier to select the right sources and keep bias out of the knowledge base because of the more limited set of information. You can also more easily adhere to things like copyright, privacy laws, and other regulations.

Areas that are highly suitable for these kinds of AI assistants is medical research, finance, or even coding and development. So, while generative AI might not replace Google anytime soon, you can expect specific AI-powered search tools that are limited but highly knowledgeable in certain areas.

How Do You Think Generaitve AI Will Impact Search and SEO?

The effect of generative AI on search and SEO is hard to predict with absolute certainty. We are only at the beginning of the development. AI has only recently hit the world stage, so we don’t know where we are going from here.

Like other technologies before, it’s unlikely to eliminate search engines and leave websites without traffic. More likely, it will change the way we search online and website owners will need to find new ways to optimize their sites for that.

With search engines integrating with AI, certain types of content will likely die out. Back in the day, it was keyword-stuffed articles, now it will be content whose information can simply be answered directly. What stays the same is need for quality and fulfilling the needs of your audience in order to stand out.

Then, you have to have a solid promotion and marketing plan in place. The good news is that you will also have more and more AI tools at your disposal to help you create and execute it. And this is only the beginning. There are probably a number of other ways AI will impact search and SEO that we don’t even know yet.

What’s your prediction for the changes that artificial intelligence will bring to the areas of search and SEO? Please share your insights below!

The post 8 Ways Generative AI Will Have an Impact on Search and SEO appeared first on Torque.

With this chapter on Cumulative Layout Shift, we are nearing the end of our miniseries on Core Web Vitals for WordPress users. In the earlier chapters on Largest Contentful Paint and First Input Delay, we already talked about what exactly those terms mean and how to optimize your website for each of them. Now, we want to do the same for CLS.

In the following, we cover what exactly Cumulative Layout Shift is, how it’s calculated, how to test your website for its performance in this area, and what’s a good value to aim for. After that, we give you step-by-step instructions for tackling any CLS problems that might exist on your WordPress site to improve upon them.

When finished, together with the other two posts in this series, we hope that you feel ready to make your website fit for Google’s stamp of approval.

What is the Meaning of Cumulative Layout Shift?

As usual, let’s start off with a definition. In one sentence, CLS measures when something changes on a web page that causes the elements on it to move (or shift if you will) without a user interaction.

It can be that a form or an ad in the article you are reading loads late and moves down the paragraph you are reading so you have to scroll to find your place again. Or worse, it changes the position of a button or link at an inopportune moment so you end up clicking something you didn’t want to.

Consequently, it can be anything from mildly annoying to outright infuriating. Cumulative Layout Shift is the metric that captures this behavior in order to understand the problem so you can correct it.

Why Is It Important?

A jumpy website completely disrupts what you are currently doing and might even have annoying real-life consequences. As you can imagine, that’s really bad for user experience and can cause visitors to leave. This is especially true on smartphones where, due to the screen size, small shifts have a bigger impact than on desktop machines.

Because it’s so disruptive, Google puts a lot of focus on this metric, making it one of the core values that it judges websites by. So, if you want to please both your visitors and the people (I mean, robots) that decide where you appear in search results, do your best to eliminate Cumulative Layout Shift on your website.

What Causes CLS?

The cause of shifting website elements is usually because a web page’s files load at different speeds. Another factor are page elements that are added dynamically during or after page load. Typical examples include:

• Visuals like images or videos without correctly defined dimensions
• Third-party content like ads, banners, embeds, or iframes
• Web fonts that are smaller or bigger than the initially shown fallback fonts

Another source of CLS can be conflicting CSS and JavaScript markup. When they block each other, it stalls the loading process of web pages.

How Is Cumulative Layout Shift Calculated?

In contrast to its predecessors, the calculation of Cumulative Layout Shift is a bit more complicated. To understand it, we need to settle on some terms first:

• Layout shift — That’s when an element already visible on the page moves from its starting position after already being rendered. These kinds of elements are called unstable elements (creative, I know).
• Expected vs unexpected layout shifts — Layout shifts are only negative if the user isn’t expecting them. There are also layout shifts that are expected and welcomed, such as after an interaction with a web page (e.g. submitting a form). CSS animations and transitions are other examples for expected layout shifts. To account for that, CLS considers all layout shifts that happen within 500ms of a user interaction to be expected.
• Impact fraction — The percentage of the viewport (the visible part of the website on screen) that a moving element impacts as decimal number (e.g. 0.5 if it impacts 50% of the screen).
• Distance fraction — Distance as the percentage of the screen that an unstable element moves during a shift. Also given as a decimal number.
• Layout shift score — This is calculated by multiplying the impact fraction with the distance fraction (e.g. 0.4 x 0.15 = 0.06). As a consequence, large elements that move a large distance result in a higher score than small elements moving a short distance.

CLS captures the largest occurrence of unexpected layout shift scores during a five-second interval. Obviously, lower is better.

In the end, you don’t really need to know the specifics. All you need to know is how to measure CLS and what value your site should strive for.

What is a Good Layout Shift Score?

A good score is to have a CLS value of 0.1 or less. Up to 0.25 needs improvement, anything above that is bad and will likely result in reduced search performance.

How to Test Cumulative Layout Shift

In order to be able to improve the CLS score on your website, you first need to know where you stand. It’s difficult to know if it even happens, because web pages don’t always behave the same way on different devices. Therefore, you may not see it on a development site but visitors can still encounter it. For that reason, it’s best to test it.

There are several ways to check if Cumulative Layout Shift is a problem on your WordPress site. They are pretty much the same as for the other Core Web Vitals metrics. Your first port of call should always be PageSpeed Insights, which shows the metric on its results page.

Note that it uses both lab results as well as real-life data from the Chrome User Experience Report. It even shows images of the layout shifts and the source element. That way, you have a better idea what the problem is and where it occurs.

Additionally, PageSpeed Insights gives you the ratio of how much each element contributes to the CLS score. This allows you to prioritize what has the biggest negative impact.

Aside from that, you can also use the following:

• The Core Web Vitals report inside Google Search Console
• Chrome browser developer tools
• Lighthouse
• web-vitals JavaScript library

There is also a Chrome extension called CLS Visualizer. It highlights shifting elements on your web pages. For Firefox, try SpeedVitals.

How to Reduce Cumulative Layout Shift on Your WordPress Site

If you notice that CLS is a problem on your WordPress site, you probably want to fix it. This is what the rest of this article is all about.

Provide Media Dimensions

A lot of solutions already become clear when you have a look at the causes Cumulative Layout Shift above. As mentioned, one common culprit of CLS are images and other media without defined width and height values. Without fixed dimensions, the browser doesn’t know how much space to reserve for them. That’s especially true for media appear on the page later, such as in lazy loading.

Unfortunately, it’s common practice of responsive design to not give specific image dimensions. Most often, images are set to width or max-width: 100%; and height: auto;. Then it’s up to the browser to figure out what the actual dimensions are when it downloads the image.

In the past, that often led to exactly the type of behavior we are trying to avoid. Images suddenly popped into existence, moving everything else around. Therefore, you should always provide dimensions for your visuals or at least a CSS aspect ratio.

Fortunately, if you are using WordPress, your website automatically sets image dimensions. Therefore, the problem usually does not come into play.

If that is not the case for a specific image, you can correct this in the Gutenberg editor.

Dealing With Ads, Embeds, and Similar Content

Third-party content loaded into pages is often one of the biggest sources of CLS. These are cases where you are not necessarily in control of the size of the end product. Nor do its publishers know in advance how much space is available on the site it appears on. Therefore, you need to declare its size the same way as for images.

Fortunately again for WordPress users, when using the Gutenberg editor to auto-embed content from social networks, video portals, or similar vendors into your content, the editor automatically adds appropriate width and height declarations.

That way, even if the content takes longer to load than rest of the page, it already has its correct size reserved. As a consequence, the layout doesn’t shift around when it appears.

For other types of content that you add manually, be sure to add width and height by hand. If you don’t know the exact height that an ad or other element will take, at least add a min-height property to it. That still allows for larger elements but reserves some space and can eliminate or at least reduce CLS on the page.

Another technique to minimize Cumulative Layout Shift in WordPress for third-party content is to avoid placing it high on the page. The higher up it is, the more content below it can push down, and the higher your CLS score. Therefore, if you can, place it in the middle or bottom.

Optimize Dynamic Content

Dynamic content are page elements that gets added to a page after it has already been loaded. The example before were lazy loaded images but it typically also includes stuff like banners, forms, or even related products that show up on scroll.

Naturally, if you don’t properly plan for those, it can also leads to layout shifts. Here are some ways to avoid that:

• Reserve space beforehand — Similar to the above, if you have a container with a fixed size that you can load the content into, it keeps the layout steady even if it comes in later. A fixed container can also be a carousel or something similar.
• Connect it with a user interaction — If content loads dynamically after a user action, it carries no penalty for CLS, even if the layout shifts. Keep in mind the 500ms cutoff though.
• Load content off screen — If you load content outside of the viewport and then provide the user with a notice that it’s available and an option to scroll to it, there is also no CLS. Social media platforms like to do that for new updates.

Improve Web Font Handling

Web fonts can also cause layout shift. The two common forms are that you either see unstyled text first before the web font comes in (Flash of Unstyled Text or FOUT) or see no text at all at first and then it comes in together with the web font (Flash of Invisible Text or FOIT).

Both can lead to layout shifts and here is what you can do about it:

• Use the right font format — If you load custom fonts into your WordPress website, be sure to use the WOFF2 or WOFF format. Those have the smallest footprint, load the fastest, and help avoid the problems above.
• Use the right fallback font — If you are using a fallback font that is very dissimilar to your actual font, the moment the switch happens will likely to lead to layout movement. You can avoid that by using a fallout font that is close to the end product. The Font Style Matcher can help you find one.
• Preload fonts — Place web font resources early in the document and add rel=preload to them. That way, browsers will prioritize them.

It also helps to host fonts locally or at least use a CDN to make them available to users as fast as possible. That way, you reduce the likelihood of switching fonts late during load and causing layout shifts.

Don’t Let Cumulative Layout Shift Throw Off Your WordPress Site

Cumulative Layout Shift is one of three metrics that Google regards as vital and the last one in this in-depth series. It’s an important indicator for user experience as it measures the stability of page layout during and even after loading.

Like the other metrics in Core Web Vitals, it not only matters to users but also counts toward search ranking and is therefore important for the success of your website.

By now, you know what it is, how it is calculated, what’s causing it, and how to test and deal with it. May your layout forever be solid, my friend.

Do you have additional tips for how to prevent Cumulative Layout Shift in WordPress? Let us know in the comments below!

The post Cumulative Layout Shift (CLS) in WordPress: How to Eliminate It appeared first on Torque.