I recently read an article which can be found here on testing and understand your websites speed and whilst the article gives a fantastic insight it’s highly specific. With that in mind I thought I’d approach the subject with more of a rough guide. An overview of sorts.

Reduce Server Response Time

A website can be very slow to access because the hosting server used is slow. The problem can be anywhere from the DNS server to the actual server hosting the site. This could be the factor that slows down your website the most.

Unfortunately, there are no easy solution to this problem. If you are using a shared or reseller hosting service, the best course of action is to find a more reliable hosting service to use. No one likes moving to a new hosting service, I know, but it may be necessary to improve your site’s server response time.

Those using VPS or a dedicated server, on the other hand, could get away with optimizing how the server is set up. You can also try using a third-party DNS service to get a better response time from your server. Caching and using CDN to distribute static files will work as well.

Minify HTML, CSS and JavaScript Files

Every line that constructs your page must be loaded for the page to appear and function properly. We use HTML, CSS and JavaScript to present our content to the audience. The bigger your page is, the longer it will take for the page to load properly.

You can actually improve your website’s site speed by optimizing the way CSS and JavaScript are delivered. Minifying the supporting scripts, for example, can help reduce page load time by a huge margin. The same can be said for minifying HTML codes.
So how can HTML, CSS and JavaScript codes be minified? You can use automated tools to help you. Web development apps such as Adobe Dreamweaver have built-in minify tools to help automate the process. Different CMS platforms have their own plugins and add-ons; For example, you can use W3 Cache to minify your WordPress resources.

Focus on Above-the-Fold Content

Sometimes, getting your website to the speed that viewers expect is a matter of structuring how the content of the site are delivered. Google suggests prioritizing above-the-fold content; these are content that appear on the screen before users scroll through the page.

You can do this by limiting the size of data that needs to be transferred in order for the above-the-fold section of the page to be loaded. This is why the latest web design trends tend to shift towards simpler header design, fewer images and better content delivery.
You can also play with how content are loaded. Changing the order of the codes that construct your page can help prioritize which sections of the page need to be loaded first. In return, you can focus on text-based content and other design elements first before loading images and heavier elements.

Enable Compression

Modern browsers are so much more advanced than they were a few years ago. Browsers now support compressing content on the fly, which means site owners can take advantage of compression technologies such as Gzip to speed up the loading process of their pages.
Most of the time, compression can be enabled by altering the server configuration. However, there are also plugins and add-ons that can work with CMS platforms to compress content and files automatically, without having to dwell into server settings. Depending on the type of web hosting service you use, find a suitable method to enable compression and get that extra boost in speed.

Optimize Images for Faster Loading

We can’t help but use images – and now videos – to make our content more appealing to viewers. Unfortunately, images are substantially larger than text-based content, so you need to take extra steps to optimize them. A great guide on this in general can be found here.

I knew a travel blogger who used fill-resolution images on his blog. WordPress resized the images automatically, but not all themes are designed to automatically load thumbnails and not the original images; the one he used can’t. The result was obvious. Although he had great photos and amazing stories to go along with them, his blog never really took off simply because of the long wait time.

Resize your images and compress them for web purposes. You can also remove metadata and other unnecessary information – such as color profile – to reduce the size of your site’s images even further. For elements or effects that can be achieved using CSS, try to replace them to increase site speed even further.