6 Ways to Speed Up Your Site
The load time of websites is one of the most important factors affecting its usability; most Internet users will just skip a site altogether if it fails to load within a couple of seconds. Below you will find the summary of the “Speed Up Your Site” series. Those are simple yet effective ways to make sure that your website is running fast. You can click on each point to read the article with comments from the readers.
- Optimize Images: always use the “Save for the web” feature included on image editing software. Images represent the heavier load on virtually any website so make sure you are optimizing them. Alternatively you can also turn to an online image optimizer.
- Image Formats: apart from optimizing images it is important that you choose the right format. JPEG format is suitable for photographs or true-color images. The GIF format should be used with flat-color images like logos or buttons. PNG works very similar to GIF but it supports more colors.
- Optimize Your CSS: most websites are designed with CSS nowadays. Make sure to aggregate and clean your CSS. CleanCSS is an online tool that will merge similar selectors, remove useless properties and remove the whitespace from your code.
- Use a Slash on Your Links: when a user opens a link on the form “http://www.domain.com/about” the server will need to figure what kind of file or page is contained on that address. If you include a slash (/) at the end of the link the server will already know that this is a directory page, reducing the load time of the site.
- Use the Height and Width Tags: many people forget to add the Height and Width tags on image codes. Those tags will make sure that the browser knows the size of the image before loading it. The result is that it will reserve a spot for the images while loading the rest of the page, speeding up the whole process.
- Reduce the HTTP Requests: when opening a web page every object (images, scripts and the line) will require a round trip to the server. This latency can add several seconds to the load time of your site. Make sure to reduce the number of objects and to combine CSS files and scripts together.
Browse all articles on the Blog Design category or check the recommended articles for you below:
88 Responses to “6 Ways to Speed Up Your Site”
Well, good idea
- Book Of Tips
Book Of Tips
If you want lots and lots of tips, checkout http://BookOfTips.BlogSpot.Com
Very Nice! You are missing some good ones though…
Complete Seo Tool
Great Tips Denial ! Its all about general website , do u have any plan to write something about optimization of Image related sites.
What about skipping all that and requiring all users to have a dedicated t1 line for their internet connection?
code, websites using apache will reduce a round trip with the / at the end of links. Sure it is nothing major for a single user opening that site, but if you consider popular websites with 100s of hits per minute than it sure help!
Thanks for commenting.
Great list — but “Use a Slash on Your Links” is so insignificant, it’s the odd man out on this list.
Besides, it only improves speed if you are actually linking to a static file — if you’re working with Servlets for example, there is no performance increase. Maybe I’m the only one working with Servlets. 🙂
How about making sure your html is compressed.
I use wp-cache2 and this simple .htaccess hack got the page load time reduced by about 70%
Also the whole html page renders at once rather than during the load so it appears “snappy” in the browser too.
You’re not getting a lot of friendly feedback from the people over at Digg.
They don’t seem to like positive comments, they think they’re fake 🙂
I had no idea about the ending slash either. Thanks Daniel.
Another thing bloggers should consider, is their initial theme choice. Some themes are slow to load even as a demo with hardly any content. That’s a good sign to not even consider using it, inspite of what it looks like.
Great tips! Another often overlooked (and obvious) point is keeping in mind the amount of content per page. Even if the images are optimized, having 20 entries or more per page can really slow down the load time of your average blog/site. Pagination helps a lot with this.
One of the most important aspects for php sites is good coding, especially the way you process database queries. Try use as little as possible.
These lists should always include turning on HTTP Compression.
This is probably the best but least used option for speeding up web sites. It increase performance by a factor of 4-5 depending on the site. One needs to be a little care full as older browsers do not support but in general especially if a site is internal turn this on.
And to reply to the obvious retort :-):
No it does not slow down the web server in most cases. The time saved by pushing smaller packets through the web server, ability to cache more and the network card more than compensate. It also works well with dynamic sites.
I would add Number 7 – speed test it
Awesome. Thanks for the good ideas.
Great list, i learned something (i love that!), i didn’t know that adding a / at the end would help reduce loading time, makes sense. I use cleancss all the time, it’s a real time saver.
Thanx for sharing this list Daniel. 😉
Example (hope it will be shown):
How to crunch? Here’s the explanation and how to do it:
Manta, yeah the hosting provider plays a very important role on the overall speed. But that is not something you can change overnight 🙂 (actually you could… hmmm).
I find that having too many web analytics slows the site down. Try to use only 1-2
Oops, I should have read all the comments a little more carefully. Content first — good.
These are great little tidbits that can be easily implemented. I’ve started doing some of these things lately, especially with the image height and width tags. I’ve got a photography blog and nearly every post has one or more photos in it, so this is pretty important.
Another thing I did recently was change the layout of my div elements. First, I placed each div by absolute positioning within another “entire page” div so they show up and don’t move around as content loads.
The other thing I did was move the content div above (in the code) the sidebar divs. Since I used absolute positioning, it didn’t effect the actual layout. I don’t know if this is good practice or bad practice, but it makes the content load first, then the sidebars. Plus I thought I heard somewhere that search engines like to see the content near the top of the page — but I may be entirely wrong on this. Somebody let me know if this was a dumb move.
Manta SEO Solutions
Good tips Daniel, also some good ones in the comments.
egon mentioned not using content directly from other sites, rather host the content on your server (your host).
Another important factor is to look at your domain host itself. I know it’s sometimes difficult to compare hosts, but test the speed of your site on your host. Cheap hosting may become costly.
Also, I suggest removing anything that is sitting on somebody elses server. If that server has high load and slow load time, so will yours, and that sucks.
Image optimizing is important, and I highly recommend the Dynamic Drive optimizer that you linked to. I use it all the time.
Great suggestions. I knew most of them, but the reminder is good. I should start adding the height and width parameters instead of just accepting the IMG tag that Blogger produces.
Collis, good tips you have there, thanks for sharing!
Using fancy backgroung images intead of simple background colors is a common mistake, I agree.
Wow I didn’t know that about the slash on links…
A couple more for you:
Use table layouts as sparingly as possible, CSS div layouts are much lighter on file size
Design a site to use repeating images and background colours to substitute for heavy image layouts. Note that this doesn’t mean necessarily compromising design quality, only that when you start designing you are already thinking about this.
Anyhow, great post series!
Comments are closed.