Website speed is important to user experience. In fact, consumers care more about how long a page takes to load than all the cool features your site has. Just look at these stats from a Kissmetrics infographic:
- 47% of consumers want a web page to load in 2 seconds or less.
- 40% of consumers leave a site whose pages take longer than 3 seconds to load.
- 52% of online customers say fast loading time is important to website loyalty.
- 79% of shoppers who find site performance dissatisfactory aren’t likely to buy from that site again.
Website speed isn’t just important for online shoppers, though. It’s also important for a site’s search engine rankings, which impacts your bottom line.
Things you need to be concerned about is optimizing your eCommerce’s website’s performance, i.e. making your site’s pages load, render and respond faster—2 seconds according to Maile Ohye, Google’s Developer Programs Tech Lead, as well as the abovementioned surveyed consumers.
There are numerous businesses online, and as of the beginning of this month, there were more than 280,000 live websites using Shopify. With so many eCommerce sites consumers can choose to spend their money with, it’s crucial that your site performance matches or exceeds online consumer expectations.
What and How to Measure
Website speed is important. I think we all agree on that now. So, how do you check your current speeds so you can improve them?
Here’s a list of today’s top tools:
- PageSpeed Insights — This is Google’s tool that analyzes content on each of your web pages and provides feedback for making each page faster on all devices.
- Pingdom — With this speed test tool, you’re given a report that’s divided into four sections, letting you test and analyze each page’s load time and find any bottlenecks.
- WebPageTest — This tool gives you options, more than 40 locations and 25 browsers to choose from, runs a first view and then a repeat view and grades you like you’re back in school (F to A) based on different performance tests.
- YSlow — Available for Firefox, Safari and Chrome, this tool analyzes web pages and offers suggestions on why they’re slow based on Yahoo!’s guidelines for high performance sites.
Once you pick a tool, you want to focus on three metrics: page weight, number of HTTP requests and time to load.
Methods to Increase Your eCommerce Site Speed
Big images, image lightboxes and vibrant colors are eye-catching. But instead of focusing so much time and energy on the amazing images that will be added to your site, first worry about your site not being as slow as molasses when you launch it.
Here are five methods to turn your site into Speedy Gonzalez every month of the year.
Method 1: Reduce and Remove
When you do less and do it well, rather than trying to do more with your sites theme, your online store and customers will benefit. Just like good writing that evokes emotion and action requires some fine-tuning, so do website and shopping cart themes like Shopify. Editing won’t just improve site performance, it’ll makes things clearer for customers and improve the typical site maintenance burdens.
In terms of where and what to reduce or remove, you can simplify your CSS, which will makes your site more supportable and steady for visitors, remove carousels and add a single optimized image instead, reduce image size of images used and utilize CSS background instead of tiled background images.
Method 2: Optimize Images
I briefly mentioned this in the list above, but it’s important enough to give its own little section. Images are needed, especially with eCommerce sites, people want to see images of your products. But images also make up the majority of page weight.
It’s pretty simple to optimize your current site images. If you’re using Photoshop, choose the “Save for web” option. If you don’t, use ImageOptim or TinyPNG. Both online tools can easily and efficiently optimize images for you.
Method 3: Linking and Trimming
Linking, a technique many call concatenation, combines multiple asset files into one file. This reduces browser requests and overhead, which equals faster loading times. Trimming, or as some would say minification, gets rid of irrelevant asset information, like white space, that does make it easy for people to read but isn’t required for a browser, and it can also rewrite and optimize your code size.
You can link your stylesheet and script files together just by copy-pasting each one’s content into a bigger file, while several online services can take your untrimmed input and give you back a compressed version.
Method 4: Lazy Loading Images
In the business world, lazy isn’t a good word. But with this site speed technique, it is.
Method 5: Implement Device-Responsive Design
Site speed matters to online shoppers, and it should matter to you. The speed of your site contributes to your conversion rates, customer confidence and trust in your site and your bottom line.
Every second counts, so make sure you’re not wasting any of yours or your customers.