While five years ago we could say getting your business online is all you needed to do to see the customers start to roll in, it’s 2020, competition is at its peak, and it’s no longer acceptable to just be online. To really take advantage of everything an online presence has to offer, you need to invest in optimizing your website for peak performance. However, website optimization covers so many different facets of being online – page speed, SEO, development, and engineering are just a few of the niches site optimization touches. If you’re feeling a little overwhelmed in tackling your website optimization project, we’ve got you; consider this your guide to improving your website’s performance for improved business performance.

1. Organize Your CSS and Javascript

To the untrained eye, your website’s code can look like a jumbled mess, and in some cases, even with a developer looking, the code can still be disorganized and difficult to read. While difficult to decipher code can be a pain for your developer, it can also be hindering your site’s performance – don’t forget crawlers and bots are reading the same code! 

 

To ensure your site is easily understood by all parties and that it’s performing at the highest standard possible, it’s important to organize all your code, but most importantly your CSS and Javascript files. When you have Javascript scripts at the head of your website’s code, the entire site’s loading will be delayed until those scripts are launched. For a user, this looks like a blank website for several seconds which obviously can contribute to a high bounce rate. Instead, place your CSS files at the top of your code and your Javascript at the bottom. This organization method ensures that visitors see something loading (your website’s style sheets) and then JS loads in the background so there is no perceivable lag. 


Not only will this sort of structure contribute to improved page speed and reduced bounce rate, but it will make your website all the easier to manage and update in the future providing you a more nimble workflow.

2. Minify CSS Files

While we’re on the topic of code organization, we can’t forget code minification. Code minification – specifically CSS minification – involves reducing lines of synonymous code. An easy way to think about code minification is like editing a novel. Without the editing step, the novel will likely be unnecessarily repetitive and lengthy. Not only will effective CSS minification remove duplicate instances of code, but it will also reduce the number of lines your code has, making it easier and quicker to read, which will speed up your website’s load time and make your developer and crawlers very happy. 

 

More specifically, when your website has too many files, it leads to a large number of HTTP requests every time a visitor tries to access a particular file. Because each request is handled individually, it slows the browser down immensely. By appropriately grouping and minifying your CSS you can reduce those HTTP requests and speed up your site.

3. Add a CDN

A CDN, or Content Delivery Network, takes advantage of servers located around the world that direct website traffic to the server nearest to a visitor’s geographical location. CDNs hold cached copies of your site on their servers located throughout the world; these copies have the static elements of your site like images and CSS files to reduce those loading times. In addition,  when a server is close to a visitor, the site will load faster, improving the overall user experience of your website. When you host your site on a single server, that server is responsible for handling all the requests and it doesn’t take into account how far some of your visitors may be from that server. This comes in handy when you have an international audience or even an audience spread across the country. 
Local businesses may not benefit from this performance optimization tactic as much, but the amount of traffic your site receives is also a large determining factor. Popular CDNs include StackPath, Cloudflare, and Sucuri.

4. Compress Your Files and Images

We couldn’t successfully cover optimizing your site’s website performance without touching on file and image compression. Generally speaking, the larger a website element is, the longer it will take to load. A lot of times, these files and images are unnecessarily large and their size doesn’t contribute to the site in a positive way. To reduce your site load time and improve its performance, consider compressing your files and images. 

 

File compression doesn’t reduce the quality or resolution of your files, but it does reduce the amount of storage space the file takes up which makes it easier to transfer over the internet. There are two types of compression, lossy and lossless. Lossy works by removing unnecessary information, whereas lossless doesn’t remove any file information, it just removes redundancy. The type of compression you implement will need to be determined on a per-file basis, but most of the time lossy is the preferred choice.

5. Implement Browser Caching

Browser caching utilizes software or hardware to locally store cached versions of a website to more quickly load it when called. This type of caching works with repeat visitors as it stores the content the visitor loaded in their original visit and reserves it directly from the cache, instead of the server, when they return. 

 

Browser caching software is advanced and has protocols in place that ensure a visitor isn’t being served stale content (meaning every change that’s made on your site is taken into account). The largest benefit of browser caching is improved page speed and load times which are instrumental in improving the user experience.

6. Consider Different Hosting

For better or worse, there isn’t a one-size-hosting option for every website. Even individual websites may go through several hosting options as their site develops and grows. Most websites are fine using shared hosting; shared hosting involves dozens (sometimes hundreds) of websites on a single server. Shared hosting is the cheapest form of web hosting because both the resources of the server and their associated costs are split among the sites hosted on the server. Most of the time these shared resources are more than enough for each website, but if your website grows too large, it may be time to upgrade your hosting. 

 

Large websites and highly-trafficked websites should consider upgrading their hosting to a dedicated server. As the name suggests, with a dedicated server there is only a single website on the server, as opposed to the dozens on a shared server. While it is pricier, you have full access to all the server resources which can drastically reduce load times and any downtime you may have experienced on your shared server.

7. Add Gzip Compression

While we touched on lossy and lossless compression above, Gzip compression deserves its own section. Like other compression types, Gzip reduces the sizes of files, but it uniquely does this by “zipping” the files. This process reduces the number of HTTP requests your server has to handle which then reduces the server response time. Once a visitor hits a site, the Gzipped files are “un-zipped” and the contents are viewable. 

 

Gzip can be used with all your website’s files and can be implemented manually, or with a plugin that works with your CMS.

8. Reduce 404

We will end our deep dive into website performance by touching on 404s. A 404 is the response code a user receives when the page they requested cannot be found. Obviously, if your site has too many 404s a visitor will have a poor user experience and will quickly leave your site. While it’s a best practice to reduce all the 404s you can by 301 redirecting them to the most applicable page on your website, sometimes it’s not possible to completely eliminate 404s. If that’s the case, invest some time in revamping your 404 page. 

 

Your 404 page should contain links to your homepage, your main product pages, and some of your most popular resources. Its goal should be to keep visitors on your website even when the original page they were trying to access cannot be found. Make sure the links to these other resources are prominent and that the page matches your branding. 

 

We hope this post has been helpful in your understanding of how to optimize your website’s performance, but we just touched the surface of this topic. For a more robust approach to website performance, call in the professionals at Inventive. With experienced developers, engineers, and marketing professionals we can take your website to the next level

X