Connect with us

SEO

What Is Largest Contentful Paint: An Easy Explanation via @sejournal, @martinibuster

Published

on

CWV ebook Chapter 5 Jun 7

Largest Contentful Paint (LCP) is a Google user experience metric that became a ranking factor in 2021.

This guide explains what LCP is and how to achieve the best scores.

What is Largest Contentful Paint?

LCP is a measurement of how long it takes for the main content of a page to download and be ready to be interacted with.

What is measured is the largest image or block of context within the user viewport. Anything that extends beyond the screen does not count.

Typical elements measured are images, video poster images, background images, and block-level text elements like paragraph tags.

Why is LCP Measured?

LCP was chosen as a key metric for the Core Web Vitals score because it accurately measures how fast a webpage can be used.

Additionally, it is easy to measure and optimize for.

Block-level Elements Used to Calculate the LCP Score

Block-level elements used for calculating the Largest Contentful Paint score can be the <main> and <section> elements, as well as the heading, div, form elements.

Advertisement

Continue Reading Below

Any block-level HTML element that contains text elements can be used, as long as it’s the largest one.

Not all elements are used. For example, the SVG and VIDEO elements are not currently used for calculating the Largest Contentful Paint.

LCP is an easy metric to understand because all you have to do is look at your webpage and determine what the largest text block or image is and then optimize it by making it smaller or removing anything that would prevent it from downloading quickly.

Because Google includes most sites in the mobile-first index, it’s best to optimize the mobile viewport first, then the desktop.

Delaying Large Elements Might Not Help

Sometimes a webpage will render in parts. A large featured image might take longer to download than the largest text block-level element.

What happens, in this case, is that a PerformanceEntry is logged for the largest text block-level element.

But when the featured image at the top of the screen loads, if that element takes up more of the user’s screen (their viewport), then another PerformanceEntry object will be reported for that image.

Advertisement

Continue Reading Below

Images Can Be Tricky for LCP Scores

Web publishers commonly upload images at their original size and then use HTML or CSS to resize the image to display at a smaller size.

The original size is what Google refers to as the “intrinsic” size of the image.

If a publisher uploads an image that’s 2048 pixels wide and 1152 pixels in height, that 2048 x 1152 height and width are considered the “intrinsic” size.

Now, if the publisher resizes the 2048 x 1152 pixel image to 640 x 360 pixels, the 640×360 size image is called the visible size.

For the purposes of calculating the image size, Google uses whichever size is smaller between the intrinsic and visible size images.

Note About Image Sizes

It’s possible to achieve a high Largest Contentful Paint score with a large intrinsic size image that is resized with HTML or CSS to be smaller.

But it’s a best practice to make the intrinsic size of the image match the visible size.

The image will download faster and your Largest Contentful Paint score will go up.

How LCP Handles Images Served from Another Domain

Images served from another domain, like from a CDN, are generally not counted in the Largest Contentful Paint calculation.

Publishers who want to have those resources be a part of the calculation need to set what’s called a Timing-Allow-Origin header.

Adding this header to your site can be tricky because if you use a wildcard (*) in the configuration, then it could open your site up to hacking events.

In order to do it properly, you would have to add a domain that’s specific to Google’s crawler in order to whitelist it so that it can see the timing information from your CDN.

So at this point, resources (like images) that are loaded from another domain (like from a CDN) will not be counted as part of the LCP calculation.

Beware These Scoring “Gotchas”

All elements that are in the user’s screen (the viewport) are used to calculate LCP. That means that images that are rendered off-screen and then shift into the layout once they are rendered may not count as part of the Largest Contentful Paint score.

Advertisement

Continue Reading Below

On the opposite end, elements that start out in the user viewport and then get pushed off-screen may be counted as part of the LCP calculation.

How to Get the LCP Score

There are two kinds of scoring tools. The first one is called Field Tools, and the second one is called Lab Tools.

Field tools are actual measurements of a site.

Lab tools give a virtual score based on a simulated crawl using algorithms that approximate Internet conditions that a typical user on a mobile phone might encounter.

How to Optimize for Largest Contentful Paint

There are three main areas to optimize (plus one more for JavaScript Frameworks):

  1. Slow servers.
  2. Render-blocking JavaScript and CSS.
  3. Slow resource load times.

A slow server can be an issue with DDOS levels of hacking and scraper traffic on a shared or VPS host. You may find relief by installing a WordPress plugin like WordFence to find out if you’re experiencing a massive onslaught and then block it.

