33 Practical Tips on How to Speed Up and Optimize Your Website

1. Minimize any HTTP requests.

A separate HTTP request is made for each component on a web page (images, scripts, Flash, etc.), so if you make your design more basic (meaning that it should only contain the essentials), then your website's speed will improve. There are various ways of making sure your HTTP requests are reduced, e.g. use CSS instead of images; combine some style sheets into one, and put your scripts at the bottom of the page, etc.

2. Reduce the response time of your server.

An ideal server response time is at 200 milliseconds. So, the best way to ensure that you can achieve this is by evaluating your website’s speed and checking for bottlenecks performance.

You need to ensure that your website is working at top speed, and the only way to do so is to follow the rest of the tips in this article. It would be ideal to take a look at what your website’s current performance is so that you can get an idea as to where the hitches are.

To avoid bottlenecks in response time, be sure to use a quality hosting company who can handle the amount of traffic you plan on your website receiving. The top companies that we have reviewed on top5hosting have response time less that 200ms.

3. Size the images on your site before you upload them.

In such cases, you should not follow the example of content management systems as they tend to adjust any full sized photo uploads to suit your website’s backend.

This can lead to the images being loaded and reloaded for the adjustment in size and to prevent this, it is best to make use of an image editing program that can allow you to add images to your website once you have adjusted them to their actual sizes.

4. Optimize your CSS.

Nowadays, most websites are designed with CSS, and it is a pretty good idea to make use of the CleanCSS online tool as a means through which you can merge similar selectors, get rid of whitespace and any useless properties that have no major purpose on your website. This allows for your website users to sit back and relax as your website opens like a charm.

5. Clean-up your framework or themes.

Outdates HTML practices can be the cause for the majority of your website's speed problems, and the inefficient coding of such methods is what makes sites go from bursting with users to a deserted region. It might be about time for you to change things up and get your website a brand new theme and a current framework so that it can speed up and you can finally see what customer satisfaction looks like.

6. Enable compression.

A vast number of pages contained within a website are often the reason behind why its speed has gone down. The best way to accelerate the process of downloading a bundle of pages is by zipping them in a function known as compression. This feature decreases the bandwidth of your pages, and this can help reduce the download time by around 70%.

7. Optimize the Homepage.

The Homepage of your website is by far an essential part of the entire thing as it is the place where users get their first impressions of your site and formulate what to expect in their minds. Your Homepage shouldn’t be too busy and filled with traffic, so take a very minimalist approach when you are creating the website. You can even reduce the amount of scrolling on the Homepage if you want to optimize it even more.

8. Look at the capabilities of your host.

At this point, if you find out that your host is inefficient, it might be best that you dissolve that relationship and find yourself another host that is more reliable and trustworthy. However, by the chance that it isn't your host causing the biggest problem, it would be an excellent idea to stay with your current host and switch your server instead. Plus, a dedicated server would cost you less than a new host.

9. Minimize the number of redirects.

You should keep your redirects to a minimum when designing your website and even though it is a very popular technique used during website design, it might be best if you keep them to a lower number as they can take up more of your load time. With the amount of competition between websites, this is the last time that you would want.

10. Enable browser caching.

Whenever you visit a website, the elements on the page are stored on your computer's hard drive in the form of a cache. This allows your computer to load the page the next time your visit it without having to send a new HTTP request each time. So, it is crucial that you make your website a fast-loader for first-time visitors as a way to encourage them to visit again and to make sure that your site's data is stored in their cache.

11. Eliminate all the useless plugins.

Every single plugin that you add to your website would need resources to run and when more power is required, and then your site will be a snail in the race. Before you go ahead and get new plugins for the website, you should probably think a million times and weigh the pros and cons of doing so before you make a terrible mistake.

12. Keep the scripts of your website up to date.

You would probably have to check back sometimes to see if the new scripts of your website have become available. If you find that they have been made available, it would be best for you to update them at that very moment as this can bring significant improvements in the speed performance of your website. Plus, web developers are always finding ways to improve scripts, and there is no harm in making use of their valuable efforts.

13. Use Content Delivery Networks or CDNs.

CDNs are vast networks of servers which can be found all over the world. Whenever you store website content, you can choose to enable the CDN and deliver content from the server that's closest to your site visitor.

14. Turn your GZip on.

This program aims to reduce the number of times that someone has had to suffer at the hands of HTTP reasons. Using GZip compression can speed up your website's loading time. Thus, you should follow the instructions of making use of so as to create faster websites.

15. Keep the Javascript at the bottom and CSS files at the top of your page.

You should keep both of these as neat and tidy as your possibly can and keeping both your Javascript and CSS files at the bottom of the page can allow you to gain a much faster download speed without the worries of the outside world.

16. Use a slash on your link.

Including a slash at the end of your link can allow for the server to tell what page you want to open. This helps reduce the amount of load time significantly. This is because your computer can instantaneously tell that you are presenting a directory page.

17. Minify resources.

There are three resources that you can easily minify, and these are: HTML, CSS, and Javascript. You can minify HTML by making an optimized HTML code; you can minify CSS by making use of a reliable compressor, and you can minify Javascript by using a minify tool to rename your development files and save them to a directory. Thus, you will be able to counter any unnecessary chunks of coding that have gone into the development of your website and its speed.

18. Optimize the images on your web page.

You can easily do this by focusing on the three most critical components of images in websites: the size, format and src attribute. For the image size, it is important to keep in mind that oversized images take a long time to download, so you would want to go with something that is cropped to the correct size and of a low acceptable color depth level. With the image format, JPEG is by far the best option that you have in your market (BMPs and TIFFs should not be used at all). As for the src attribute, you should just make sure that the code of the image is right.

