There are few things as rewarding as launching a new website or web app. The launch is the culmination of countless hours of research, design, project management, development, and testing. Unfortunately, many times not enough attention is paid to the website performance until a blatant problem occurs: customers start to complain or ads are being denied publishing. But at that point, you have already lost countless customers to your site’s poor performance.
In this article, we are going to unpack why it’s important to have a fast loading site and 4 tips to get you there! Let’s jump in.
Why Do You Need a Fast-Loading Website?
According to Kissmetrics, 40% of visitors will leave if your site takes more than 3 seconds to load! Driving relevant traffic to your website is difficult enough – no company can afford to lose 40% of the traffic that finds you because they get frustrated and leave.
The first reason you need to care about website speed is the user experience. In 2019, users expect a website to load quickly and be free from annoying prompts. In a world filled with smartphones and wearables, people have been conditioned to expect immediacy. Do not let these potential customers down by having a clunky, slow website!
If you follow web trends you will notice threshold for site speed has dropped dramatically over the past few years; users are more demanding and have higher expectations than ever before.
Websites are also accessed from an increasingly diverse set of devices. 10 years ago, business owners and IT teams were certain that requests were coming from desktops with a minimum screen size and wired internet connection. These assumptions do not hold true today.
Users access websites from desktops, laptops, tablets, smartphones, and smart televisions. Hell, even wearable devices (Android Wear) and cars (Tesla) have modern internet browsers! We expect this trend to continue, so it’s important that your website can be easily accessed from any internet-enabled device.
Furthermore, consumers and customers expect to access websites at anytime. Requests are made across the globe, and often from areas with spotty or intermittent cellular coverage. (A big, heavy website combined with slow internet is a recipe for disaster.)
And, if that’s not enough, there is another key reason why you need to care about website speed. Google’s search algorithm prefers websites that load fast, so increasing your page load time should be a core part of search engine optimization (SEO).
4 Tips to Dramatically Improve Website Performance
Now that we understand the importance of website speed, let’s dive into specific ways that you can dramatically improve your website performance.
Minify HTML, CSS & JS
First and foremost, make sure to minify all of your HTML, CSS, and JavaScript (JS). The process of “minifying” refers to using a program to remove all unnecessary elements from your code, including spaces, commas, comments, and more.
Most modern content management systems (CMSs) and have built-in minification and compression options, so be sure to use them! This is something easy to overlook, but can have a profound impact. Importantly, minifying your HTML, CSS, and JS will not influence how your websites looks. It will simply shrink the file size, making it faster to load.
Similarly, we recommend selecting images that are the appropriate size and quality. For example, an entry-level DSLR camera will take 18 megapixel photos – which translates to a resolution of 5184x3456. This is far too high resolution for the web.
We recommend resizing photos to the maximum size that will be displayed. For a banner image, a size of 2000x1500 is appropriate. For smaller images or icons, make sure the image size matches the display size. An asset uploaded in 400x400 that is scaled to display at 100x100 is a waste – and adds to the page load time.
In addition to resizing, we recommend leveraging a lossless image impression service like TinyJPG and TinyPNG.
Load JavaScript Asynchronously
We also suggest all websites load their JavaScript asynchronously. In general, the framework of a website is built in hypertext markup language (HTML) and the formatting is handled in cascading style sheets (CSS). For more advanced design, interactivity, or functionality, web developers turn to JavaScript (JS).
By loading JavaScript asynchronously, webpages can load much faster because the text and basic formatting can begin to appear without having to wait for the JavaScript to render or fetch remote scripts like Google Analytics, social plugins, or chatbots.
Crucially, users are sensitive to the time for initial page loading. Nobody likes staring at a white screen, and asynchronously loading your JS can provide faster visual rendering and a happier user!
Use a Content Delivery Network (CDN)
At Tragic Media, we are big fans of leveraging a content delivery network (CDN) for all of our clients’ sites. CDNs are a rare piece of technology that offer many advantages with no drawbacks – they increase site performance and security without any strings attached.
At its core, a content delivery network is a series of data centers that store your website or web application content. When a user makes a request, the information can either come from an uncached location (e.g., your servers) or from a cached location (e.g., the nearest data center).
Because a cache is much closer than your actual servers, and is optimized for this type of work, files are retrieved much faster. It also reduces the load on your servers and can actually save you on hosting costs.
Specifically, at Tragic, we love using CloudFlare to improve the experience on our clients’ websites. CloudFlare has a generous free tier that allows companies to get started with a global CDN featuring 165 data centers across the globe; mitigation for distributed denial of service (DDoS) attacks; and a secure socket layer (SSL) certificate.
With some simple configuration, CloudFlare can improve performance and security. Their solution also allows administrators to block malicious requests – such as repeated requests that are coming from a bot, not a human, and even block traffic from an entire country.
Find the Right Hosting Provider
We saved the best for last. When looking to increase site performance, selecting the right hosting provider – and the right option from that host – is huge.
First and foremost, we recommend companies migrate their websites and web applications to one of the three main cloud providers: Amazon Web Services, Microsoft Azure, or Google Cloud Platform (GCP). These three solutions offer high performance, high availability, advanced scalability, a variety of integrations, and plenty of extensibility.
There is also a perception out there that using one of these providers is expensive. In our experience, using the small web server on GCP combined with CloudFlare’s free tier provided a dramatically increase in speed, stability, and security.
This combination, all in, costs about $30 per month. We often save our clients huge amounts on their hosting by moving them from expensive, unscalable hosts like GoDaddy and HostGator to Google Cloud Platform.
Why does your hosting provider matter? Well, because when a visitor comes to your site, their device is making a request to where your files are stored. Having a speedy server (and a CDN!) dramatically increases load times and makes the experience more fluid.
For those looking for a more detailed look, check out our article on the benefits of switching hosting providers.
Conclusion
At Tragic, we build and scale websites that need to perform. Our clients rely on us to support their business’s digital presence – websites and customer-facing services that need to be fast and available around the clock.
Along the way, we have created a checklist of best practices to launching, scaling, and maintaining a website. This has been a quick look under the hood of what we recommend and what we offer.
Looking to have a deeper discussion? Contact us today to discuss how we can help you transform your business in 2019.
