Contents
I’m willing to bet that while you’re reading this, you have other website pages and applications open on your device. That’s ok — we all do it!
So how do we end up with so many tabs open in the first place? One common reason is the tendency to open another tab while waiting for a page to load.
This may seem harmless, but the trouble for business owners is that this directly impacts conversions, newsletter signups, and other business goals.
Optimizing your website for speed is the answer. In this article, I will explain how slow websites impact user behavior, factors affecting page loading times, and actions you can immediately take to improve website speed.
Faster Websites Directly Correlate to Increased Business Success
How do you define a successful website?
Most businesses define success through increased sales. Sales typically increase as a visitor moves through the buyer’s journey from a lead to a customer.
Each page on your website should have a call-to-action that moves them along that path. However, if your website is slow, the likelihood of the user dropping off that path is much higher.
Slow Loading Times Increase a Website’s Bounce Rate
A website’s bounce rate is a metric that measures how often users leave a website after first landing on a page.
Bounce rates affect more than just your bottom line. Besides affecting sales, high bounce rates affect organic search results because they indicate that your website is not meeting user expectations.
According to a recent survey by Unbounce, 70% of consumers admit that page speed negatively impacts their impression of an online retailer. Further, the survey determined that over 45% of respondents were less likely to purchase, over 35% were less likely to return to the website, and nearly 12% would share that experience with a friend.
Slow Websites Decrease Conversion Rates
A page’s conversion rate refers to the number of website visitors that take the desired action for that page.
Examples of desired actions include:
- Clicking the “Buy Now” button
- Filling out a contact form
- Subscribing to a newsletter
Website speed directly correlates to conversion rates. Some well-known examples include:
- Firefox - By knocking 2.2 seconds off the average page load time, Firefox increased download conversions by 15.4%
- Walmart - Conversions increased by 2% for every second of page speed improvement
How to Measure Page Speed
Google’s PageSpeedInsights gives you a detailed report on multiple factors affecting page loading performance. Running the tool is easy, however interpreting the results isn’t nearly as straightforward.
So let’s break down some of the concepts first.
When you first run the tool, you will see scores displayed in seconds or milliseconds measuring the following factors:
Time to First Byte (TTFB) - TTFB defines how fast the web server responds to navigation requests for an HTML document.
First Contentful Paint (FCP) - FCP is the number of seconds it takes for the first bits of content to appear on the web page.
Largest Contentful Paint (LCP) - LCP measures how long it takes to load all the page content.
First Input Delay (FID) - FID quantifies how quickly the page responds to user input, such as a tap or mouse click.
Cumulative Layout Shift (CLS) - CLS measures visual stability in terms of how often users experience layout shifts. Layout shifts occur when certain modules or content blocks load after the main structure of the page. For example, this occurs when an ad pops up suddenly in your line of sight while reading an article.
Interaction to Next Paint (INP) - INP assesses responsiveness when a user performs an interaction. Have you ever tapped or clicked a link or button, and nothing happened for a few seconds? INP is the metric that measures the length of that response.
Many Factors are Slowing Down Your Website
There are many reasons for why your website loads slowly — and not all of them are under your control.
These include:
- Slow user internet connection
- Slow server (especially on “shared” hosting plans)
- Traffic volume
- Heavy JavaScript and CSS use
- User browser
- Too many plugins and widgets on your website
- Linking to resources on other websites that use slow servers
- Large image and video file sizes
While you can’t control a user’s internet connection or browser choice, you can optimize image and video file sizes so the most relevant content loads quickly.
Website Optimization Practices Improve Website Speed
Website optimization strategies aim to improve website performance, usability, and SEO ranking through the use of best practices, techniques, and tools.
Some key components of website and search engine optimization (SEO) include:
- Optimizing server configuration
- Increasing loading speeds
- Optimizing landing pages
- Fixing broken links
- Usability improvements for desktop and mobile devices
- Using SEO tools to conduct keyword research
- Using relevant keywords to optimize content
- Improving ranking factors
- Monitoring website with analytics tools such as Google Analytics and Google Search Console
Optimization isn’t a one-time job. It’s an ongoing process that continuously improves your website in accordance with user expectations and technological innovation.
How to Optimize Image and Video File Sizes
One of the most important steps you can take to optimize your site is to decrease image and video sizes before uploading them to your website.
Image sizes typically get out of control because most phone cameras are set to maximum size and quality by default. For example, my phone is set to take pictures at roughly 4000 x 3000 pixels, leading to a file size of about 3MB per image.
Now contrast that to my laptop screen size of 1920 x 1080 pixels. Clearly, there is no need to upload such a large image to the server!
A picture that is 1000px wide would be just fine for a blog post, and 1920x1080 is standard for a background image. The decreased size also reduces the file to less than 1MB, making a huge difference in page loading times.
The same goes for video sizes. Most phones record at a quality level that isn’t necessary for the web. By reducing video file sizes, you drastically minimize page loading and buffering times.
Optimizing images and videos can be done in two ways:
1. Choose a Smaller Format
Sometimes converting to a different format reduces the file size considerably.
Image Formats
Images can be expressed in many formats, including JPEG, PNG, GIF, TIFF, WebP, and more.
PNG is a lossless high-resolution format most commonly used for stock images and printing. These images usually take a long time to load on slower internet connections.
JPEG and WebP are typically the smallest file sizes. WebP was developed fairly recently by Google as a replacement for JPEG, PNG, and GIF file formats. While WebP is relatively smaller than most file formats, it is not the best choice because some browsers do not support it. In addition, many content management systems do not have the capability to upload WebP files.
JPEG is the most commonly used file format, making it the standard choice for website uploads.
Video Formats
Videos come in numerous formats, including MP4, AVI, MOV, MKV, and more. In most cases, MP4 is the best choice that balances quality and file size.
2. Reduce Image and Video File Sizes
As I mentioned earlier, there’s really no need to load a 4000 x 3000 px image in a small image slot. A general rule I follow is to size my JPEGS to 1.5x the size I need.
Photoshop is usually the professional’s choice to resize individual and bulk images.
For those who don’t have Photoshop, there are many free options on the internet that include:
Squoosh
Squoosh is an online website optimization tool that compresses, resizes, and converts images. The online interface is easy to use, and allows users to inspect files, compare differences, and adjust settings.
Handbrake
Handbrake is an open-source video converter and encoder you can download to your desktop. The software is easy to use for beginners, and offers numerous options for advanced users to improve their encodes.
Imagemin
Imagemin is a Node Package Manager (NPM) used by professionals to compress images in various file formats. It integrates easily with build scripts and tools, and is also available as a Command Line Interface (CLI) for users that do not want to use code.
Additional Tips to Increase Website Speed
Some additional tips to increase website load times include:
- Remove unnecessary images, JavaScript files, stylesheets, plugins, and fonts
- Compress CSS and JavaScript files
- Use a Content Delivery Network (CDN)
- Upgrade your hosting plan to a dedicated or virtual private server
- Use a managed service if using WordPress
- Use website caching
Minimizing Image and Video File Sizes is the First Step to a Faster Website
A fast website is critical to increasing newsletter signups, improving conversions, and reaching your business goals. Surveys show a direct correlation between page loading times and bounce rates. Besides decreasing conversions, bounce rates can also affect your SEO score — so make increasing speed a top priority!
Find Out How You're Doing
Website speed is clearly essential for business success. While many factors are beyond your control, you can take the first step by asking Bridges to step in.
Our experts can perform a detailed audit to review your server, hosting plan, caching, plugins, SEO and conversion rate optimization, and more.
Try our free instant website audit where we’ll examine your site and email you a detailed report.
