How To Prepare Images For Your Website
What is the most common reason for slow loading website pages? Images not being optimised.
Despite all the various tools available to compress and shrink image sizes, a large proportion of web images are just loaded in without being optimised and result in websites loading slowly, and ultimately leading to higher bounce rates off sites (where the user leaves your site without doing anything).
So why is it important to optimise, title and compress images BEFORE loading them into your website?
If you have a 1mb image that you place on a webpage then your device (phone, laptop, desktop) needs to download the image in order for you to see it right? Well if you have an image that is 1mb, and an optimised version of the same image that is 100kb, then one will take 10 times longer to download than the other. That may not make a big difference if you are at home on your superfast WiFi, but if you are on your mobile and using your 3G or 4G signal to download webpages, then you are going to have a slow-loading page on that device. Given that over 50% of traffic will be mobile, you had better make sure your pages load fast. Google also takes into account page speed when ranking sites, so really the question should be ‘Why are you NOT optimising your images for websites?’
Think about how wide your image really needs to be. In most cases, even for featured post images, 800px is enough. If are placing images amongst text you could go narrower. Obviously, the lower the width of the image you are placing, the smaller filesize it will be. Most programs you are using to manage your photos will allow a ‘save for web’ option that will reduce the image to 72dpi (low-resolution). Don’t use Word or Excel to process your images. It’s not what they are designed for. Most computers come with photo-editing software that will have the ‘save for web’ option. If not, there are free software options online like GIMP.
To compress the size down even more you could try an online tool such as jpeg-optimiser.com or jpegmini.com setting the quality to about 65% compression.
Try and get all your big images (like backgrounds and full-width header images) down under 100kb, and your in-page images down to under 50kb. It’ll be worth it.
When you are deciding on a title for your image, put your Google hat on. The title of the image should reflect the keyword(s) or keyphrase(s) you are promoting on that page. Then, importantly, you need to give it a ‘alt-tag’ when placing it on your website, this is very easy to do when importing an image into WordPress, you just type whatever ‘alt-text’ you need into the box provided in your admin panel when you upload. Again, Google hat on, the alt-tag should reflect the keywords also.
If you optimise your images (compress size and only use the size you need), title and give them alt-tags that correctly promote the keywords you want, you should expect to see better Google scores for your pages.