Speed up your website by blurring images
This trick will give you a faster site. But be warned, it isn't always appropriate, says Jamie Mason.
Blurred areas lend themselves well to how JPEGs compress images, and increasing these blurred areas will help slim images and achieve higher rates of image compression.
This can be done using tools such as JPEGmini and ImageOptim. This optimisation is normally applied in subtle peripheral areas but can be used for larger areas when it is editorially appropriate (i.e. when doing so won't change the context in which you want to present the main subject).
Consider some different possible contexts for the stock photo shown above, where we see a group of people stood behind a man reaching out to greet us.
- If the image is to promote the man at the front who is a politician, then blurring the features and identities of the other people won't dilute that message. It could even help emphasise the message by putting focus on him and affirming that the image is about the individual and not the group.
- Conversely, if the image is to be used to represent the staff at the local branch of your bank, and welcome new customers, this approach wouldn’t be appropriate. It would be harmful to the bank employees' efforts to build a personal relationship with you if you couldn't recognise their inpidual faces.
These are both extremes, but hopefully serve to demonstrate the technique, its effect, and the kind of trade-offs you have to consider when deciding whether to apply it.
In most cases you should be able to use your judgement to identify inconspicuous areas to help boost compression in some small way.
Words: Jamie Mason
Jamie is a front-end developer specialising in JavaScript. This article was originally published in net magazine.
Like this? Read these...
- How to build an app: try these great tutorials
- Free graphic design software available to you right now!
- Brilliant Wordpress tutorial selection
Thank you for reading 5 articles this month* Join now for unlimited access
Enjoy your first month for just £1 / $1 / €1
*Read 5 free articles per month without a subscription
Join now for unlimited access
Try first month for just £1 / $1 / €1
Get the Creative Bloq Newsletter
Daily design news, reviews, how-tos and more, as picked by the editors.
The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of eight full-time members of staff: Editor Georgia Coggan, Deputy Editor Rosie Hilder, Ecommerce Editor Beren Neale, Senior News Editor Daniel Piper, Editor, Digital Art and 3D Ian Dean, Tech Reviews Editor Erlingur Einarsson and Ecommerce Writer Beth Nicholls and Staff Writer Natalie Fear, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq.