Increase website loading speed
Good website speed invites more visits from your visitors. If the website is loading slowly then a visitor is more likely not to click another link on your website. If you are an e-commerce website then this has a major impact on online sales. Most visitors associate product quality to website design and performance. Your website is the first impression for a visitor who may be interested in your product.
Good website speed improves return visitors, conversions and engagements. When you are in a online business then a slow website will damage your reputation. Having a fast website reduces the burden on your sales, customer service and marketing team.
Google ranks a website based on more than 200 factors. One of the predominant factors is website speed. Faster loading website is pushed up the search result as google thinks its search users will benefit from a much faster website. End of the day speed to information improves user experience and enhances usability. If you are searching google for something then you want it faster and a faster website in the search result further helps google search users.
Steps for increasing website loading speeds
What is the current website speed ?
Go to developer tools and check out the page load time. Load the page 10 times and take the average page load time for more accuracy.
What are current website speed for other similar website ?
Go to developer tools and check out the page load time for your top 5 competitors. Your target must be to at least get 1-second lesser loading speed than your competitors.
Why is your website not faster ?
Work with your developer and understand why your website is loading slower. Get a list of every issue that is impacting speed. Once you have this issues list you have to prioritize this list based on the most slowing issue first. Google Pagespeed Insight is a great free tool that helps get all the list of speed-related problems on your website.
What is your website speed optimization approach ?
On the issues list add the cost and impact associated with fixing the website speed. The cost is the direct cost associated with the fix. The impact can be user experience, less conversion, damage in reputation. Pick the most suitable impact reason such that it will be easier for you to prioritize.
Content Delivery Network
If you have more users from UK then it makes sense to have your servers in the UK. Hosting a website on a same server configuration in the USA will slow your website a bit. If your website users and split between different countries then you must use a content delivery network. A content delivery network stores same resources in different servers in different countries. When anyone request a resource then this content delivery network will send the response from the nearest server. This significantly improves website load speeds.
When you are new you start off with a starter plan on a shared webhost. Based on the visitors demand you gradually go premium plans, cloud, VPN, etc. If your budget permits then you could opt for a dedicated server too.
Image size optimization
Images constitute over 25% of most websites. Properly optimizing your images can significantly improve website loading speeds. Some image file extensions can load faster than others. Some image file extensions compress images more efficiently than others. Sometimes reducing the image size reduces the website loading speed. If more than 90% of your converting website users are mobile users then there is no point in having desktop image resolution sizes.
Database normalization & query optimization
More than 50% of the website have at least 10% of its page load delays directly related to database queries. Normalization of a database is a process of restructuring your tables and table relationships such that it enhances data integrity and eliminates redundancy. Query optimization is usually easy on a normalized database as compared to a database with redundant records. It is better to eliminate NULL records as it takes more space. It is better to replace large queries with stored procedures.
If you have more than one linking files then merging all into one single file is called concatenation. A typical example is you have 3 css files. You are consolidating all those 3 files content into 1 single css file. The similar approach can be performed for a js file too. Linking a file in the page lifecycle is a expensive process. Multiple linking can slow down a website significantly. When you are using a lots of third party plugins it becomes difficult to consolidate everything into one single file.
Minification is the process of removing unwanted characters from a source code without impacting its functionality. A typical example would be to remove the newline character and unwanted spaces. You can realize at least 10% of the file size reduction in a minimum 500 kb css or js file after minification.
Prefetch / Preload
Prefetch says the browser to store the asset if possible. Prefetch requests humble to the browser to load the asset now so that it can be used in the future. Prefetched assets if successfully prefetched then these assets are accessible between page requests. Prefetch is considered a lower priority as compared to preload.
Preload commands the browser to load an asset first. Let us say there are 10 CSS files and you wanted the file1.css to load first. You can specify in preload to load the file1.css first before all other CSS files.
It is hard to imagine any website not being gzip-compressed. www.whatsmyip.org/http-compression-test offers a quick test to confirm if your website is gzip-compressed. Utilizing gzip compression easily reduces over 50% of transfer size.
Cache logged-in users’ pages and other static pages. cache favicon, etc. also increases speed. You should also consider caching mobile views separately. Cache PHP resource may improve server performance by avoiding unnecessary PHP calls as most themes and plugins add resources via a PHP request.
Reduce the usage of web font
It is better to stick to standard fonts. If you are using web fonts then you may need to use some non-standard loading methods to avoid detrimental effects on your site performance. The most common problem of all is a blank screen until the fonts are loaded. One way to avoid blank loading page is to consider using preloading to enhance usability.
A redirect happens when a user is moved from one page to another. Google.com redirects you from their global website to their local website. Let us say if you are from the UK then you are redirected to Google.co.uk. This kind of redirect is unavoidable. Sometimes you are redirects are avoidable, such as moving mobile users from somewebsite.com to m.somewebsite.com. Moving toward a responsive design will eliminate this redirect. If you are on an HTTPS domain then it makes sense to always prefix asset’s references with HTTPS.
Custom 404s and eliminate 404s
When you are frequently updating your website there are good chances that you will rename a page or remove a page. This action can cause a 404 page cannot found if a person tries to access the old page. The best practise is to have a custom 404 page create which will show up everytime there is a 404 error.
Remove unused code, Plugins etc.
Checking the source code for unreachable code and eliminating it can improve performance. Certain plugins load their assets even if they are disabled.
I couldn’t resist commenting. Very well written!
This is my first time go to see at here and i am actually pleassant to read everthing at one place.