Optimizing Site Speed
What You Need to Know
There’s a certain expectation when browsing the internet these days, it should be loading near instantaneously. That is, if you’re asking the opinion of your average, everyday user. I’d venture to say that a majority of the time that someone goes on Facebook or opens Amazon’s website the first thing that comes to their mind is not wondering what processes are going on behind the scenes to make it load so quickly but are instead thinking of what is the next thing they need to do after it has opened in 1000 ms. I can’t say I blame them though, most people are not going to websites to ponder the technical nature of them. The fact is, most people don’t care about how it’s created or ran, they only care if it’s convenient or not. With that being said though it’s important to keep in mind that users do care when it doesn’t work efficiently so as a business you need to make sure you’re in the business of knowing how to make your website run as efficiently as possible. There’s nothing that turns a potential customer away more than a website that refuses to load in under 3 seconds.
I know that may seem a bit fast but I promise that’s actually more of a standard than anything nowadays. Well, to clarify, it’s actually the expectation (and perfectly possible) vs the reality (average time most websites load is around 7 seconds). It’s not overly hard to speed up your website and get it to the point of loading within 1 to 2 seconds but it seems the problem is that most website owners are not aware of what they can do or best practices to speed up their website. If you don’t have web developers on staff then it makes it even harder to find the time to look into what you can do to speed your website up to help with your user experience and conversions. What you’re going to find if you start looking into it is that there’s quite a few things you can do to speed up your site, some fairly technical and some fairly easy. For the sake of making it easier on your average business owner that doesn’t have advanced technical knowledge, we’re going to tell you how you can improve your site’s performance.
Test It First to See Where You Stand
When it comes to optimizing your site the first place you want to start is testing your site to see what potential problems you might be running into in the first place. Without the knowledge of problems you’re not going to know what you need to fix. This may seem obvious when reading it aloud but there are moments that people will jump into their website fixes thinking they know the problem without a true in-depth analysis to figure out what the roots of the problems are. There’s a few ways you can go about this; sites like AHREFs and SEMRush have tools that will provide you with in-depth breakdowns of how you can optimize your site the most, the only drawback being is that you have to pay for subscriptions to them (in my opinion it is well worth it to pay for these in 2019 being that anything you want to do in Denver web design or Denver SEO is going to require you being on top of your website being optimized). There are also a couple other options that don’t require you to pay for services but will also not provide you with everything you might need to stay optimized.
Pingdom gives you a great break down of how to fix any technical problems with your site, giving you a broad view of what you can do to make sure your site is Google compliant. The version contained in the link is not a very deep breakdown but it will at least give you an idea what to look at, initially, to get started with website improvements. Keep in mind that this tool is a freemium so you can request a free demo at first but will eventually need to pay for the service.
Another great option (this one is free and offers great suggestions) is Google’s PageSpeed Insights. This is a great option for anyone with the drawback that you can only look at one page at a time (like Pingdom) to find any problems that might be going on. This will work out for a lot of people if you have a basic site but unfortunately if you have an e-commerce site you might want to consider a paid service (or an SEO professional). An added bonus with PageSpeed Insights is that it comes from the people that set the standard for website optimization and they’re business model is heavily reliant on being the best search engine, so whatever fixes they offer, you can bet that they’re going to be accurate.
Reducing HTTP Requests
When you build a site that you see in your browser essentially what is happening on the back-end with all that code is that is being put into specific scripts all over the place, depending on what kind of features you have or what was written on specific pages or in the case that you have WordPress, pre-built scripts are already in place. These scripts or files house all the code that creates your website or at least how it is rendered on the screen when someone visits your site. When your site is live, these scripts are held on your host’s server(s) to deliver the content to someone when they want to visit the site. When someone tries to visit your site they are making a request to the server to have your website files loaded onto their browser, so to make a long story short, the more there is to load the more requests your browser has to make and therefore, slow down the load time. This becomes especially problematic when you have a dynamic site (PHP based, i.e. WordPress) with videos, animations or lots of images.
The best way to handle this is through script minification. Essentially this means when code is written in a file it tends to go on separate lines to create a distinction between different elements (parts) on a page but with this separation into multiple lines it also means there’s a lot of blank space. By minimizing a script you are combing all that code (where it can be) into one line or just a few lines so that when the computer is reading it, it takes less time and can be processed faster. This is a good trick for reducing the load time of a page but this also has to be paired with combining same kinds of files so if you have four different CSS files, you can combine them into one page which would then be minified to reduce the overall amount of time.
Compressing Images
It’s pretty common practice these days to compress images….for web developers. At least, I want to believe it is since there are so many options to actually compress images. Unfortunately a problem that we’ve come across quite a bit is that image compression often gets overlooked when it comes to the optimization of sites. Don’t get me wrong, I’m not saying this is an out of control problem but it is definitely a small tactic that can make a huge difference in the speed of your site.
There’s no doubt that having a website full of beautiful images does have a positive effect on a user’s perception of your site. Generally, visually appealing sites tend to have people that stay longer and are more prone to buying products. Images are a must have for a beautiful website but can cost you a lot if not properly optimized.
From most of the image compressions we have done for our various clients (saving images a JPEG), when compressed we will save a total of 40% on average. That may not seem like a huge number but if we’re starting with an original picture that is around 1MB, then converting it to a proper size and compressing it, getting it down to 350KB makes a huge difference over all when you have 20 to 30 images on your site.
There are pretty easy ways to compress images for optimization purposes.
A few options:
- Save as a JPEG. You only want to save as a PNG if it has a transparent background. PNG images tend to be bigger files overall.
- Save as high quality instead of highest quality on photoshop. I know it’s probably tempting to save it at the highest quality possible because you want your website to look as beautiful as possible but if you really look at the difference between a high quality image and highest quality image, there’s not much there. Plus, you’re talking about saving anywhere from 500KB to 700KB on an image. Again, that does not sound like much but when you’ve done that 50 times, it saves a ton of space overall.
- There’s a few sites you can go to optimize images. This is good to practice even when you’ve saved your image on high quality because, from my experience, extra compression tends to save even more space.
Using the right hosting services
When you’re finally done with your website or having it done being developed, what is the next step in getting it up and running? The next crucial step you have to take is setting up all your website files on a hosting server. The hosting server is what is going to deliver your files to anyone trying to access your site. The question then may arise, “if it’s delivering files then does it matter what host you choose?” Although it may sound like a simple task to just have files delivered to someone so they can pull up your site, it is actually one of the most important choices you’re going to make with getting your site going. Once you start doing research into the different hosting services that are out there you’re going to find that there is a ton of choices. As the web has grown over the last twenty years, so has the amount of companies that offer hosting services. This, unfortunately, has led to having a wide variety on the spectrum of great and terrible.
Here’s what to look at when trying to find the best hosting service for your site.
- Uptime – Uptime (normally represented as a percentage) is the amount of time a server has stayed running. Essentially, this indicates if their servers have crashed at any point during the year. With this, the higher the percentage is better because one of the most important things when it comes to your website (besides speed) is that it actually is up and useful.
- Speed (Load Time)- How fast is the server at delivering your website files. This is a measurement of how quickly files are delivered and rendered into the browser. Although is dictated by web design, in part, the delivering of your files is as critical as technical optimization on a website.
- Customer Service – You’re definitely going to have to do your research on this being that with website reviews being so prominent there’s a lot of bias that can go into them as well. None-the-less, customer service may not be a key to site speed but it’s going to be critical in situations when your site runs into technical issues and you need an answer fast. Customer service may be the most defining quality you’re going to want to look into when it comes to hosting. You will eventually run into issues on your site and a hosting provider’s customer service could be the difference in whether your site is down for an hour or a few days.
Host videos on a 3rd party server
With the amount of video content out on the web today it’s become easier and easier to have videos integrated into your website. The only problem with putting your videos directly into your media content on your site is that videos tend to be big files and can slow down your site quite a bit especially as you put more and more videos on there. This can eventually prove problematic for most sites after some time but you don’t want to have to make the dreaded decision of deleting content. That would defeat the purpose of working so hard, after all. You can rest easy though.
This may be more common knowledge than before but I’ve found that a surprising number of people are unfamiliar with 3rd party video streaming services helping you with not having put all those big files on your site.
Luckily, due to the prevalence of videos, video streaming services like YouTube and Vimeo give you the option to upload videos with the ability of embedding the videos on your site to take away the heavy lifting on your files. It’s as simple as signing up for an account, uploading, and finding where it says share to get your code to place on your site to automatically stream them from your site. I will warn you though, there’s generally a limitation on the amount of content you can upload so if you’re planning on uploading many videos then you might have to start paying for premium services.
Reduce the number of plugins
This goes along the same lines as having non-minified files or images/videos that are really big file sizes.
If you have a WordPress site then undoubtedly you’ve discovered that the ease of use through being able to download plugins is just incredible. It seems that almost anything that you’re trying to accomplish on your site has an available plugin to help you out with that feature. It really is a great way to run a website without needing to have an extensive understanding of programming. Sometimes you may find for more advanced features you’re going to have to pay a price or getting licensing but for the most part, it keeps things simple while allowing you to create an incredibly interactive site.
Unfortunately though, downloading all those plugins will eventually come at a cost. Every time you download a plugin it’s adding more files to your site which is adding more code that needs to be delivered to a visiting user and interpreted by their browser. This means that by downloading more and more plugins you’re increasing the amount of time it will take for your site to load. This may not happen immediately but inevitably it will. The best thing to do to avoid any future problems is to do regular maintenance on your site by going over your plugins to review and see which one’s you are using regularly and which ones could potentially be retired from your site. This may seem a bit daunting but realistically you should consider doing this once every 2 to 3 months just make sure your site is on the up and up to avoid any major overhaul in the future and to make sure the people visiting your site will stay happy with a better chance of returning in the future.