What does it mean to have a well-performing site? A well-performing site can mean many things to many people, but generally it is the amount of time it takes for the website to load for a customer. How important is this? Very important.
If you read our eGuide: 6 Steps to Increase Web Performance and Sell More, you learned that a one second delay in performance for your website, can mean a:
- 7% decrease in conversions
- 11% decrease in page views
- 16% decrease in customer satisfaction
1 Second Can Be Enough to Improve Web Performance. Source: Cloud Reviews
What does this mean? For a company that has $2,000,000 a year in online sales, a one second delay can mean $140,000 in lost revenue a year.
The stat alone demonstrates how important web performance can be to a company. It’s important to know how your website is performing so you can identify any issues that may be impacting your website’s performance and potentially losing revenue for your company.
Improve Web Performance
But where do website delays start and how do you mitigate them? 80-90% of poor performance happens at the front end and can be measured in two ways:
- technical – how fast a page loads and how many bytes are transferred, and
- perceived – how satisfied users are with the speed of the interface – i.e.: user experience (UX).
If your budget isn’t big and your IT department is small – not a problem. Try these 5 quick tips to improve web performance on your site.
1. Optimize Images
High quality images take longer to load, so here are several ways to reduce the size of the images, without compromising quality.
Don’t allow your browser to resize your images
Use height and width tags to make your images smaller. Allowing the browser to resize an image delays loading because the site will load the large image first and will delay as the browser resizes the image. Check out YSlow for help determining how many bytes you can save by resizing your images. YSlow will analyze web pages and provide suggestions on how to improve the page’s performance.
Don’t scale down
If you have an image that is 160×160 and need and image that is 50×50 – use the specific size you require, don’t scale down. Need help? Check out Smush.it™ and remove unnecessary bytes from image files.
Use an image sprite
By combining numerous images into a single image will reduce the number of server requests and will also decrease the time the page takes to load. Not sure which images can be combined together? No problem, check out SpriteMe. SpriteMe combines images into a CSS sprite for you.
2. Limit external resources
Each time a visitor clicks on your site and tries to access a page that contains an external file, your site has to access the file from the server where the external file is stored. This drastically reduces the speed of your website, as you are at the mercy of the speed of the other site. Try these tips to limit external resources from third-party sites when possible.
Limit plugins
Using too many plugins can slow your site. If you are using a plugin, make sure that your plugin is necessary. Social share plugins are a must have, consider an alternative, like a CMS with in-built social plugins.
Limit embedded media
Videos, widgets and third party media will cause your site to slow down; again, you are at the mercy of the host site.
Avoid using Flash
Flash is bulky and can seriously slow down your website. Flash is also incompatible with mobile devices. Considering that in 2016, 25% of all retail e-commerce is expected to be generated by mobile, avoid Flash.
U.S. mobile retail commerce sales as percentage of retail e-commerce sales from 2011 to 2018. Source: Statista
3. Reduce page weight
Page weight is a very important factor for web performance, and also a common culprit. Heavy pages will drag your site down. Reducing page weight can improve web performance through faster download time.
Reduce bulky code
Inefficient or bulky code containing excess spacing and extra line breaks will cause the site to take longer to load. CSS coders often include a lot of white space that may not be completely necessary. Try to reduce white space, line breaks, and excess spacing as this can do wonders for condensing your code, shrinking file sizes, and maximizing speed. HTML Tidy can assist with stripping whitespace and lines from a HTML source.
Minimize the number of files
Reduce the number of files referenced in a web page will lower the number of HTTP connections required to download the page.
Use HTTP Caching
Caching allows the browser to save file resources from your site. When a visitor repeat visits your site, the site will retrieve the resources from the cached files instead of downloading your website’s images and files again. This will save time, bandwidth and hosting costs!
4. Minify JavaScript
The leading cause of excess web content weight and culprit of poor performance is Java Script. When the browser stumbles upon a script, it stops and waits for the script engine to translate. Bottom line – use as few scripts as possible and if you need to include them, put them at the bottom of the page.
To find out the weight and number of JavaScript files you have on your website, you can use Websitetest.com to run a website test and look for the amount of JavaScript files.
The content complexity section will give you an idea of the large files. The fewer the better. If have 25 or more JavaScript files (or 408 kb or greater weight) you’re in the bottom 10 percent of all sites on the web for JavaScript. Optimization is needed for faster page load time.
The average webpage today is 13 times heavier than it was in 2002, with 20 percent of the average page comprised of JavaScript.
Improving Web Performance By Reducing Javascript. Photo Courtesy of Yottaa
5. Reduce HTML and CSS code
Lighten the code of your website by removing any HTML or CSS that is not required. When you remove any unnecessary HTML or CSS, the code of your website lightens and makes it easy for your website to load. Also consider the following:
Limit Data Size Above the Fold
Structure your site to load the main content of the site first before any third party widgets etc. This will help your site load faster.
Minify CSS
Reduce the weight of CSS code to improve web speed and reduce page load time. Also, loading CSS from several files can slow down your system, try to minimize CSS files.
Minimize HTTP requests
Combine files, and all scripts into a single script, and combine all CSS into a single stylesheet. This can improve your website response times.
Move inline script and CSS into external files
You can improve download performance with minimal changes in the page structure.
Use up-to-date software
If you are using CMS software like WordPress, ensure that you are using the latest version. Also try to host all content on your own server rather than a third party. Don’t let another site drag yours down!
Simply try these quick tips and you are on your way to improving web performance on your website. If you want to know more about how to improve web performance and grow your bottom line, join me for a Webinar on Wednesday April 15th at 1pm Eastern: Why Website Performance Matters for e-Commerce Sales
[hs_action id=”3917″]
In the Webinar we will be going through the 10-Step Playbook for e-Commerce Success. All attendees will receive a copy of the Playbook so sign up for the Webinar now.