10 Proven Tips to boost your Website's loading speed

Like/follow us on Social Media

Posted by John Mwaniki on 15 Sep 2017

Think the speed of your website doesn’t matter? But I bet you won’t spend much of your time waiting for a web page that takes ages to load.

Nothing is more annoying for website visitors than a website that takes long to load. In fact, the biggest single reason visitors do not stay at a Website is that it takes too long to load.

Every 1 second delay result to drastic reduction in pageviews, customer satisfaction and drop conversions.

The speed of your site affects your organic search rankings and the bounce rate for your site.

Here are 10 proven and effective tips to boost your website loading speed and increase conversions:

1. Leverage browser caching

When it comes to improving the speed of your website , one of the most important things to do is to leverage browser caching.

Enabling browser caching lets you temporarily store some data such as CSS, Javascript and images on a visitors’ computer, so they don’t have to wait for it to load every time they visit your page.

How long you store the data depends on their browser configuration and your server-side cache settings.

To set up browser caching on your server, add the following lines on your .htaccess file:

# BEGIN EXPIRES
ExpiresActive On
ExpiresDefault “access plus 10 days”
ExpiresByType text/css “access plus 1 week”
ExpiresByType text/plain “access plus 1 month”
ExpiresByType image/gif “access plus 1 month”
ExpiresByType image/png “access plus 1 month”
ExpiresByType image/jpeg “access plus 1 month”
ExpiresByType application/x-javascript “access plus 1 month”
ExpiresByType application/javascript “access plus 1 week”
ExpiresByType application/x-icon “access plus 1 year”
# END EXPIRES

2. Optimize images

Images are one of the most common bandwidth hogs on the web and causes the web page to slow. Oversized images take longer to load, so it’s important that you keep your images as small as possible.

Crop your images to the correct size with tools such as photoshop before uploading them instead of using CSS to scale them down as this slows your page load time and creates a bad user experience.

Try to save in JPEG format takes less size as compared to PNG.

Avoid empty image src tags as the browser makes unnecessary HTTP requests that add unnecessary traffic to your servers and even corrupt user data.

3. Enable files compression

Large pages are often bulky and slow to download. The best way to speed their load time is to zip them - a technique called compression.

Compression reduces the bandwidth of your pages, thereby reducing HTTP response.

Gzip is the most popular and effective compression method currently available and generally reduces the response size by about 70%.

For apache server, you can enable Gzip by simply adding the following code into your .htaccess file:

# compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
# Or, compress certain file types by extension:
<files *.html>
SetOutputFilter DEFLATE
</files>

4. Use of CDN

A content delivery network (CDN) is a very effective way to speed up your site. A CDN has a large collection of servers distributed across multiple locations in the world to deliver content more efficiently to users. It replicates website content on all its servers; each visitor receives that content from their closest server, making page loading times much faster. The good news is that there are plenty of CDNs out there; however, most are paid services.

5. Minify resources

When you look at what’s causing your pages to load slowly, chances are that it’s got something to do with large size of files. Removing HTML comments, CDATA sections, whitespaces and empty elements will decrease your page size and make it as lean, reduce network latency and speed up load time.

Here’s Google’s recommendation for code minification:

6. Minimize HTTP requests

According to Yahoo, 80% of a Web page’s load time is spent downloading the different components of the page: images, stylesheets, scripts, Flash, etc. A HTTP request is made for each one of these elements, so the more on-page components, the longer it takes for the page to render.

That being the case, the quickest way to improve site speed is to simplify your design.

  • Streamline the number of elements on your page.

  • Use CSS instead of images whenever possible.

  • Combine multiple style sheets into one.

  • Reduce scripts and put them at the bottom of the page.

Reducing the number of components in a page reduces the number of HTTP requests needed to make the page render—and significantly improve site performance.

7. Reduce redirects

Redirects create additional HTTP requests and increase load time. So keep only keep those which are technically necessary and you can't find any other solution for it.

8. Fix all broken links

Broken links result in 404/410 errors. These cause wasteful requests which are a drain on bandwidth. They are also one of the surest ways to get a user to leave your site. There is a great need to fix all the broken links.

To identify your broken links, I’d recommend using the following (free) tools:

It is a good practice to use all of them because some will go deeper than others and identify crawl errors that others don’t. Once you’ve reached 0 broken links on all three tools, your job is done!

9. Enable Keep-Alive

Keep-alive is a bit of communication between the web server and the web browser. HTTP is a session less protocol meaning a connection is made to transfer a single file and closed once the transfer is complete. This keeps things simple but it’s not very efficient.

To improve efficiency something called KeepAlive was introduced. With KeepAlive the web browser and the web server agree to reuse the same connection to transfer multiple files.

To enable Keep Alive, simply copy and paste the code below into your .htaccess file.

<ifModule mod_headers.c>
    Header set Connection keep-alive
</ifModule>

10. Specify a character set in your HTTP headers

It’s useful to specify a character set in your HTTP response headers. This speeds up browser rendering of the page as the browser doesn’t have to spend extra time working out which character set you’re using.

You can do this by simply adding a UTF-8 character set tag in your website’s header section as shown below:

<meta http-equiv="Content-Type" content="text/html" charset="utf-8">

I hope this article has been helpful to you. If so, help others to get the tips by sharing this article.

Share this page on Social Media