This weeks guest post is from the team at section.io, a website performance, scalability and security platform that gives developers the control they need to achieve unmatched website speed and reliability. section.io gives developers control over their content delivery solution using tools in an easy to use interface. Who better to give us the rundown on 5 easy steps to improve site speed.
Reports by eCommerce and media giants including Amazon, Walmart, and others have consistently shown that fast page load time is one of the most critical (and often overlooked) factors contributing to site success.
Along with obvious impacts to user experience, website performance is also crucial for SEO: Google takes page speed into account for both desktop and mobile search, meaning a slow website is sure to hurt your website’s organic search ranking.
There are many ways you can optimise your website for better performance, ranging from quick fixes to more advanced solutions that require a larger investment in terms of both time and money. Here are five easy ways to improve your website’s performance and page load time.
1. Do a quick analysis of your web page speed
Tools such as WebPageTest or Pingdom will show you basic performance metrics along with exactly which elements are taking the longest time to load on your web page. We recommend running about five tests so you can understand how your website performs the first and second times someone visits it. The multiple first views will help you understand if you have a delivery infrastructure caching working, and the repeat views help you understand if you have an in-browser caching strategy set up.
Real User Monitoring (RUM) is another valuable tool that tells you the actual website speed of your users so you can understand and optimise the user experience on your website.
2. Ensure your images are optimised for web
Resize images using an image editing tool such as Photoshop or a free image re-sizer which allows you to size your images appropriately so you aren’t making users download large files.
Image optimization solutions, such as Kraken and Cloudinary, can also provide “on the fly“ image resizing and optimisation services so you don’t need to make any change in your workflow in order to deliver optimized images to your browsers.
If you use HTML tags such as a width or height specification, you usually aren’t reducing the image size on your server, only how it appears on the page. This is also the case if you are changing image sizes using a WYSIWYG tool in your CMS. Once you determine your ideal image size, save as that size. If you’re using an image editor, you can also save at 80% quality which further reduces the file size, or using an online resizer you can select options which reduce the file size by your desired percentage (we don’t recommend saving at more than 50% quality). JPG and PNG are the best file types for web.
Reduce the number of images on main pages: Landing pages such as your homepage, blog, and other pages you regularly link to in ads should load quickly and not be full of images that need to load before a user can take any other action on your website. We recommend keeping the home page simple and using CSS elements rather than images for style elements such as buttons. If you need an image-heavy homepage, you can enable “lazy loading” which will prioritize images that are above-the-fold on a user’s browser.
3. Reduce the number of third-party plugins on your website
4. Remove unnecessary code in your CSS files
5. Caching, Caching, Caching
Before sizing and auto-scaling any environment, if you are not caching properly, you are not only wasting resources but also delivering your application at sub-optimal speeds. Caching at the edge, closer to end users saves latency as well as valuable server resources.
Dynamic content caching is the gold standard of web performance, as HTML document generation is generally the slowest part of the page load and is the first request of every page load experience. The Time To First Byte (TTFB) is the HTML document delivery time. Caching this component delivers blazing fast user experiences, reduces significant server load, and results in cost savings in infrastructure – win win win.
Check your caching to improve your website speed – If you can’t tell what’s being cached and what isn’t – you have a problem.
These tips only scratch the surface in terms of methods that can be used to speed up your website. If you’re serious about optimising the performance of your eCommerce site, we recommend seeking advice from experts, such as section, who have extensive experience in more advanced performance solutions, such as dynamic content caching and edge computing.
Get in touch with our team at section.io to learn more about their best in class platform.