Advertisement

Continue Reading Below

Other issues could be the misconfiguration of a dedicated server or VPS. A typical issue can be the amount of memory allotted to PHP.

Another issue could be outdated software like an old PHP version or CMS software that is outdated.

The worst-case scenario is a shared server with multiple users that are slowing down your box. In that case, moving to a better host is the answer.

Typically, applying fixes like adding caching, optimizing images, fixing render-blocking CSS and JavaScript, and pre-loading certain assets can help.

Google has a neat tip for dealing with CSS that’s not essential for rendering what the user sees:

“Remove any unused CSS entirely or move it to another stylesheet if used on a separate page of your site.

For any CSS not needed for initial rendering, use loadCSS to load files asynchronously, which leverages rel=”preload” and onload.

<link rel=”preload” href=”stylesheet.css” as=”style” onload=”this.rel=’stylesheet’”>”

Field Tools for LCP Score

Google lists three field tools:

Advertisement

Continue Reading Below

The last one – Chrome User Experience Report – requires a Google account and a Google Cloud Project. The first two are more straightforward.

Lab Tools for LCP Score

Lab measurements are simulated scores.

Google recommends the following tools:

The first two tools are provided by Google. The third tool is provided by a third party.

Citations

How to Optimize for LCP

What is LCP?

Timing Attacks and the Timing-Allow-Origin Header

Advertisement

Continue Reading Below


Featured image credit: Paulo Bobita

Searchenginejournal.com

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

WordPress Insiders Discuss WordPress Stagnation

Published

on

By

WordPress Insiders Discuss WordPress Stagnation

A recent webinar featuring WordPress executives from Automattic and Elementor, along with developers and Joost de Valk, discussed the stagnation in WordPress growth, exploring the causes and potential solutions.

Stagnation Was The Webinar Topic

The webinar, “Is WordPress’ Market share Declining? And What Should Product Businesses Do About it?” was a frank discussion about what can be done to increase the market share of new users that are choosing a web publishing platform.

Yet something that came up is that there are some areas that WordPress is doing exceptionally well so it’s not all doom and gloom. As will be seen later on, the fact that the WordPress core isn’t progressing in terms of specific technological adoption isn’t necessarily a sign that WordPress is falling behind, it’s actually a feature.

Yet there is a stagnation as mentioned at the 17:07 minute mark:

“…Basically you’re saying it’s not necessarily declining, but it’s not increasing and the energy is lagging. “

The response to the above statement acknowledged that while there are areas of growth like in the education and government sectors, the rest was “up for grabs.”

Joost de Valk spoke directly and unambiguously acknowledged the stagnation at the 18:09 minute mark:

“I agree with Noel. I think it’s stagnant.”

That said, Joost also saw opportunities with ecommerce, with the performance of WooCommerce. WooCommerce, by the way, outperformed WordPress as a whole with a 6.80% year over year growth rate, so there’s a good reason that Joost was optimistic of the ecommerce sector.

A general sense that WordPress was entering a stall however was not in dispute, as shown in remarks at the 31:45 minute mark:

“… the WordPress product market share is not decreasing, but it is stagnating…”

Facing Reality Is Productive

Humans have two ways to deal with a problem:

  1. Acknowledge the problem and seek solutions
  2. Pretend it’s not there and proceed as if everything is okay

WordPress is a publishing platform that’s loved around the world and has literally created countless jobs, careers, powered online commerce as well as helped establish new industries in developing applications that extend WordPress.

Many people have a stake in WordPress’ continued survival so any talk about WordPress entering a stall and descent phase like an airplane that reached the maximum altitude is frightening and some people would prefer to shout it down to make it go away.

Acknowledging facts and not brushing them aside is what this webinar achieved as a step toward identifying solutions. Everyone in the discussion has a stake in the continued growth of WordPress and their goal was to put it out there for the community to also get involved.

The live webinar featured:

  • Miriam Schwab, Elementor’s Head of WP Relations
  • Rich Tabor, Automattic Product Manager
  • Joost de Valk, founder of Yoast SEO
  • Co-hosts Matt Cromwell and Amber Hinds, both members of the WordPress developer community moderated the discussion.

WordPress Market Share Stagnation

The webinar acknowledged that WordPress market share, the percentage of websites online that use WordPress, was stagnating. Stagnation is a state at which something is neither moving forward nor backwards, it is simply stuck at an in between point. And that’s what was openly acknowledged and the main point of the discussion was understanding the reasons why and what could be done about it.

