HomeChecking your page size for SEO: a complete guide.

Checking your page size for SEO: a complete guide.

Today’s internet speed is out of this world. According to Statista, the average fixed broadband download speed is 105.15 Mbps, and mobile 55.95 Mbps.

Nevertheless, code builds, errors, and other issues can lead to page sizes that become a major source of pain for SEO.

You wouldn’t believe that the largest page size I’ve ever seen in an SEO audit is 100 MB (I’m not kidding).

There are several steps you can take to reduce the size of your page, but first you need to determine the size of your page.

We also need to take a look at Core WebVital and how the page matches Google’s metrics.

In this guide, you will find everything you need to understand and check the size of your page, then refine it.

General page size rules

Ideally, you want to keep your HTML DOM page size approximately 100 100 kb or less, depending on your niche.

Advertisement

Continue reading below.

In some niches, pages may be larger. In e-commerce, for example, it is not uncommon to see pages around 150kb-200kb, depending on how many product images are on the page.

You don’t want to be too big, because then you start to have a negative impact on the user experience and you may miss out on opportunities to boost rankings with good core web vital scores.

But cutting the page size without looking at the user experience may not make your page as useful as your competitors. Balance is key.

If you are looking for a tool to check HTML page size then the following tool in SEO Site Checkup is a good one.

Issues that affect the size of your page.

CSS and JS

When you add the default CSS and JS, you’ll want to make sure you’re optimizing this code for page load as well. This means making sure that these files are properly minimized, and making sure that you do not add large amounts of code blots.

Advertisement

Continue reading below.

“Code Bluetooth” means that unnecessary code significantly increases the page size, thus affecting the speed of your page.

There are different ways to accomplish the same thing. You want to avoid those who create problems by overcoding on CSS and JS side.

In addition to a better coding mindset, the process of minimizing CSS and JS files is needed. The reduction process removes extra spaces and other random code samples that don’t need to be there.

It is important to note that Manfish will not change your original coding – just a sample of the coding. Your brain and development chips will still be needed to achieve the ultimate CSS and JS code optimization on the server side.

HTML DOM.

The size of a large DOM tree is a major cause of page speed issues and can make it very slow.

This affects things like network performance, load performance, memory performance, and runtime performance, all of which can significantly affect your overall page load and core WebVital user experience.

Your development process should include some sort of resource allocation to optimize the size of your DOM tree.

Images

Larger images can have a negative effect on the size of your page, especially if they interfere with user satisfaction.

If a user has to wait 5 minutes for a 15MB image to load, you’ve already lost it.

That’s why when you’re working on compressing your images, it’s important to factor in the pixel size as well as the dimensions of the image.

Tools for checking your page size

There are several tools to check the size of your page. I like two:

Google Page Speed ​​Invests

Google’s SpeedInvest is an important tool for identifying page size issues that are slowing down loading.

In addition, it will help you to mark items in the checklist for Google’s Core WebVital for page size.

Screenshot from Google Page Speed ​​Insights, September 2021.

Scream Frog SEO Spider.

You can also check the size of your page using Screaming Frog SEO Spider to crawl your site.

Advertisement

Continue reading below.

Once your crawl is complete, follow these steps to check the size of your page:

1. Click the drop-down menu in the upper left corner.

2. Select. HTML. It will only show HTML pages that were crawled on your site.

Step 1 to check the page size on the screaming frog SEO spider.Screaming of the Screaming Frog SEO Spider, September 2021.

3. Next, scroll to the right until you see the page size numbers, as shown below.

Step 2 To check the page size on Screaming Frog SEO Spider.Screaming of the Screaming Frog SEO Spider, September 2021.

This way you can check the size of your page with a screaming frog SEO spider.

Advertisement

Continue reading below.

Why is it so important to check the size of your page?

Page size is an important consideration in SEO as it can significantly affect the overall speed of your page, affecting both search ranking and performance.

Page load speed.

According to Google Search Central:

Accelerating websites is important not only for site owners but for all Internet users. Fast sites make happy users, and we’ve seen in our internal studies that when a site responds slowly, visitors spend less time there.

