You lose two things with a slow loading website:
- Visitors
- SEO Rank
Keep your visitors attention and help your SEO strength with these 10 tips to help increase your page load times:
1 – Speed Check
It’s hard to measure improvement unless you have a starting point! Plus, you can find blind-spots in your code or design that’s hanging it up. This happened on my family’s blog. There was an ad my wife wanted, but it was causing a serious slow down. I removed it (Sorry, Anne :-(). There are a number of great tools to check your speed, here are a few:
2 – Image Optimization
There are different graphic formats for a reason. This isn’t the ice cream shop where you pick your favorite flavor:
- GIF is best when you’re dealing with just a few colors.
- JPEG is best for photos and multiple colors.
- PNG should be used for high quality transparent images.
3 – Don’t Scale Images
Setting the width
and height
attributes of an <img>
in your HTML is fine. It can keep things really tight, but if you have a 500x500px image and you only need a 180x180px, use your image editor!
4 – Compress & Optimize
You can take a look at HTTP Compression (I’ve never done this myself), but I can tell you that optimizing and compressing your JavaScript and CSS files by combining them and minifying the source code can help a bunch!
5 – Place Stylesheet References at the Top
By keeping your stylesheet references at the <head>
, your pages load time will increase because it allows your pages to render the styles progressively.
6 – Place Script References at the Bottom
Browsers can only download two components per hostname at the same time. If you add your scripts towards the top, it would block anything else below it on the initial loading of the page. This makes it feel like the page is loading slower. To avoid this situation, place script references as far down the HTML document as possible, preferably right before the closing
<body>
tag.
7 – Keep JavaScript and CSS in External Files
If you’re keeping your JavaScript and CSS in the HTML document, it will be download every time the page loads. If you keep these files external, it uses the browser caching, makes the HTML document smaller, and makes it easier to maintain your site.
8 – Minimize HTTP Requests
If you have multiple stylesheets and JavaScript libraries, consider combining them to reduce the number of HTTP requests.
9 – Cache Your Web Pages
When you cache your page, it saves a static version of it to be presented to the user instead of recreating it every time it’s requested. For WordPress, check out WP Super Cache and W3 Total Cache (also read thisWordPress codex entry on optimizing/caching WordPress). Drupal core has native caching.
10 – Reduce 301 Redirects
Whenever a 301 redirect is used, it takes visitors to a new URL which increases page-loading times.
If you want to learn more, read Google’s section on page speed. They provide tools, articles, and community feedback about website speed.
Never underestimate the power of a fast loading website!
[via Six Revisions]
Ben Lind says
Hrm… Did you mean ten tips for DECREASING load times? =) Great article, by the way.
Eric Dye says
I’ve heard it both ways.
LOL!
Fixed 😉
You’re awesome.