Since you are here I could probably assume that you already understand why it's important that your website loads quickly. But, alas, a good teacher starts at the beginning--and we all know how great assumptions are--so let's take a quick second and talk about why it's so important to have a fast loading website.View the Episode Goodie Bag >> Hosted By
Since you are here I could probably assume that you already understand why it’s important that your website loads quickly. But, alas, a good teacher starts at the beginning–and we all know how great assumptions are–so let’s take a quick second and talk about why it’s so important to have a fast loading website.
So really, you need a fast loading site because it doesn’t matter how gorgeous your site is if people never get there, or you torture them with lines to get in. All that pretty just goes to waste.
Alrighty, so now, with all that sunshine out of the way, let’s get to the recipe you need. My fast loading formula website is:
Imagine your fully loaded website is a pitcher of water. Each of the components of the site, from scripts to photos, fill the pitcher before it can be displayed.
Your site likely has hundreds, if not thousands, of teeny cups with drops of water in them just waiting to be gathered and poured together to render the whole site.
For the site to load quickly, we need to make sure every container is as light as possible; because it takes more time to pour things from concrete flower pots than plastic ones.
If you have to pour from each teeny cup everytime a page in your site is loaded, it can be a time consuming endeavor (especially if they’re heavy). To save time, you want to marry like-things and often-used things together into the same container.
Then we hold everything at-the-ready to use at a moment’s notice. The next time the site needs to be loaded, we can just pour from a few light containers to fill the main pitcher faster.
Check your website’s load time using a few free testing tools like: Google Page Speed Insights, GTmetrix, or Uptrends. These reports will tell you where you’re bogged down and give you suggestions for fixing. But, to be honest, some of the stuff they tell you is going to look at lot like geek (no not greek, geek) because it is. So I’m going to define most of the common challenges for you now.
Once the site is loaded on a device, the browser stores or caches most of the content on the page so the next time the page is loaded the content is stored locally and loads faster. That’s why sometimes when you update your site you can’t see the changes you made until you clear your browser cache.
You’ll manage this through a plugin. We usually use WP Rocket.
Whichever plugin you use, just make sure it works with your hosting company. Caching plugins need the server to be sympatico for the caching to actually work. If you have a plugin installed on your site and all the reports you run tell you to enable caching, your site isn’t being cached and it’s likely a server/plugin compatibility issue.
You could just copy and paste all the files into one, but that’s not really a viable solution for the long run. So we use plugins for this.
There are some many awesome things about using a CDN; improved load time is just one of them. We use CloudFlare. They even have a free package for smaller sites.
A CDN (Content Delivery Network) is a collection of servers that helps speed up site load time by reducing the physical distance between the server and the user. As with light and sound, it takes time for data to travel as well. The farther it has to travel, the longer it takes.
This service also improves site speed by lightening the load on your server. By caching parts of your site and loading them from the CDN, it frees up resources on the server. This benefits not only your site, but others on the server also.
I can’t make a blanket statement about which host is right for you…maybe just don’t pick the cheapest; it’s cheap for a reason. If you have a super-cheap hosting space, it’s because you’re renting a room in a hostel. So if one person throws a party you’re all going down.
We don’t have many policies at MayeCreate (I think we have 3 to be exact) but our #1 policy is DBD – Don’t be Dumb. Our lead developer, Tyler, introduced this amazingness to the team years ago. Turns out his dad was a champion of the phrase.
You can certainly use a plugin like Smush to optimize images on your site, but you also need to be smart about the images you upload. What tends to happen is people update the website without knowing how image size impacts load time. They have tiny images that should be 25K loading a 700K file.
Run a report and look at the waterfall. Sort the file size from largest to smallest. This will help you see any big images or videos slowing down your site speed.
For example, a lot of people use PNG files almost exclusively, since the PNG format is so flexible. But PNG is not always the smallest possible file size. JPEG supports the broadest color spectrum, so if it’s a normal image and doesn’t require a transparent background (or animation, in which case you would use GIF), try a compressed JPEG to see if you can get the quality you want in a smaller file size.
Use a plugin to convert your images into Google’s version of a web image. In the past it was JPG, PNG and now it’s WEBP. This will improve load time considerably on almost all sites.
So when you “embed” something, you’re asking your site to load it from another location. That could be a YouTube video, or an animated gif, or the fancy graphic the BBB gives you to put in the footer of your site.
When you put 5 YouTube videos on a page without lazy loading you’re asking the site to load each of the scripts it needs to play a video 5 times…with lazy load it only loads once.
We include this feature in our site templates but you can also implement it with a plugin.
Get construction web design and online marketing tips and tricks sent directly to your inbox.
© MayeCreate Design 2021 | 573-447-1836 | [email protected] |108 E. Green Meadows Rd., Ste. 9 | Columbia, MO 65203