How fast your site loads for a user is a big influencer on user experience and website conversions. Especially if that user is on a mobile device. Site performance (aka speed) can be as important as having a mobile responsive website, according to multiple studies from Google and other sources.
In this post we are going to show you some of the key areas that you should look at improving to speed up your site.
Performance plays a major role in the success of any online venture. High-performing sites engage and retain users better than low-performing ones.
Google Web.Dev https://web.dev/why-speed-matters/
Image Files
You can often greatly improve site speed just by using modern image formats. WebP is a newer format that squeezes the files down to size without a loss of quality. This can be especially impactful on e-commerce sites since they will tend to feature more images on a single page.
Using the appropiate level of compression can also mean huge savings in the size of your image files. And if you are already up and running with potentially hundreds (or even thousands) of images already on your site: never fear. There are many great plugins and tools like TinyPNG that will help compress your images in bulk.
Another approach to this problem is to consider whether you actually need an image to present the information or effect you want on your site. Many amazing effects like shadows or gradients can be achieved with only CSS. They are totally independent of resolution and usually only a fraction of the size of a typical image.
Lazy Loading
Lazy loading is a great way to reduce the time it takes to load a page. In concept it is also pretty simple. Instead of loading the images on a page all at once, only the images that are near the top of the page are loaded first. After that, images further down the page are loaded. This means a user sees the page as loaded more quickly and has a big impact on the decision to stick around.
All of us can relate to trying to load a slow website and looking at only a blank screen. Is the site broken? Will it ever load? Put lazy loading in place on your site to drastically cut down on this bad user experience.
If your site is on WordPress then good news! WordPress 5.5 was released in August 2020 with lazy loading enabled by default on all images. If you aren't on WordPress you can enable lazy loading on your site with some simple code.
Javascript and CSS
Many websites suffer from having "bloat" from unused or redundant javascript and CSS code.
Fortunately, there are many ways you can reduce this waste and speed up your site.
Your style sheets code can be cleaned up by minifying CSS to reduce its payload on your site. Web.Dev has a great article that covers the basics of Minify CSS . If editing CSS files by hand is a little scary for you, there are also plugins like Fast Velocity Minify that can do it automatically for your WordPress site.
Conclusion
Site performance can be sped up greatly by focusing on a few key areas like image files, lazy loading, and bloated code. If you're looking for help optimizing your website, or you're looking to get started with a new fast-loading site, contact us at Bocohost today.