But fast sites don’t just improve the user experience. Recent data suggests that improving site speed also reduces operating costs.

Like us, our customers value speed very much – that’s why we decided to take site speed into account in our search rankings. We use different means to determine the speed of a site compared to other sites.

About 70% of users admit that page speed affects their desire to buy from an online retailer, and half said they are willing to leave animation and video for faster load times. shall be.

Advertisement

Continue reading below.

And according to Google, as page load time increases from one second to 10 seconds, the mobile site visitor’s chances of bouncing increase by 123%.

As you can see, it’s important to speed up your page – not only for the user experience but also for your ranking in search engines.

This can help lower web hosting costs.

Depending on your internet hosting provider and their hosting plans, you can save on hosting costs with smaller page file sizes.

A smaller page size translates to lower bandwidth (file transfer), which can reduce hosting costs – especially on larger sites.

Best ways to improve page size.

Consider the following best practices for improving page size on your website:

Improve these images.

To make the best, best pictures, it’s important to make sure you mark the following items from your checklist.

  • Body pixel size.
  • Total image size.
  • Maintain image quality.

Advertisement

Continue reading below.

Body pixel size refers to the pixel density of an image. It doesn’t matter if your image is reduced from 1600 x 1600 to 500 x 500 if the pixel density of the image remains the same.

You are still going to get images that have a file size of 1 MB if you started with that.

To ensure proper optimization with both of these factors in mind, make sure you take advantage of exposed image compression with paid versions of tools like Adobe Photoshop, or tools like Smoosh Pro.

Currently, Adobe Photoshop is the gold standard when it comes to image compression.

This will help you to target all three factors and your images will still be clearly visible at the end of the compression process.

You should also consider faster image formats that are better than their predecessors, such as WebPONGPNG.

There are many services that you can use for image optimization, including ShortPixel.com and TinyPNG.com.

Advertisement

Continue reading below.

If you are using WordPress, there are several plugins that are extremely useful for this task. One is the Short Pixel Image Optimizer and the other is the Tiny Compressed Images plugin.

Don’t use custom fonts unnecessarily.

We are all there We are all victims of “I-Want-That-Font-itis”!

Chances are, there’s an alternative WebSafe font that matches what you want to use.

If not here’s a new product just for you! It’s just animal nature.

Using web-safe fonts like Ariel, Verdana, or Helvetica are all great choices, and you eliminate the possibility of problems with custom fonts.

It’s also more cross-platform and cross-browser friendly, meaning your site will show up on as many browsers and devices as possible.

Minimize your HTML and CSS.

The process of minimizing your HTML and CSS files can provide significant benefits when it comes to reducing your page size.

Advertisement

Continue reading below.

When you minimize your HTML and CSS, you get rid of unwanted and unnecessary spacing in the code, and as a result you shrink the page file size.

It makes sense to continue the process of minimizing all of your pages, especially if you know your pages are full of unnecessary code.

There are many tools you can use to minimize your HTML and CSS files, including:

If you’re following a one-click optimization for your WordPress manufacturing task, CloudFlare also offers this feature if you want to go to their CDN (Content Delivery Network) service.

The tool on minifier.org is also very useful for this purpose.

Avoid plugin blots.

Adding plugins is not as harmless as it sounds. If you add 5, 10, or 15 plugins at a time, you’ll want to scale a lot on this exercise.

Advertisement

Continue reading below.

Just adding a plugin to a WordPress site will have a negative impact on the size of your page, as well as any user who can visit the page (resulting in a significant reduction in site performance). May be).

Be careful to limit your plugins to what is necessary and add the right functionality to your page.

You don’t want to be in a situation where adding too many plugins will cause your page to suffer from page speed issues.

Improving your page size is the first step for many people.

The size of your page can make or break the performance of your website.

Don’t make the mistake of burdening your users with unnecessary fonts, overly large images, and unnecessary plugins.

All of these methods result in slow loading of pages, which will frustrate your users and cause them to leave your page.

This is the first step among many people when it comes to the process of concrete technical reform. Read Advanced Technical SEO: A Complete Guide to Learn More.

Advertisement

Continue reading below.

More resources:


Featured Image: Samby / Shutter Stock.