19. Optimize your CSS delivery.

Your website can access your CSS either in an inline (which is inserted into the HTML document) manner or in an external file (which loads before your page is rendered). So, you might want to opt for the external style sheet as the means by which your CSS delivery is handled as it is much more superior and less time consuming.

20. Prioritize any “above the fold” content.

With the CSS stylesheet, you can probably improve your user's experience with your website by making your "above the fold" or top of the page content download faster than the rest of the page. This provides at least something to those who wait patiently for the website, and it's content to load.

21. Use height and width tags.

These are added to image codes as a means through which the browser is made aware of the size of the image before it has to load the image. As a result of making use of these tags, you can manage to reserve the different spots for the images which the rest of the page is loaded, and this can save both your time and the patience of the users. Hence, do not forget the height and width tags or you might end up suffering for it.

22. Reduce DNS lookups.

The Domain Name System (or DNS) is the hostnames to IP addresses. This particular tip is trying to tell you that DNS lookups are cached for better performance. When the client's DNS cache is empty, the number of DNS lookups is equal to the number of unique hostnames in the web page. Thus, DNS lookups can have a very negative impact on my website.

23. Remove any duplicate scripts.

Having the same Javascript twice as hard as usual and that’s only in the movies. Duplicate scripts send too many irrelevant and useless HTTP requests. Not to mention the fact that the entire script is studied to see where the faults and duplicates lie, and this alone is so time-consuming that it would be a better idea to design a brand new website yourself. To make sure that you do not have any duplicates, you should take advantage of a script management module.

24. Configure your Etags.

Entity tags (or Etags) are a function used by web servers and browsers as a way to determine whether a component in the browser’s cache matches. Etags can only save your time and life if you are traveling to the area that it accepts and the weirdest part about this is that there is plenty of flexible validation.

25. Flush the buffer early.

Flushing is a process through which you send your partially complete HTML response to the browser so that the browser can start collecting components while your backend is busy working with the rest of the HTML page. The benefit of this particular tip is mostly seen where there is a lot of backend traffic or lighter frontends. Thus, I would recommend for you to understand the situation from both ends before you go along and start the flushing process.

26. Reduce the number of DOM elements.

When you have a complicated page with plenty of DOM elements, it becomes harder to match that 12-millisecond standard that I mentioned earlier. This is because too many components can be the cause of extreme slowness in the downloading of your website. When there is a high number of DOM elements, you don't have to move anything, but you would have to look at the situation in another way and solve it accordingly.

27. Split your components across different domains.

This allows you to maximize the parallel downloads that can be made. Do not use more than 2-4 domains due to the DNS lookup penalty. Splitting the components into different domains can help the user concentrate on the single domain in front of them, and it can help the website runners understand what the faults in the system are. This would be a major way for you to improve the website’s speed.

28. Reduce the cookie size.

To do this, it is vital that you: eliminate all the irrelevant and unnecessary cookies; keep your total number of cookies to as little as possible; understand which domain to put certain cookies so that you don't disturb the other sub-domains; set an appropriate expiration date;, etc. These techniques are only a few that can help reduce your cookies to the extent that your website runs as fast as lightning.

29. Minimize DOM access.

Accessing DOM elements with Javascript is by far one of the slowest options on this entire list. This is why you should minimize the access to DOM as a way for you to obtain that top speed you want your website to go back to. If you want to carry out this particular tip, it is best if you update any nodes while you are offline; avoid fixing your layout with Javascript and cache the references to accessed elements.

30. Avoid any filters.

Many image filters in the market create major problems for the speed of the website, they also block rendering of the image and freeze the browser while the image is loading. It also increases memory consumption, and it is applied per element and not per image. This can be a very time consuming and irritable process, so the only way around it is to avoid those pesky filters, and you'll be fine.

31. Minimizing Social Sharing Buttons/Widgets.

With social media, we can grab traffic from different parts of the internet. Having social sharing buttons can get your website out there, but it can also make your site very sluggish and maybe even non-responsive at times. Because most buttons use JavaScript which can impact the speed of the website if there is an outage on that social media platform.

A word to the wise, limiting your plugins for social media can still get the point across to share the content while keeping the site fluent and smooth. A plugin that we suggest for Wordpress is Floating Social Bar.

This plugin remains inactive until the user places their cursor on top of the share button which is just a copy in the first place.

32. Steer Clear from Hotlinking.

Hotlinking is the act of someone using elements or content that are still hosted on your site, instead of downloading and posting it to their site directly. This happens most often with images and other media. Even though you would think it would speed up the site that is linking to the content, since it doesn't have to load on their page, however, it may slow it down due to waiting for a third party element to load.

This can affect you the other way around as well. If someone is taking an image from your website and is using it on theirs, it would take from your server because that's where it's hosted, causing non-user related server loads.

33. Lazy Load Objects On Your Pages.

The process of Lazy Loading is when only the objects (images etc) only load in the viewable portion of the page. As a user scrolls, the other objects load as they hit the viewport. This improves the speed of your page, but also the data bandwidth that your site is using, as you won't be loading everything on the page in one payload.

This plugin does an excellent job of lazy loading your images, as they are typically where you gain the most speed when applying lazy loading. There are ways for someone not to allow hotlinking on their website. Following these instructions on how to block this in your HTACCESS file.

Hence, I hope that the tips that have been provided above can be implemented by you so that you can experience an increase in the number of people taking an interest in your fast working website instead of the number decrease. You can also be sure to make use of the tips in a way to ensure you reach that bare millisecond's standard.