I understand that you use the TagDiv Newspaper theme which is not a very performant theme, but at this point, you don’t have an option to change the theme.
That being said, during the audit (even while working on the staging environment) I did find numerous issues with your website mainly related to the below 2 points:
1. Images
2. JS
Your team can severely improve this by incorporating my feedback below. I understand that this response is quite technical, so I highly encourage you to share this with your internal dev team. Now let’s dive deeper.
## Images
Let’s start with the images, as it’s the biggest problem for your website.
### Problem 1 — Images:
So currently across your website (home page, single article page and other pages) images are not actually being loaded via HTML image (img) tags. Instead, they are being loaded as CSS background images.
This forces the browser to download all the images at the same time despite not needing them. Also, lazy-loading these images is almost impossible as all images are CSS background images with no unique class attached. Here are a few examples:
Though I’ve only shared a couple of screenshots, but this problem remains across your website on every single page. Be it the home page or any other pages. Every single page on your website have this exact same issue when it comes to images.
#### Solution:
All these span that are basically holding the images as CSS background images should be replaced with HTML img tag with proper width, height, class names attached to them.
Different images should also have unique classes attached to the img element to easily target them like:
– slider-thumb-img
– three-article-row-img
– featured-article-img
and so on…. (these class names are hypothetical just to give you and your team and idea)
This would make the images to be properly understood by the browser (thanks to the img tag) and also render and lazy load them properly. Also the proper width and height attribute would also maintain the CLS from image size shifting.
## Problem 2
The second problem that is related to your website images are image sizes.
Firstly, I can see that you are loading images from static.profootballnetwork.com making them not to be served from https://www.profootballnetwork.com/ and as a result not getting the benefit of Cloudflare Enterprise caching (higher cache HIT ratio and lifespan) and image optimization.
Secondly, you are loading way bigger images on your web pages asking for them to be scaled down and served to the user. In doing so, the browser has to spend a lot of time to downscale and render/paint the images.
This is why, it is always best to create multiple image sizes for your website using add_image_size() – exactly the image sizes that you need and then use them accordingly where needed.
Here are a few examples:
https://i.imgur.com/Ddl7gp7.jpeg — https://i.imgur.com/YGIjOmi.jpeg
https://i.imgur.com/O3KSAu0.jpeg — https://i.imgur.com/CmO72p8.jpeg
https://i.imgur.com/iHbHJap.jpeg — https://i.imgur.com/KLVA4HY.jpeg
This is not only making the size of your webpage insanely larger but also hurting your CWV and website performance.This issue is also present across your website, across every pages.
#### Solution:
Use add_image_size() to create custom image sizes that are needed for your sites and then serve images with HTML img tags with that exact image size that is needed for that section.
Alternatively, your team can also leverage Cloudflare Images to automatically resize the images directly on the cloud. More info: https://developers.cloudflare.com/images/transform-images/transform-via-url/
## Problem 2 — JS Scripts:
Thanks to Tagdiv Newspaper theme, the website is highly reliant on javascript and especially jQuery requiring the jQUery library to be loaded along with other jQuery scripts for the slider and other things to function properly. Screenshot: https://i.imgur.com/WELMdYl.jpeg
But a huge chunk of JS is coming from the ad networks, so I would highly recommend you to reach out to your ad provider asking them to reduce as much JS load as possible and possibly delay ad loading to reduce the JS impact on the website from the ads.
Forgot to note that this is from our host, BigScoots
Hello!
We recommend to use cloud/PRO templates in order to have the possibility to edit them with the TagDiv Composer which contains a lot of functions and features, please check our tutorial here: https://forum.tagdiv.com/tagdiv-composer-tutorial/
More documentation about the cloud templates is here:
– https://forum.tagdiv.com/cloud-library-templates/
– https://forum.tagdiv.com/design-post-pages-using-cloud-library-templates/
– https://forum.tagdiv.com/cloud-library-category-templates/
We will check all these points seriously, and if there’s something that we can do to change something, then we will add it to the next update.
Thank you!
Hi, I use Cloud Templates for everything on site. Since the new Google update is prioritizing tech SEO, I’d strongly recommend you make the changes in your next update to account for these things.
