For several years, the set of factors against which the Google search engine and its algorithms evaluate websites has been systematically expanding. Google developers, who are constantly developing the algorithm, increasingly emphasize that the importance of optimizing websites in terms of user experience. They also confirmed this in their blog that there will be another key ranking factor in 2021. It is Page Experience (one of the elements of User Experience). What aspects of website operation does this indicator cover and how to work on it in order to look good in the eyes of users and search engine robots?
What is Page Experience – “old” and “new” ranking factors
Page Experience is a set of indicators used by Google algorithms to evaluate the perception of a given page by users and the experience it causes. However, it does not concern the information layer or the content available on the website, but the technical aspects and the way the website works.
Page Experience is not as new a ranking factor as you might think. For several years, users’ experiences have an impact on the website’s position in search results. The plans of the owners of Google assume, however, to improve and extend the Page Experience with new elements. A few years ago, the Page Experience included: –
website loading speed on desktop devices (from 2010),
– page loading speed on mobile devices (from 2018),
– the appearance of pages on mobile devices.
Currently, websites are more and more complex (e.g. due to the use of JavaScript language to create them), they contain graphics, videos and animations, which does not have a positive effect on the loading speed. Lots of people will skip seeing a page if it takes too long to load. We expect information almost immediately. What’s more, over time it turned out that page loading speed is only one of the elements that influences the user’s feelings and experiences in the process of interacting with the website. Therefore, the Page Experience factor has been extended to:
– comprehensive adaptation to mobile devices (the website is responsive or contains a separate, mobile version, and the size of individual elements
– content, graphics, buttons – is adjusted to the screen size); to check if your website is mobile friendly you can do a quick Mobile Friendly test,
– having a secure SSL certificate (HTTPS protocol),
– no aggressive ads (so-called pop up ads – pop-up windows) that cover the content of the page, – care for safety and the absence of viruses and malware penetrating users’ devices.
Google has announced that in 2021 there will be more Page Experience elements, known as Core Web Vitals. Among them, 3 factors have been distinguished that will affect the search results. Google’s authorities have announced that the change of algorithms will be announced at least 6 months in advance and that tools will be made available to help adapt the site to it. How will Core Web Vitals evaluate the site and will they significantly change the position of individual pages? How to prepare for the announced update and optimize the website for Page Experience and Core Web Vitals?
What are Core Web Vitals?
Core Web Vitals (basic internet indicators) are defined by Google as a set of key indicators verifying the usability of the website in real time, which are to improve the user experience and affect the user experience. Core Web Vitals from 2021 will cover such aspects as:
– page loading,
– website interactivity,
– visual stability.
Google announces that it will constantly expand Core Web Vitals with new factors. The goal is to build website functionality with a focus on users and provide them with fast and satisfactory interaction with the website. The internet as a whole is to be increasingly helpful and useful. From 2021, Core Web Vitals will include:
– Largest Contentful Paint (LCP) – loading; this factor verifies the time needed to load the largest element on the page (content, graphics, video) – it should be less than 2.5 seconds;
– First Input Delay (FID) – interactivity; the indicator measures the website’s response time to the user’s action, i.e. the one that will elapse from the moment the link is clicked to the moment when the browser responds to the action, it is functional and can be used; it should not exceed 100 milliseconds;
– Cumulation Layout Shift (CLS) – visual stability; measures the loading time of the page until the final placement of elements, as well as the frequency with which users experience unexpected visual changes to the layout on the page; this ratio should be less than 0.1. Its purpose is to prevent the user from accidentally clicking on a sudden pop-up ad instead of a link or on a link other than the one he wanted to click due to a change in the page layout that he did not expect.
To evaluate your site’s performance against Core Web Vitals, measurements for each factor, both for mobile and desktop, should be taken at the 75th percentile page load stage.
Core Web Vitals Assessment Tools
Google not only informed about the plan of the changes, but also updated the tools at least six months before their implementation, which means that developers can prepare for the upcoming changes in the algorithm. The tools will enable validation and optimization of all Core Web Vitals elements, i.e. loading, interactivity and visual stability. Among them, it is worth highlighting:
– Google Lighthouse,
– PageSpeed Insights,
– Chrome User Experience Report API,
– Google Search Console, which includes the new Core Web Vitals report that replaces the Speed report (located in the “Basic Web Metrics” section),
– Web Vitals Chrome Extension.
How to optimize Core Web Vitals?
Website owners and web developers receive specific advice from Google on how to verify their website against Core Web Vitals requirements. To do this:
– Read the Core Web Vitals report in Google Search Console, available in the “Basic Internet Indicators” tab. The most important and requiring quick improvement are those elements that were considered poor in the report. Then, you need to improve your Need Improvement.
– Get in touch with your SEO specialist, web developer or programmer.
– Run a PageSpeed Insights report for your page.
– Take advantage of the Lighthouse report.
After analyzing the site using the aforementioned web developer tools, the website owner should:– eliminate pages with 404 errors,
– reduce the size of each subpage to 500 KB (including resources),
– keep the number of sources for each subpage at the max. 50,
– consider implementing AMP, a special protocol that allows you to increase the speed of loading pages on mobile devices; the page is downloaded directly from Google servers, therefore its loading time is much shorter.
Optimize LCP as directed by Google
To make your website’s User Experience even better, ask for Largest Contentful Paint (LCP). This is the Core Web Vitals indicator that measures the time taken for the largest view item on the page to load. The most common causes of an excessively high LCP index are:
– slow server response,
– blocking loading by an excess of JavaScript and CSS files,
– slow loading of website resources,
– too slow generation of HTML code in the user’s browser (in the case of using the so-called Client Side Rendering, i.e. a technology that generates the page not on the server, but in the user’s browser, using the JavaScript interpreter).
In order to improve the LCP ratio, it is worth consulting with a developer who:
– will optimize the work of the server and improve its performance,
– configure the use of a network of servers located in different locations (CDN – Content Delivery Network) – if the website uses one server, its loading time increases with the user’s distance from the server; the CDN network allows you to shorten it, because to load the page it uses a server from the CDN network located closer,
– minimize resource consumption by storing copies of the HTML code in the cache, – will eliminate unused JavaScript and CSS files that may block page loading,
– it will improve the readability of the website by removing unnecessary characters from CSS files (spaces, indents, comments),
– will increase the speed of loading the page by compressing and optimizing JavaScript scripts.
Resource Loading Rate and LCP
Not only JavaScript codes and CSS files can affect the page load time and Large Contentful Page factor. The loading time is also influenced by the download of movies or graphics as well as dynamic content. What can I do to improve LCP by loading resources? It is worth, among others:
– remove graphics and videos not related to the website content,
– convert graphic files to modern formats (JPG, PNG),
– use responsive images,
– reduce the size of text files sent between the server and the browser (by using compression tools, for example GZip),
– implement conditional loading of resources – in case the connection or the user’s device does not allow the transfer of more demanding resources, other elements can be displayed, adapted to the connection possibility (for example, image instead of video for a connection speed lower than 4G).
First Input Delay optimization – tips for web developers
First Input Delay (FID) is also an important element influencing User Experience. It is an indicator of the website’s interactivity and means the time it takes for the website to be fully functional from the moment the user clicks on the link. The high FID is mainly due to a large number of overloading JavaScript processes. Therefore, it is the optimization of JavaScript that activities aimed at improving the interactivity rate are focused. Among them, it is worth highlighting:
– limiting the amount of JavaScript code on the page, which will shorten its operation time,
– compressing JavaScript files and resources,
– removing unused JavaScript,
– division of a long code into shorter ones,
– minimizing unused code elements and limiting the operation of some of them only to old browsers where they are necessary,
– limiting third-party JavaScript advertising scripts – in some cases they may precede the website’s own scripts and block them.
Cumulative Layout Shift and dimensions of graphic elements
Cumulative Layout Shift (CLS) is one of the Core Web Vitals elements that evaluates the frequency of unexpected changes to the page layout for the user. Changes in appearance may be expected by the user and unexpected. In the former case, the system changes as a result of user action, and in the latter, when the user does not expect a change. This may lead to a situation in which our potential customer clicks not on the link he wanted to go to, but on an advertisement, for example. This causes frustration and can lead to the loss of a potential customer.
The parameters of a specific page in terms of CLS are influenced by all elements on a given subpage that do not have their static places and specific dimensions, that is:
– graphic ads,
– graphics, photos and videos embedded on the website (posts from social media, videos from YouTube, maps from Google Maps),
– dynamically loaded content, banners and forms.
It is not known in advance how large dimensions (width and height) the embedding, graphics or video will have, which may cause changes in the page layout. Therefore, it is worth determining the dimensions of graphic and visual elements on your own, then our website knows in advance how to display them and how much space on the page they will take. In order to improve the CLS ratio, you should also avoid adding new content over the existing one and share photos in modern formats (JPG, PNG). To limit layout changes, you can also designate a specific space with defined dimensions for ad slots.
CLS and fonts – impact on Page Experience
Before the specific font we have selected for our website is downloaded, the website may:
– not displaying the text at all,
– display the content in a different, default font, which may also change the site layout.
Therefore, the selection of non-adapted fonts that, for example, do not recognize characters from a given country, may affect the layout of the page by changing the number of lines and their width, as well as the placement of other layout elements (buttons, ads, graphics, embeds, video, etc.). It is worth choosing well-known and legible fonts, which loading does not take much time and does not affect the operation of the website.
CLS can be measured with the public PageSpeed Insights tool
AMP technologies – how will Core Web Vitals affect it?
For some queries, the Google search engine shows a “Top Stories” section in the results. On mobile devices, so far only those pages that used AMP (Accelerated Mobile Pages) technology could be found in this section. It allows you to improve the speed of loading pages on mobile devices. All unnecessary elements, such as background graphics, advertisements and animations, are removed, and the page is partially loaded directly from Google’s servers, which reduces loading time. With the introduction of Core Web Vitals, AMP technology will lose its importance, and Top Stories will be able to include articles and websites with appropriately optimized Core Web Vitals factors such as loading, visual stability and interactivity, not just those using AMP technology. It is worth emphasizing, however, that AMP technology will be further developed by Google.
Core Web Vitals and website content
Google’s announcement that new ranking factors, known as Core Web Vitals, will be deployed in 2021 may raise many questions. Website owners and developers wondered if the new ranking factor would become more important than the content on the page. Google authorities decided to dispel doubts. Content on the website and to content will still be of key importance for the position in the search engine, and not Core Web Vitals indicators will have a greater impact on the results achieved by the website. However, if websites with comparable quality content compete for position in the search engine, Core Web Vitals indicators, i.e. loading, interactivity and visual stability, will determine the better result.
Get ready to implement Core Web Vitals now
When creating a website, it is worth remembering that it will be used primarily by real users who expect speed and real value from websites. Therefore, creating content, designing the interface or taking care of the technical aspects of the website should take into account the expectations of the recipients. The owners of Google are also heading in this direction by implementing Core Wb Vitals. Will their appearance significantly affect the search results? Considering Google’s announcement that high-quality content will continue to have a greater impact on search engine rankings, the differences may not be very large. However, it’s worth getting ready for the changes now and optimizing your site according to the new ranking factors with updated tools that include reports on loading, interactivity and visual stability.