December 17, 2019
One of the best things you can do for your site’s overall performance is to speed up how fast it loads.
To help illustrate why this is important, let’s take a journey to Whistler.
Picture this: you are cruising up the Sea-to-Sky Highway. The day is bright and warm, and the roads are clear with no traffic in sight. You make great time on your drive on a day trip to Scandinave Spa. You arrive just as it’s opening. The twists and turns were fun to drive, and you barely noticed the time fly by.
You have an amazing day at the spa. The pools replenish your spirit and your muscles relax. You feel great.
Unfortunately, the traffic on the way back is atrocious. The trip takes three times as long as it did on the way up. It’s bumper to bumper and stop-start the whole way. Any benefits you gained from the spa are gone, your jaw clenches and back tightens. You would do anything to not be in your car. You consider pulling over and walking home.
It’s the same drive, but the experience couldn’t have been more different.
Your users experience your website in a similar way. They can zoom from page to page, enjoying the experience as they joyfully explore your website, or they can feel stuck in traffic as they wait – impatiently – for each page to load.
Unlike the Sea-to-Sky Highway, they can leave your site at any time. If you make them wait in digital traffic only the most dedicated will ever make it to their destination. The others will just go somewhere else for what they are looking for.
So how can you help clear the highway and keep smiles on the faces of your website’s visitors?
I’m here to help you with that.
Tip #1: Optimize Your Images
Images are often the culprit of a slow loading web page.
Crisp, beautiful images help bring your website to life. They show your product or service in the real world, engage your audience, and help communicate your brand, product, and mission. It’s easy to see why many website administrators think ‘The Bigger The Better’ and upload the largest size at the highest resolution, but oftentimes this isn’t necessary.
The images you are uploading to the web are often used for a particular purpose, like the background for a banner, featured image of a blog post, or detailed image of a product you’re selling.
These areas will likely have a preferred pixel width and height. If you upload a photo that is sized correctly, your page will load faster since no unnecessary data has to be sent from your website’s server. You should reach out to your web developer when you are uploading new photos and they will likely be happy to give you the required size.
Be wary of the DPI (Dots Per Inch) of the photos you are uploading. This setting is used when printing a photo but isn’t used when you are viewing it on a webpage. A deep-dive into DPI will come in a future blog post, but for now, you can edit your photos to have a DPI of 72 in a program like photoshop. If you see that image has a DPI of 300, it likely means that the image has been optimized for printers and is a needlessly large file for the web.
Once you have your photo sized correctly, you should optimize it using software like JPEGmini or TinyPNG. These applications reduce the size of your files without damaging their image quality.
The last tip regarding images is to use the correct file type.
- .png: For images with transparency
- .svg: For illustrations/vector files from programs like Adobe Illustrator
- .jpg/.jpeg: For photos
Tip #2: Separate Your Pages
There has been a trend in web design lately that shows all the content of your website on your home page in defined sections. In this style, your navigation scrolls to one of these sections when the menu item that corresponds to it is clicked. This style can be fun and feels fancy – but it can come at a cost.
Sites that choose this design style struggle with a few problems. First is the topic of our post, loading speed. If you’ve chosen this style, check with your web developer and ask how the content is loaded. If it’s all loaded when the page appears, it will be a challenge for your user’s connection speed. You are essentially forcing your user to load your whole website at once rather than just the home page.
There are ways to optimize sites like this if you do choose this style. Be sure to talk to your web developer if you have a site like this, so you can build a plan to only load the images needed, loading the rest as the user scrolls down to the new sections.
Or better yet, separate these sections into pages. This will help each page load faster as well as have some other benefits. Chances are search engines will have an easier time figuring out what each page is about. If your home page has sections about your company, your products, and your location, search engines will have a hard time telling what content is most important.
Tip #3: Carefully Choose Your Hosting Provider
Not all providers are created equal. It’s understandable to think that hosting is just that – hosting. In reality it’s a series of working computers that hold your website’s files. Some hosts place many sites on the same computer, which can cause one site to slow down if another is very busy. Others aren’t running optimized equipment for your site’s setup.
Choosing a hosting provider is an important choice. Be sure to do your research, view testimonials, and adequately understand your own needs. We are obviously an advocate for our own hosting service. We are proud of our fast and secure servers and proud of the service our clients recieve. Regardless of your provider, hosting is an important part of the loading speed puzzle.
If you’re interested in learning more about hosting, we put out a VLOG about it recently that will help demystify what it is:
Hopefully, after making some small adjustments to your website, your users will be flying down the information highway, playfully making their way across your website. If you are curious about how we can help you with your website, please send us an email. We are always excited to make the web a better experience for you, your website, and your visitors.