Why is your website speed is so important?
A few extra seconds could have made a huge impact on your ability to stay your visitors from the bounce and make sales.
Studies show that from 2000 to 2016, the average waiting time has dropped from 12 seconds to 7 seconds. For 2017 onward, most of the website reader expected to see your website respond within 1 to 6 second. Your website should be showing some things instead of nothing to keep your visitors to stay on your page and keep reading. You have little time to show your reader and convince them to stay on your website.
This is the probability of bounce rate show by google
Source: Google/SOASTA Research, 2017. Think with Google
Understand the concept – Why a website loading speed is slow?
There are tons of factors that impact website loading speed. Most of the time, website loading slow loading are impacted by a few important criteria: web page size, page HTTP requests, files request, web hosting respond time and so on. There are many different steps you can take to increase your speed and improve the user experience.
The killer that affected your loading speed is always PAGE SIZE.
Page Size – Mainly images that aren’t optimized for your website. Those original photos can have huge file sizes. The file format and the compression ratio you choose in your editing software, you can decrease your image size by up to 8x. Which mean if your web page file size is 8MB, you can reduce it to 1MB. This could impact 70-80% of your website loading speed. Most of the time you can feel it on your own is because you keep browsing your website with your own computer, and the browser like chrome will store the web page cache and automatically prefetch when you browse your own website. However, a normal user who is visiting your website for the first time may not have the same experience.
What is the first step and where to get started?
You must have the tools to let you know, how many requests needed for your page load and the file size on every time you load on the web page and so on.For optimizing process, we recommend you to test your website speed using tools like PageSpeed Insights, GTmetrix, Pingdom.
After you run your website speed test, you might be wondering what’s a good website speed that I should aim for?
A good page load time is under 2-3 seconds. For a benchmark, let meet it within 7 seconds as the basic for 2017 google statistic. However, the faster you can make, the better it is. A few milliseconds of improvements here and there can add up to be a big improvement on your website.
1.Reduce Image Size – Optimize Images for Speed
Images affected your site speed. Original images often very large files, which can slow down web page load times. If you own an eCommerce website, you probably think of the images is very important for your website, there is no way to remove them or lower down the file size that will affect your visitors’ experience.
Here are the 2 things you may consider;
- Use .jpg instead of .png
.png image is the uncompressed format, uncompresses format will be higher quality with a higher file size. so it will take a long time to load. Compare to .jpg is a compresses format, which can give you a better in smaller in size that helps your website load speed. - Use compression software/tools
By using compression tools, you can make a huge difference with the same image without losing the quality of the image.
For Your Reference:
Image Format | Image Size |
---|---|
Non-Optimized PNG | 200 KB |
Optimize PNG | 150 KB |
Non-Optimized JPG/JPEG | 100 KB |
Optimized JPG/JPEG | 85 KB |
Compress PNG | 120 KB |
Compress JPG/JPEG | 45 KB |
The chart is for your reference, as you can see the HUGE difference in your Image Size, this can affect your website speed performance. For example, if your website support with 1300px, you only need 1200px max for most of the photo. There’s no need to upload images much bigger than that if they’re not going to perform well in the limited size.
What Image Compression Tools To Use?
There are plenty of compression tools to use in the markets, here are some suggestions from us;
Adobe Photoshop comes with a feature to save images for optimized for the web. You will be having the option to control the quality of the image. *Suggest checking with “Optimize Option” to get the smaller size for better performance for your web page use.
TinyPNG is the free web version on image compression tools, they are using the smart lossy compression technique to reduce the size of your PNG and jpeg files. All you have to do is make an upload and download after they ready the convert. They do have API to convert images or plugin if you are using WordPress for example.
JPEGmini is also recommended, as they are using recompression technology which significantly reduces the size of images without affecting the original quality. Compare to TinyPNG, the after compression image size will be bigger compared to Jpeg mini. It depends on your business, if you are using your website as a catalogue, JPEG Mini may be suitable for you. They do support API for automating process too.
After optimizing images, what next?
You probably get to lower your web page size with 50%, if your web page featured with few images, and has not done any images optimize before. After images, you may focus on http requests.
2.Minimize HTTP Requests
An HTTP request is made for each element, so the more on-page components, the longer it takes for the page to render. You can check the http request using the tools previously mentioned, such as GTMatrix or using Google Chrome Developer Tools to see how many HTTP requests your site makes.
If your website request number is too high, you may find ways to reduce the number of requests. Look through your files and see if any unnecessary request, may consider removing it.
3.Consider Minify and Combine Files
You can reduce this number by minifying and combining your files. This will reduce the total number of files and file size. Instead of access to 3 files, you website currently access to only 1 file.
Source: How to combine CSS, https://varvy.com/pagespeed
By doing this, we went from a webpage that required three CSS files to load to a webpage that only requires one CSS file to load. Hence, this will significantly increase the speed of access to your hosting web file and it will affect the final loading speed of your website.
If you are a WordPress user, you can just install a CSS / JavaScript that will help you optimize all of this work for you.
4.Choose The Right Hosting Plan
Most of the website owners choose the cheapest hosting to host their website. For the new website that serve few visitors, that is okay. If your website is serving up to thousands of visitors per days, we suggest you get to premium business hosting for better response and smoother respond for your visitors. This is the easiest way to manage a hosting with almost VPS respond of speed. It still depends on the content you are hosting, if the content is heavy with images, video, heavy css, it will slow down your website load time too.
What content are you hosting?
Plan the content you wish to host before choosing a web hosting! It important to understand what kind of service your website needs, the kind of server you need for your audience. You can still upgrade later on, find for the hosting plans that sufficient for your need or above your need if you have more budget. There are reasons why you need a better hosting plan for your business. First, is the uptime guarantee, your website needs to be up at least 99.9% before we talk about speeds. Second, will be the website security, choose the hosting provider that will provide your website with better security to avoid losing files or getting unwanted malware or virus. A good web hosting plan can help to block malicious activities, and also giving helps when you need it.
Choosing a good hosting plan does affect your online success!
One-second delay in page load time yields:
11% fewer page views
16% decrease in customer satisfaction
7% loss in conversions
Source: 20 Ways to Speed Up Your Website and Improve Conversion, Crazyegg
When looking into hosting, Exabytes have 5 different options:
Website Builder Hosting – For beginners who need to host a website, but lack the technical skills and knowledge to build one with drag and drop without technical knowledge
Shared Hosting – For shared hosting environment, your and other website owners shared resources of the server to serve your visitor
Premium Business Hosting – Still hosting in a shared hosting environment, having better respond high-end server with larger memory and processing power and also less tenant in the server.
Virtual Private Server – Also refer as VPS, your own the dedicated amount of resources of the server, and runs your own copies of an operating system. You having the admin access to control your virtual server.
Dedicated Server – You have the entire web server for your business use. This allows for best performance, as you have all the server’s resources entirely.
Colocation Server – You will purchase your own server and have it house in our data-centre, we help on network uptime, power support, and also the backup.
I hope you get something useful to help you increase your website loading speed. Only reading make no changes, apply and let us know the results in the comment below of this post.