5 Tips to Optimize Page Speed

By Takin. October 06, 2020.

Topics: Web Design for Growth, Content Marketing

There's nothing worse than a page that just refuses to cooperate and loads way too slowly. Since user experience is king when it comes to website building, page speed optimization is a critical issue to focus on. You can't have a good website without good load times - slow load times negatively affect the user experience and ultimately harm your website's effectiveness. But it's not like you can just flip a switch and magically make your page faster and your load times shorter. There are specific things you need to do, and this post will help you figure out some of them. Here are 5 tips of how to optimize your page speed:

code-820275_640

1.Don’t Cheap Out on Web Hosting

Keeping a website up can be expensive. With all the subscriptions, you have to keep track of - analytics, different sets of optimizers and automation, plugins, etc… the list is very long. With so many expenses to juggle, some of which are necessary, and you cannot do without, it's easy to be tempted to cut costs when it comes to your hosting service.

Realistically, how much worse could it get? Sure, you're not paying top dollar, so you won't be getting the absolute highest speed, but that's not the worst thing, right?

In reality, load speed can make a world of difference. You, as the creator and curator of your website, may be able to look past that, but the users visiting your site do not see things the way you do. For you, your website is the precious fruit of hours and hours of hard work; every time your page loads up, even if it takes an extra second, you feel some sort of satisfaction. Users don't have that same attachment to the site - they want to get in, get what they want, and get out as all fast as possible.

But again, how important could a slight delay be? Radware found that websites (such as Walmart.com) that cut loading times were increasing conversion rates reliably. For example, AutoAnything.com had a 13% increase in sales after cutting load times in half. Inversely, higher load times result in a decrease in conversion rates, because again, users highly value a smooth, streamlined, and fast experience. The longer you take, the less likely they are to be patient with you and stick around.

Load time is also an area where competition happens. If two competing websites offer a similar product and experience, then load time can be the difference-maker. If your website loads faster than your competitors, users will be more likely to choose to visit your site instead of others, even though you offer similar products. It's also incredibly easy to figure out if the loading time is somewhere you need to be competitive in. Just do a quick search of your competitors and open their sites. Do they load up fast? Then you need to keep up with them. Are they slow? Then an easy way to get ahead is to make sure your pages load as fast as possible. In any case, having quality web hosting to optimize load times is a great place to start.

 

2.Optimize Media Files

High-resolution images and videos are incredibly accessible to anyone these days. If you can't find what you want on the web, then you can point your phone's camera and shoot. This, combined with how easy it has become to upload media to websites, results in people putting up unnecessarily large pieces of media on their sites, drastically reducing load times. It's important to optimize images and videos so that they still look good, but don't totally cripple your page speed.

For images, it's essential to understand what file format works best for what situation. The JPG format is best for photographic images. GIFs and PNGs work better for background images, large-scale images, or solid colors.

Next, you want to make sure your images are the right size. If your website will display your image in a 400x400 pixel square, then there's no need to upload a 2400x2400 pixel image. At that point, you're just increasing load times with 0 benefits on the back end.

The same goes for videos. MP4s are usually the best way to go since they strike the perfect balance between quality and file size. You also want to make sure your video has the right dimensions for the user's screen - watch out for mobile users!

If you're using a video as a background element with no sound, then you can edit the video and completely remove the audio track. This will help make the file size even smaller and is precisely the sort of detailed optimization you want to be looking out for.

Alternatively, you can upload the videos to a third party video hosting service, like Youtube, and then use an embedded version of the video on your page. This will alleviate some of the load from your page.

 

3. Use Compression

Compression is another thing to take advantage of. Compression is useful in many ways when it comes to reducing file sizes and increasing load times. Basically, all media can be compressed - images, videos, audio files, anything you can think of. There are several plugins that will automatically compress your media files for your web pages and make sure to use them.

You can also use GZIP compression to reduce download times on HTML and Javascript files. The best part about GZIP compression is that all browsers (including mobile) support GZIP, which means that enabling it isn't difficult at all.

 

4.Cut Down HTTP Requests

One of the main issues web designers run into is that they don't always design pages with load time as their top priority - how a page looks or how much information it gives the user can often take precedence over page speed. This usually results in multiple JavaScript and CSS files being put into a page (themes, plugins, and images are the best examples), each requiring their own HTTP request. HTTP requests take time, and with each one you add to your page, you add a significant amount of loading time. You can reduce the number of HTTP requests by:

  • Merging various JavaScript or CSS files into single JavaScript or CSS files.
  • Get rid of as many plugins as you can, especially those with their own CSS or JavaScript files they need to load. Some plugins offer you the option to disable this, so make sure you check if that option is available!
  • Use sprites for images that you are regularly making use of (for example, your logo).
  • Try to use fonts instead of images whenever possible, because fonts only need to be loaded once.

 

5.Load Above-the-Fold Content as a Priority

Above-the-fold content is the content that visitors see first, before needing to scroll down. It's basically whatever would appear at the very top of your page, within a user's screen. You can prioritize loading these elements since they are the first things the user will see, and then have your page load the rest. This may sound a bit unusual, but there isn't a point in loading things that the user can't see right away anyway.

A quick way to ensure your above-the-fold content loads first is to position all of it at the beginning of your HTML code so that your browser loads it up first as it reads your code.

Get in touch with Aspiration Marketing

Takin
Takin
In addition to having a passion for writing, Toronto based Takin is working on his academic career in Philosophy. He can also play the piano and sing in French.

 

Find what you're looking for

Search our blog posts by keyword