Welcome to measurement Mondays. Our opportunity to share some best practices, educational information and talk about all things related to measurement to start your week. In this week’s measurement Monday post, we will be reviewing some of the different metrics used when evaluating a website’s performance.
Performance Measurements
Website performance is important to both your users who want fast and easy-to-use websites and to search engines that use performance metrics as part of their algorithm for ranking websites organically. It has been posited that 4 seconds is the benchmark against which sites are measured and even less for mobile load times. With increasing data speeds, improved wireless connections and higher performing devices, the desire for instant gratification has grown. We no longer wait for modems to “dial up” and won’t stay on web pages that take a long time to load regardless of our connection.
There are a number of things you can do to improve your site performance. First, submit your website to a performance analyzer such as Google’s PageSpeed Tools. Google will tell you exactly where you can improve your performance for both Mobile and Desktop versions and outline what elements are blocking or hindering your performance. While some performance issues can be related to your website hosting environment and server, others are directly related to how your website is built.
The greatest drain on performance and load time is linked resources. Style sheets are utilized to make websites visually attractive and readable while scripts can make website more fun, interesting and useful. However, each time a browser encounters a script or stylesheet tag, it must look up the file, open the script engine, read the content, compile the code, report back to the browser and display the results. This may only take milliseconds but it can add up and that equates to page load delay and performance issues. As such, it is a good idea to utilize as few linked resources as possible to reduce the number of “requests” as well as “minify” or compact the resources to save bytes of data thus speeding up the download, parsing and execution process.
Images can also severely affect website performance. We want our sites to be visually engaging and beautiful and have high-quality, colorful images. But these images can slow a site down considerably. The key is to find balance between visual loss and file size using different file formats, sizes, and compressions. While Photoshop can do a lot of image optimization via its “Save for Web” interface, we have found that Kraken.io offers a great free web tool for further compressing images. For resizing and scaling images, especially if Photoshop is unavailable, we’d also recommend BeFunky.com’s photo editor.
A way to reduce the number of images used is to employ image “sprites.” An image sprite is a set of images combined in one image file to reduce the number of server requests the website needs to make. Displaying the desired parts of the sprite is then achieved using CSS positioning.
Below are the web performance grades for Mashable.com according to QuickSprout’s analyzer as well as the load times, files sizes and requests for linked resources. As you can see, even large, popular sites like Mashable can suffer from poor performance and page structure.
Websites can also improve performance using caching. By leveraging browser caching, resources that are commonly used can be stored on your visitors’ browsers which can reduce page load times for repeat visitors. Each resource should have a caching policy defined via Cache-Control headers, which outline whether the resource can be cached, for how long and if the caching expires and any ETags (Entity Tags), which web servers and browsers use to determine if a cache matches the server version of a file.
Conclusion
Overall, when evaluating your site performance, look at the load time for your scripts, images and CSS files as well as the size of each and the number of requests made. Consider where you can combine files and minify them. If your site is still having performance issues, check your server response time and consider gzip compression or talk to your web host about your server and its resources. Run page load testing once a month and continually make improvements. Your users and the search engines will thank you for it.
Next week, we’ll take a look at the key metrics for measuring user behavior and website analytics. In the meantime, please let us know in the comments what metrics you are tracking on your site and how you have adjusted to maximize your site’s performance.
Your competition just Googled “how to plan a website.”
Beat them to the punch with our Ultimate Guide to Website Planning and Maintenance
