MOJO MEDIA LABS IS NOW GRAVITY GLOBALLearn how the Acquisition of Mojo Media Labs by Gravity Global Impacts Your Growth Strategy Click Here to Read More
September 25, 2020 •Dani Arceo
INBOUND 2020: My Favorite Session by Lukas Pleva
Inbound 2020 was a blast! I learned so much that it was hard to choose one single session to write about. However, I must say I got overly excited when I first read the title of this session. As part of the Tech Team, I can't begin to explain how much it hurts my heart when a website takes forever to load or looks bad on mobile, so this session really spoke to my soul. If you feel the same way, keep reading and let's fix some stuff!
There are many factors that will influence your website's performance, some more technical than others and many of them you can fix right now! But what does "optimized" really means? well, the 4 main qualities of an optimized website are:
- It's fast on all devices
- It's secure
- It's mobile friendly (looks and works great on all devices)
- It's SEO Optimized
In this Blog post we will touch on the first point, let's get started!
But, what's wrong?
In order to know exactly what's blocking your website from "living its best life", you'll need help from an evaluation tool such as Hubspot's Website Grader or Google's Page Speed Insights. These tools will analyze your site and tell exactly where and what to improve. Go ahead and give them a try!
Once you find out some areas of improvement, get your team together and tackle some items.
Size Matters Online
Browsers need to download all the code and files that makes your page and that can take a while, especially if you are a "scripts collector" and/or your images are not optimized for web. Something simple you can achieve today that will make a big difference is optimizing your images to ensure you won't serve an oversized image. Additionally, be conscious of the amount of images you are using. If you are trying to achieve a certain look, think: could that be achieved by adding some lighter and more elegant CSS instead?
"For a typical page, Images represent 48% of the page's weight and can make up 39% of requests" - Lukas Pleva, INBOUND 2020 Presentation Website Optimization
Some Popular Image Optimization Tools you can use are:
If you have optimized as much as you could, try implementing lazy loading.
Now, let's talk about scripts...
Remember that cool tracking tool your marketing team insisted on using 2 years ago that has since been forgotten? Well, chances are that that analytic's script is still in your site. Legacy scripts can slow your website and we have to talk about it. In order to solve this problem you'll have to audit your scripts and prioritize what's important. Make sure your site carries only scripts that are in use and needed, get rid of the rest!
"Considering a pool of 50 new sites, the average load time with scripts is 9.46 seconds, without scripts 2.69 seconds and each script you add, represents another HTTP request" - Lukas Pleva, INBOUND 2020 Presentation Website Optimization
How you can solve this:
- Use a Tag Manager (Google Tag Manager), tag managers rely on a single JavaScript snippet to load all your tags
- Only fire tags on pages that need it!
- Audit your tags, you can use Ghostery to help you
Oh! JavaScript
That sliding effect is so cool! But it's making your website load time slower. Loading a lot of JavaScript code in general increases the file size of the javascript files and the amount of time it takes for the browser to render interactive elements.
Something else to consider is where your JavaScript is located, loading JavaScript in the <head> can be a problem as javaScript is render blocking resource by default.
What can you do?
- If you’re adding JavaScript manually, ensure it loads just before the </body> tag to prevent render blocking.
- Minimize the use of JavaScript plugins
- Reconsider your page animations (I'm sorry)
There is so much more to cover, but this is a great start, if you want to learn more, check out these resources:
- How We Improved Page Speed on HubSpot.com
- 6 Easy Ways to Help Reduce Your Website’s Page Load Time
- Learn What Website Optimization Is And How To Do It [Course]
- Optimizing your CMS Hub site for performance
