While you may not always be thinking about it, your website’s load speed is quite important. Think about it – how long do you let a site try and load before getting annoyed? Maybe 5 seconds? If you’re a really patient person, 10 seconds?
The truth is, it’s around 5 seconds for most people. How long does it take your site to fully load? Are you losing visitors because it’s too slow?
Since user experience is now a focus of Google, a site’s load time is more important than ever. You want people to stay on your site. There are many SEO people who believe site load speed directly effects SEO.
For this post, I am going to be taking my How to Start a Blog post, and making changes to improve the speed.
I’ll walk you through step-by-step what I am doing, so you can follow right along! I’ll also add some other ways (that I did not use) to speed up your site’s load time.
The tools I am using to test the site for speed are pingdom and gtmetrix. They are both free.
Here are our results before this post:
GTmetrix
Pingdom
As you can see, this post is actually loading pretty quickly already, but there are some things we can do to speed it up even more.
Now, both free speed test sites shown above provide a ton of insight about specific elements of your site and how they are affecting load speed. Feel free to delve into those reasons, but I will cover many of the common things that slow down sites in this post.
GTmetrix gives you grades on specific categories, while Pingdom shows you how long each element took to load, how large each element is and how long it waited to connect to each element.
A quick look at GTmetrix shoes that they give image optimization a D grade.
Obviously, there are other issues there as well, but we’ll focus on images first.
So I see the D grade from GTmetrix and head over to Pingdom. Sure enough, I see a couple of images over 145kb in size.
Now, if you’ve got nice, high quality photos, you’re going to need to have images that are larger than this. However, you can see the images on my post are just screenshots. They don’t need to be top quality.
One thing to note here: if you’re going to re-size images in existing posts, keep in mind the metadata of those images such as file name and alt tags. If you upload new images, keep that stuff the same to avoid negative SEO impact.
Ok, time to work though the post image by image.
First up, I’ll go over some image re-sizing tools.
PicMonkey – easily resize images in jpeg format in 3 size/quality options. Also crop out unnecessary parts of images with this tool.
Picresize.com – upload pics right on the site, resize, crop, add effects or simple save as a lower quality.
Irfanview – free software that allows you to save images at lower size/quality options. Be sure to download the software and the plugins, so you have the “save for web” function.
Photoshop – the premier photo editor, but very costly and complex. (tutorial here)
The first image in the post was 80kb. A quick downgrade in quality via picresize.com and we’re at 66kb. Not fully satisfied, I took this image into Irfanview and was able to reduce the quality (you can’t tell in the published version) to 50% and it brought the image size down to a tiny 25.43kb. That’s over 2/3 smaller of a file. You can imagine how doing this for the rest of the images will improve load time.
The next image was 84kb and I reduced it in Irfanview to 28kb by just downgrading the quality from 100% to 90%. (I am using the “save for web” option shown here:
I started to see quality changes after that, so I kept it at 90%. The point is to reduce file sizes without reducing noticeable quality. You have to be aware of the line and always choose quality of image over size reduction.
Some images may already be optimized and you’ll find that the tools don’t reduce the sizes. These cases will be rare, but they do happen.
By just reducing all of the image sizes on that post, I reduced the load time by about half of a second according to the testing tools. GTmetrix also upgraded my image optimization grade from a D to a C.
If you want to get serious about image optimization, take a look at your sidebar images, header images and any other images that you have which load on every page. Reducing those can make some serious improvements to load time.
———————————————-
Another thing you can do to reduce your site’s load time is to minify your css file. To many of you, that sounded like another language. The truth about this one is that if you don’t know what you’re doing, you might mess up your site’s design, so consider hiring this one out.
I use http://cssminifier.com/ and throw the minified css onto a test site. You can also hire someone to do this for you.
Basically, what it does is it makes it easier for web browsers to read your css file quickly. The faster it can read your css file (which tells it how to make your website display), the faster the site can load.
———————————————-
Host ads on your own server. Upon checking the speed of my site again on pingdom, I also noticed this disturbing thing: the Hostgator 125×125 pixel GIF in my sidebar took 15 seconds to load! Fifteen seconds! This is because it just happened to take a while to connect to their servers. It definitely doesn’t happen often, but these things happen and the more ads you have hosted on other sites, the greater your chance of this happening.
Download the images for the ads, upload them to your own site and add them back to your sidebar that way.
———————————————-
This one may be the most obvious: get a caching plugin. A caching plugin will generate HTML files that are called upon to load when a visitor comes to your site as opposed to each visitor calling upon the server (webhost) to load a website.
Basically, caching reduced site load speed and reduces the load on your host.
The two most popular WordPress caching plugins are W3 Total Cache and WP Super Cache. I use them both and find the very user friendly.
Note: caching can get tricky. While most people will be able to install these plugins without issue, things happen. Issues with caching plugins can be difficult to figure out, so I recommend leaving it to a pro if you can afford it. It shouldn’t take a pro more than 30 minutes in install and set up either of these plugins.
———————————————-
Similar to a caching plugin, you can also opt for a CDN (content delivery network) service to help your load speeds. MaxCDN and CloudFlare are the 2 most popular.
You can also use CloudFlare’s security services to prevent bots and spammers from accessing your site, this reducing the load and increasing your speed.
———————————————-
A few other general ideas:
- Reduce the number of plugins you have.
- Reduce the number of scripts that are running on your site
- Remove unnecessary images or change them to text
- Reduce the number of full posts that show on your homepage
To expand on that last point. The less full posts that you have showing on your homepage, the better. If you’ve got 5-7 pictures per post and 10 posts showing up on your homepage, visitors are loading up to 70 images each time they visit your homepage!
Consider showing one or two posts and then 3-4 additional snippets of posts instead.
Bonus: this will also increase your pageviews, since people will have to click the posts snippets to read the full post!
———————————————–
Final tests:
Pingdom
GTmetrix
As you can see, a little bit of attention as to what is holding your site up can make a big difference in load speed time.
Also, as I mentioned in the post, there are a ton of other little ways to reduce your site’s load time. I encourage you to explore deeper into the testing tools if you’re interested in further reducing your site’s load speed. I just thought 1400 words was enough for today’s post. 🙂
Don’t have much time or money? Head to fiverr and search “speed up my site” to find several gigs for this exact thing. Just be sure and choose someone with a healthy amount of 5-star reviews.
[…] ~ How to make your website load faster. […]