Statistics gathered by the HTTPArchive and published on Joost de Valk’s blog show that WordPress experienced a year over year growth of 1.85%, having spent the year growing and contracting its market share. For example, over the latest month over month period the market share dropped by -0.28%.

Crowing about the WordPress 1.85% growth rate as evidence that everything is fine is to ignore that a large percentage of new businesses and websites coming online are increasingly going to other platforms, with year over year growth rates of other platforms outpacing the rate of growth of WordPress.

Out of the top 10 Content Management Systems, only six experienced year over year (YoY) growth.

CMS YoY Growth

  1. Webflow: 25.00%
  2. Shopify: 15.61%
  3. Wix: 10.71%
  4. Squarespace: 9.04%
  5. Duda: 8.89%
  6. WordPress: 1.85%

Why Stagnation Is A Problem

An important point made in the webinar is that stagnation can have a negative trickle-down effect on the business ecosystem by reducing growth opportunities and customer acquisition. If fewer of the new businesses coming online are opting in for WordPress are clients that will never come looking for a theme, plugin, development or SEO service.

It was noted at the 4:18 minute mark by Joost de Valk:

“…when you’re investing and when you’re building a product in the WordPress space, the market share or whether WordPress is growing or not has a deep impact on how easy it is to well to get people to, to buy the software that you want to sell them.”

Perception Of Innovation

One of the potential reasons for the struggle to achieve significant growth is the perception of a lack of innovation, pointed out at the 16:51 minute mark that there’s still no integration with popular technologies like Next JS, an open-source web development platform that is optimized for fast rollout of scalable and search-friendly websites.

It was observed at the 16:51 minute mark:

“…and still today we have no integration with next JS or anything like that…”

Someone else agreed but also expressed at the 41:52 minute mark, that the lack of innovation in the WordPress core can also be seen as a deliberate effort to make WordPress extensible so that if users find a gap a developer can step in and make a plugin to make WordPress be whatever users and developers want it to be.

“It’s not trying to be everything for everyone because it’s extensible. So if WordPress has a… let’s say a weakness for a particular segment or could be doing better in some way. Then you can come along and develop a plug in for it and that is one of the beautiful things about WordPress.”

Is Improved Marketing A Solution

One of the things that was identified as an area of improvement is marketing. They didn’t say it would solve all problems. It was simply noted that competitors are actively advertising and promoting but WordPress is by comparison not really proactively there. I think to extend that idea, which wasn’t expressed in the webinar, is to consider that if WordPress isn’t out there putting out a positive marketing message then the only thing consumers might be exposed to is the daily news of another vulnerability.

Someone commented in the 16:21 minute mark:

“I’m missing the excitement of WordPress and I’m not feeling that in the market. …I think a lot of that is around the product marketing and how we repackage WordPress for certain verticals because this one-size-fits-all means that in every single vertical we’re being displaced by campaigns that have paid or, you know, have received a a certain amount of funding and can go after us, right?”

This idea of marketing being a shortcoming of WordPress was raised earlier in the webinar at the 18:27 minute mark where it was acknowledged that growth was in some respects driven by the WordPress ecosystem with associated products like Elementor driving the growth in adoption of WordPress by new businesses.

They said:

“…the only logical conclusion is that the fact that marketing of WordPress itself is has actually always been a pain point, is now starting to actually hurt us.”

Future Of WordPress

This webinar is important because it features the voices of people who are actively involved at every level of WordPress, from development, marketing, accessibility, WordPress security, to plugin development. These are insiders with a deep interest in the continued evolution of WordPress as a viable platform for getting online.

The fact that they’re talking about the stagnation of WordPress should be of concern to everybody and that they are talking about solutions shows that the WordPress community is not in denial but is directly confronting situations, which is how a thriving ecosystem should be responding.

Watch the webinar:

Is WordPress’ Market share Declining? And What Should Product Businesses Do About it?

Featured Image by Shutterstock/Krakenimages.com

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 New Support For AVIF Images May Boost SEO

Published

on

By

Google's New Support For AVIF Images May Boost SEO

Google announced that images in the AVIF file format will now be eligible to be shown in Google Search and Google Images, including all platforms that surface Google Search data. AVIF will dramatically lower image sizes and improve Core Web Vitals scores, particularly Largest Contentful Paint.

How AVIF Can Improve SEO

Getting pages crawled and indexed are the first step of effective SEO. Anything that lowers file size and speeds up web page rendering will help search crawlers get to the content faster and improve the amount of pages crawled.

