You don’t have long to make an impression with your website. In fact, you only have 3 seconds for your page to load before users abandon your website.
3 seconds is a long time if your site isn’t optimized for speed, and page weight can play a big part in that.
Optimizing your site to reduce the weight of resources that are loading behind the scenes can be straightforward if you know what you should look out for.
That’s what this guide is all about. Read on and find out everything you need to know about de-bulking your website and optimizing it for your users.
Before you decide to make changes to your website, you should analyze your site’s current performance by running a full site audit.
This will give you an idea as to how fast your site currently loads, and determine what areas you will need to change to improve the speed. It’ll also give you your site’s current ‘weight’, the total size of your page’s resources.
It’s the size of the site weight that has an impact on your speed. If you can reduce it, you can improve your site loading time, but only if you start with a figure to move down from.
Use a weight measuring app to help you complete your audit, such as those mentioned this guide on site speeds.
Remember to test your site using both mobile and desktop profiles, if the testing tool you use offers it. Your site, if it’s responsive, will load with different resources on mobile than on desktop, and you’ll need to verify load speeds for both.
With your site audit concluded, it’s time to make some changes to your website to reduce the page size.
Your images act as one of the main guilty parties behind a slow-loading site. They’re often the largest files that need to load, so a good option to deal with this problem is to compress your image files where possible.
You’ll need to do this in a way that doesn’t reduce the quality, but you should consider if the file sizes you currently have are appropriate for the sizes that load on your pages.
If images are being “squashed” to fit, you may be able to reduce the overall size of the image, which will make it quicker to load.
Alternatively, you can compress the images to reduce their size. This will reduce the quality of the image, but you’re not likely to notice much difference unless the percentage reduction is extreme.
Tools for image reduction, like those referenced here, can help you to compress your site images with ease.
Following a web page size check, you should take a look at your page design and ask yourself an important question – what do you actually need to keep?
Your site content adds to your page size, whether it’s text, images, video or the code underneath. Removing anything you don’t need from your page will help to reduce this, and reduce the time it takes to load your page as a consequence.
It may be that you have unused or redundant code or images that load when they’re no longer necessary.
Whether it’s a design choice or a functionality choice, consider whether you can reduce your site load by removing any content that no longer offers anything useful to your site design or your users.
Running a content management system like WordPress? Run a similar run through, focusing on unnecessary plugins or scripts that might be slowing your page down.
It might be quirky to include various custom fonts on your webpage, but by doing so, you’re likely causing your page load time to increase.
That’s because, if you don’t have the fonts you need installed, the website will have to load them from an external source. Custom fonts, by nature, are unlikely to be installed, adding to your site load speed.
To avoid this, use any custom fonts on your page sparingly. Two to three fonts are acceptable but don’t load any unnecessary fonts onto your page if they’re not being used.
It’s a simple, quick fix that can help to reduce your size’s weight without affecting your design or content.
One of the major sources of custom fonts for web designers is Google Fonts. If you’re interested in using them on your website, take a look at the Google Fonts FAQ for more information.
Another option to reduce your page’s weight is to “minify” your code.
Minifying simply means to cut out anything your code doesn’t need. Spaces, formatting, comments and useless code are all removed for the sake of speed and size.
So, too, are complicated design names in your code. Everything that can be done to reduce the size of your code files, including HTML, javascript, and stylesheets will contribute to a quicker page load.
You don’t have to be expected to do this yourself, as there are tools like these that will optimize and minify your code for you.
You should also think carefully about the kind of external content you embed into your site pages. Social media embeds, like a Twitter “tweet”, can add additional bloat to your code.
Optimizing your code shouldn’t just be about making it load as quickly as possible. Follow these instructions and use the opportunity to boost your site’s search engine optimization efforts, as well as optimize your code for speed.
We’ve already talked about how you can optimize your images on your website by compressing them and altering the size, but another opportunity for you to improve your web load speed is to change the file format of your images entirely.
Images tend to come in two types of formats – vector and raster (or bitmap). Raster graphics file formats (like JPEG and PNG) are designed to blend together with better colour combinations, based on the size of the image as it’s created.
Vector, by comparison, works with shapes and blocks that have defined lines and sizes when they’re created. They can be expanded, or shrunk, in size and look exactly the same. These usually come in the SVG file format.
SVG files won’t lose quality, and they tend to be a small size, but they’re not great for vast amounts of varying colours (like a photograph).
JPEG and PNG files will satisfy most of your image requirements, as they can be small in size, be compressed if necessary, and offer far more colour choice.
If your content is fairly static across lots of pages, or you have a lot of repeat visitors to your site, you should set up your site design to encourage web browsers to cache the files.
This simply means it’ll save the files ready for the next time they need to load, lowering the time it takes to load your site a second time. There are a few ways to go about doing this.
If your site is a basic HTML design, you can add a “Cache-Control” setting to a meta HTML tag at the top of each page. You might be able to set your web server to automatically instruct web browsers to cache files, too.
Caching takes on a slightly different form if you’re using a content management system like WordPress, however.
Instead of your users needing to load WordPress with all of its plugins and content directly, pages can be cached on the server to load as one static page, reducing demands on the server or WordPress database.
Various WordPress plugins, such as WP Super Cache, offer this capability. It’s designed to speed up your site for the end user and reduce the weight of each page.
An easy way for you to help reduce your page loading times, and make your site weight seem more manageable, is to transfer some of your static resources onto a content delivery network.
Using a CDN means that content like images, stylesheets or other code files load from a server nearest to your user’s location. The pressure on your web hosting reduces, and your files will load for your users quicker.
It also means you can allow for an increased size weight if you find it necessary, but not by much if your aim is to achieve the best site speed possible.
However, if content loads quicker for your users from nearby servers, your users won’t be as impacted, thanks to the reduced site speed overall.
A CDN can help reduce the load on your website and make it load quicker, but only if your other content is served by a high-quality web host. If you’re looking for a new business host, check out our hosting plans.
One of the largest file types to load, that could impact on your site’s performance when loading, is video content. If you’re hosting that content on your own web server, you should look to move it elsewhere.
The reasons for doing so are similar to the reasons for using a CDN.
Rather than have the demand placed on your own server, hosting it on a video hosting service like YouTube will mean the content gets loaded from a server closer to the user.
It’s also going to reduce your bandwidth usage on your own server if you host it elsewhere, as well as cut down on the amount of code you’ll need to include.
Our guide to website bandwidth should help you understand why bandwidth plays an important part in your site loading speeds.
Embedding your own videos will mean adding code that allows it to play back within your web pages. Embedded videos from third-party providers like YouTube will have smaller, optimized code that can be placed on your site with ease.
When you visit a website, all of the content it needs will pre-load, ready for the user to access. This is why your site weight plays an important role in site loading speeds.
What if you could turn that on its head by reducing the content that loads immediately? That’s what so-called “lazy loading” is designed for.
Certain content, like video or images, will only load when the user clicks to play, or when the page is scrolled downwards. This reduces the site loading time for your users.
That way, your overall initial site weight (and so your initial loading time) is reduced, and your users will notice the site loading quicker as a result.
Lazy loading is just one way to help you reduce site loading times for your users. Take a look at our helpful guide on ensuring a fast load time for your website.
If you’re thinking about including ads onto your page, you should consider the impact this will have on your site weight.
The more ads you include on your pages, the longer your site will take to load. Content that is bandwidth-heavy, such as video ads, will increase the time needed for your page to load.
Avoid video ads where you can, and optimize any embedded content (such as the code or images you have to include) where possible.
Most ad networks will allow you to choose the kind of ads that load on your site. Restrict yourself to smaller sized ads (smaller size meaning smaller footprint on your page size) and only use them sparingly.
If you’re not sure of the impact ads will have on your page speed, run an audit of your site speed with ads on and off, to compare the difference.
It might be important for your site to look good, and to have content your audience wants, but if it’s too slow to load, the majority of users aren’t going to stick around to find out.
For businesses, that means you’re losing customers. Reducing your page weight means reducing the content you load and making what does load better for your audience.
Compress your content, use better file formats, host some of your content using a CDN and if you’re using a CMS like WordPress, avoid using too many plugins.
Want to optimize your Irish business website with hosting that can give your site the speed boost it needs? Look no further. Get in touch with us today to discuss what we can do to satisfy your hosting needs.
