Infographic – Website Page Load Time Optimization: A must for good UX!
Page loading time is one of the crucial factors determining customer satisfaction and ROI. Slow loading pages not only lose out on ROI, but also hamper the SEO and brand image of the company. Monks with their zeal come up with amazing infographic about different ways you can optimize the page load time.
A few tips that the infographic provides include:
Reduce the HTTP requests
According to Yahoo, 80% of a web page’s load time is spent downloading pieces of the entire page – images, videos, stylesheets, etc. That being said, simplifying your design and put less components on every page. Lesser the components, fewer the HTTP requests and faster the site. JS and CSS Optimiser is a great plugin to reduce the number of HTTP requests
Use a content delivery network (CDN)
The user’s proximity to your web server has an impact on response times. Deploying your content across multiple, geographically dispersed servers will make your pages load faster from the user’s perspective. 75% of the retail sites as per one of the surveys do not use CDN.
Enable browser caching
Make sure that the catchable resources like JS, CSS files, media files, etc. are set to be expire for a minimum 1 week to a maximum of 1 year according to RFC guidelines. With right enabling of browser caching, on subsequent visits at least the page load timing will be superfast. WordPress Plugins like W3 Total Cache is highly recommended although both WP Super Cache and Quick Cache can all improve caching and therefore reduce page loading times.
Inserting a redirect between the user and the HTML document delays everything in the page. Avoid 404 errors especially as every HTTP request will add on to a cost.
Minify the unnecessary code elements
Eliminate extra spaces, line breaks, and indentation in your code so your pages are as lean as possible. As per Google, removing unused CSS yield faster page speeds. you can minify the code using CSS minifying tools like YUI Compressor and JS minifying tools like JSMIN. Optimize the CSS sprites. Arrange the images in the sprite horizontally as opposed to vertically usually results in a smaller file size, combine similar colors and don’t leave massive gaps between the images.
You can view the entire infographic here. Below is the image version of our infographic.
Latest posts by Webby Monks (see all)
- A Comprehensive Guide To Performing UX Audit For Maximum Online Success - August 23, 2016
- Website sliders: Loved & hated, Still Omnipresent! - August 5, 2016
- Infographic: The Monk’s Pathway To Website Pre-Launch Nirvana - July 27, 2016