Next to security, speed is one of the best ways you can build trust and increase return traffic. In other words, it’s good for your marketing. What’s on your website is important, too. But, if visitors become frustrated by slow load times, videos that constantly buffer, and other issues that affect user experience, they aren’t going to stay long enough to enjoy your content; most won’t give you a second view.
How fast is fast enough?
If your web pages load in five seconds, you’re already doing better then one-fourth of the websites on the internet. Page loading times of 0.8 seconds will beat 94 percent of other sites.
Are those times possible?
They are if you design for speed right from the drawing board.
What causes high lag time?
You might think that pages load slowly because the user is on an older system with a slow processor. Another theory might be that website runs slower because there are too many devices connected to the same network. While these things might contribute to lag time on the end-user side. That is called response time.
Although this is related to overall speed and performance, response time and page load times are not the same. User-side issues and hosting affect both metrics, but not optimizing your website will only exacerbate the problem and kill user experience even on a state-of-the-art system. It will also adversely affect your SEO and ranking on results pages.
What are the effects of slow page load times?
According to metrics from SEMrush, a one-second delay caused a nearly five percent drop the number of articles read on a website and 11 percent fewer page views. Pages that take three seconds to load caused 7.9 percent less engagement.
8 ways to reduce your website’s load time
Even if you’re using the latest tech to improve your artificial design intelligence (ADI) to improve UI and UX, optimization should be considered from the start; AI is only as good as the foundation it’s given to build upon.
Google webmasters advise that a two-second page load is the absolute minimum for an eCommerce website. That means every second you can shave off of your current time will get you closer to the ideal.
Are you ready to improve your page load times by 50, 75, or even 100 percent? Here are eight tweaks that can help you get there.
1. Put mobile first
This isn’t just an idea to improve speed or capture the growing mobile market. Google is instituting a mobile-first policy for page indexing. That means that responsive web design should become a priority if it isn’t already. The old way of doing things was to design for the desktop and make the website responsive for mobile devices. This made sure that the pages looked the same on any platform.
Current best practices flip that around. Response design requires reduced images sizes and layouts that aren’t cut-off or awkward when you view them from a mobile browser. You can test your web pages for mobile optimization by using tools like Google’s Website Auditor to view them before you go live.
2. Choose your hosting platform wisely
The mobile market penetration also means that most searches today are performed through such devices by people busy living their lives and wanting information immediately. Your site’s speed is essential, and your web host choice does make a difference. Gary Stevens, founder of the community-funded research group HostingCanada.org, recently tested the speeds of top hosts and found a surprisingly broad variance in load times – from 223ms to 1.765ms. For site owners and especially anyone involved in eCommerce, faster is better, so make speed a critical metric when screening for a service provider.
3. Optimize images
Speaking of images, optimizing photos is another important step toward reducing the number of HTML requests and conserving resources. Decide how many images you really need on your website. If you’re creating an online portfolio, consider creating a static website. You can also create image collages that contain all of the images in the same ratio as one larger image.
If you absolutely must have photos on your pages, you can shrink them using any photo editor without losing the image quality. Combining the images into CSS sprites will reduce the number of HTTP requests, too. Another option is to configure the container width to no more than 90 percent of the border width using this bit of code:
.container {
width: 800px;
max-width: 90%;
or set images to automatically resize with this code:
img {
max-width: 100%;
height: auto;
4. Enable caching
Caching allows you to put web pages into a kind of temporary storage through the user’s browser. This help conserve resources like bandwidth on your side without affecting access or performance. The cached version of the web page will remain intact until the content changes in some way. This will also result in fewer HTTP requests, which is the sequence of request/response between the browser and server that tells which pages to load.
5. Use a content network delivery (CDN)
The farther users are from your server, the longer it will take for the HTTP requests to complete the circuit. Using a CDN will send web pages through a distributed network of servers, automatically routing them to whichever server is closer to the computer making the request. This will cut the distance that static files like CSS style sheets and JS travel from server to browser, thus shortening the time it takes users to load content.
6. Minify your code
Shortening the distance static files travel is one way to decrease load times. Another is to shorten the code itself. This is done in several ways. First, reduce the number of unnecessary characters and spaces in your code. That means getting rid of comments and limited white space. Next, take all of your JS and store it in one file, and your CSS in another. This makes the code “leaner” and more efficient, while at the same time using less bandwidth and caching.
Stepping up to CSS3 and HTML5 will provide you with a lighter framework and optimize mobile performance. The style sheets in CSS3 also create more visually pleasing aesthetics like rounded corners.
7. Zip it up
In addition to minifying code, you can also compress it into a zip file. You know the power of zipping if you’ve ever tried to download a large, uncompressed file and sat for what seemed like forever waiting for the download to finish. Compressing large CSS and JS files can reduce them by up to 75 percent. This is a function that’s performed on the server side, so contact your web host if your can’t find a way to do it on your admin dashboard.
8. Stay below the fold
Browsers load all JS first if you put all of the files before your content. In order to cut the time it takes, add the JS files toward the end off your script just before you close the body tag. The first page of your website will naturally take longer to load than subsequent pages, so anything you can do to decrease the load time there will make the whole website load faster.
You can also Async tags to change the order that the script loads, making the lighter code load first, or add a defer attribute to cause the script to load after the content has loaded.
Final thoughts
Seventy-nine percent of shoppers won’t return to a website if it doesn’t perform well. Can you afford to lose three-quarters of your customers? Optimizing your website for speed doesn’t cost anything but a little bit of effort and attention to detail. We’ve provided to means, the rest is up to you.
