In a previous post I showed you the results of running Google's Mobile Friendliness Test on the home pages of the websites of the 6 New England state tourist boards.
Google found the Connecticut site ctvisit.com to be slowest-loading (16 seconds), with an estimated 33% loss of visitors attributable to the long loading time.
Google offered to provide a full report with suggestions for reducing the site's loading time by about 3 seconds, and we took them up on that.
But stop a moment: a 3-second improvement would lower the loading time from 16 seconds to 13. And per Google, the 30% most mobile-friendly US travel and tourism sites have an average loading time of 5 seconds.
There's plenty of research showing that significant percentages of users will begin to abandon a URL after a 3-second wait. Opinions differ as to how much of the page needs to load within 3 (or X number of) seconds - but 13 seconds to get the page fully loaded is too long.
This page needs a design change.
It has too many images.
However, since every little bit helps, here are some of Google's recommendations:
Reduce page weight by:
- Compressing images
- Optimize images using a tool like the ImageMagick convert binary
- Convert non-animated GIFs to PNGs
- Use a video format instead of animated GIFs
- JPEGs:
- Reduce quality to the lowest acceptable level
- Reduce chroma sampling to 4:2:0
- Use progressive format for files >10K bytes
- Use grayscale for b/w images
- Enable gzip compression on your Web server
- Minify static resources using:
- HTML: HTMLMinifier
- CSS: CSSNano or csso
- JavaScript: UglifyJS or ClosureCompiler
Reduce number of server requests by:
- Leveraging browser caching of data for 1 week to up to 1 year using:
- the Cache-Control general-header field
- the ETag HTTP response header
- Eliminating render-blocking external JavaScript and CSS files in above-the-fold content
- Put fast scripts with small content inline vs. external
- Make JavaScript asynchronous
- Defer loading of JavaScript until after initial rendering of the page
- Use inline styles in lieu of small external CSS files
- Don't put large data URLs inline
- Avoid inlining CSS attributes on HTML elements
- Avoid landing page redirects
Make a quick first impression by:
- Loading visible content before CSS and JavaScript files
- Reducing server response time to under 200ms
Wow! What's the poor Connecticut marketer supposed to do with those recommendations?
I'd say: armed with them, convince whoever has bottom-line responsibility for your organization to put Web developers and marketers in a room to work out together ways to make the website load faster - and thus retain, and sell to, all the prequalified leads your advertising and marketing brought to the site but who left while waiting for the site to load!
PS - No software vendor whose product was cited by Google and then by me in this post has paid me for the mention.
- David