Google’s crawl budget documentation recommends increasing the speeds of page loading and rendering as a way to avoid receiving “Hostload exceeded” warnings.

It also says that faster loading times enables Googlebot to crawl more pages:

Improve your site’s crawl efficiency

Increase your page loading speed
Google’s crawling is limited by bandwidth, time, and availability of Googlebot instances. If your server responds to requests quicker, we might be able to crawl more pages on your site.

What Is AVIF?

AVIF (AVI Image File Format) is a next generation open source image file format that combines the best of JPEG, PNG, and GIF image file formats but in a more compressed format for smaller image files (by 50% for JPEG format).

AVIF supports transparency like PNG and photographic images like JPEG does but does but with a higher level of dynamic range, deeper blacks, and better compression (meaning smaller file sizes). AVIF even supports animation like GIF does.

AVIF Versus WebP

AVIF is generally a better file format than WebP in terms of smaller files size (compression) and image quality.  WebP is better for lossless images, where maintaining high quality regardless of file size is more important. But for everyday web usage, AVIF is the better choice.

See also: 12 Important Image SEO Tips You Need To Know

Is AVIF Supported?

AVIF is currently supported by Chrome, Edge, Firefox, Opera, and Safari browsers. Not all content management systems support AVIF. However, both WordPress and Joomla support AVIF. In terms of CDN, Cloudflare also already supports AVIF.

I couldn’t at this time ascertain whether Bing supports AVIF files and will update this article once I find out.

Current website usage of AVIF stands at 0.2% but now that it’s available to surfaced in Google Search, expect that percentage to grow. AVIF images will probably become a standard image format because of its high compression will help sites perform far better than they currently do with JPEG and PNG formats.

Research conducted in July 2024 by Joost de Valk (founder of Yoast, ) discovered that social media platforms don’t all support AVIF files. He found that LinkedIn, Mastodon, Slack, and Twitter/X do not currently support AVIF but that Facebook, Pinterest, Threads and WhatsApp do support it.

AVIF Images Are Automatically Indexable By Google

According to Google’s announcement there is nothing special that needs to be done to make AVIF image files indexable.

“Over the recent years, AVIF has become one of the most commonly used image formats on the web. We’re happy to announce that AVIF is now a supported file type in Google Search, for Google Images as well as any place that uses images in Google Search. You don’t need to do anything special to have your AVIF files indexed by Google.”

Read Google’s announcement:

Supporting AVIF in Google Search

Featured Image by Shutterstock/Cast Of Thousands

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

CMOs Called Out For Reliance On AI Content For SEO

Published

on

By

CMOs Called Out For Reliance On AI Content For SEO

Eli Schwartz, Author of Product-Led SEO, started a discussion on LinkedIn about there being too many CMOs (Chief Marketing Officers) who believe that AI written content is an SEO strategy. He predicted that there will be reckoning on the way after their strategies end in failure.

This is what Eli had to say:

“Too many CMOs think that AI-written content is an SEO strategy that will replace actual SEO.

This mistake is going to lead to an explosion in demand for SEO strategists to help them fix their traffic when they find out they might have been wrong.”

Everyone in the discussion, which received 54 comments, strongly agreed with Eli, except for one guy.

What Is Google’s Policy On AI Generated Content?

Google’s policy hasn’t changed although they did update their guidance and spam policies on March 5, 2024 at the same time as the rollout of the March 2024 Core Algorithm Update. Many publishers who used AI to create content subsequently reported losing rankings.

Yet it’s not said that using AI is enough to merit poor rankings, it’s content that is created for ranking purposes.

Google wrote these guidelines specifically for autogenerated content, including AI generated content (Wayback machine copy dated March 6, 2024)

“Our long-standing spam policy has been that use of automation, including generative AI, is spam if the primary purpose is manipulating ranking in Search results. The updated policy is in the same spirit of our previous policy and based on the same principle. It’s been expanded to account for more sophisticated scaled content creation methods where it isn’t always clear whether low quality content was created purely through automation.

Our new policy is meant to help people focus more clearly on the idea that producing content at scale is abusive if done for the purpose of manipulating search rankings and that this applies whether automation or humans are involved.”

Many in Eli’s discussion were in agreement that reliance on AI by some organizations may come to haunt them, except for that one guy in the discussion

Read the discussion on LinkedIn:

Too many CMOs think that AI-written content is an SEO strategy that will replace actual SEO

Featured Image by Shutterstock/Cast Of Thousands

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