Web Core Vitals Crash Course by our SEO Director
Below are seven main points that summarize web core vitals and how you can make them work for your business.
On Thursday, August 5th, 2021, at Pubcon Florida in Miami, Patrick Stox led the “Core Vitals Page Experience Crash Course” session. As the Product Advisor, Technical SEO, and Brand Ambassador at Ahrefs, Patrick understands the importance of understanding Google Web Core Vitals. Below are seven main points that summarize web core vitals and how you can make them work for your business.
- Page experience ranking is coming to desktop – Web Core Vitals has strictly focused on mobile over the past year. Jeffrey Jose, Product Manager at Google, made a statement back in May that Google “believes page experience is critical no matter the surface the user is browsing the web.” As marketers, we should be considering the speed of both mobile and desktop. With the delay of the mobile page experience update being pushed until the end of August, we can also expect the desktop rollout to be pushed further. However, this must-have has always been in the plan for Google Core Web Vitals. Google has been tracking desktop and mobile within Search Console for over a year now. It is not expected that Google will add to Search Console if it’s not a permanent critical feature for all websites.
- Set height and width of images – This has to be the number one reason why websites are getting negative scores for Cumulative Layout Shift (CLS). When the width and height of the image are not set with distinct measurements, it forces the browser to load the image based on the device. This shift within the design layout of the image can force other elements on the screen like text blocks and other images to push past the screen that the user is viewing. To put this more clearly, it forces the browser to reload the text block all over again once the user continues to scroll. Each time this happens, it has a negative effect on your total score for CLS. Setting your images and text blocks is vital to keeping your CLS scores in green.
- Preload images above the fold – Any images that are located at the initial part of the page that a user can visually see should be preloaded, so the user does not have to wait to visually see them. You don’t want to be loading footer images at the start because very few people will automatically start scrolling to the end of the page upon getting to the website. Knowing what you have to load first is key to success with Web Core Vitals.
- Don’t load custom fonts – System fonts are always a better way to go for a website page experience because they don’t require “fetching” a new font from a server. System fonts are more readily available and thus won’t slow down the loading of your text blocks. If you have no choice and your client MUST have custom fonts, load them earlier at the beginning of your website so that the user doesn’t see blank text blocks while still loading.
- Lazy loaders will not save you all the time – A lot of developers try to combat website core vitals with lazy loaders, also known as on-demand loading, because they allow images to load as the user continues to scroll. Lazy loading entails images at the bottom near the website’s footer not loading until the user gets there. However, images placed above the fold when the website first loads need immediate loading, making lazy loaders not as effective here. Do not rely on using lazy loaders for the beginning images near the primary navigation.
If your business needs assistance understanding Google Web Core Vitals, Google Analytics, or Google Search Console, the busy bees at Tandem Buzz are here to help. As a boutique digital marketing agency located in South Florida, we are experts on SEO, PPC, email marketing, and more! Contact us today to learn how we can get your business buzzing.