Images are a key component to drawing visual appeal and interest to your website, here are a few quick solutions to help overcome some common problems that we frequently come across:
PROBLEM #1 – IMAGES ARE LOADING TOO SLOWLY.
SOLUTION: RESIZE AND OPTIMIZE FOR PERFORMANCE!
If large, un-optimized images are being used in your website content this can drastically increase the load time of the pages which can cause major frustrations for your users and can ultimately lead to the loss of potential customers.
- Resize your image dimensions to match where they are being used, there is no point in using a full sized photo if only a thumbnail is needed.
- Change the quality; Image editors will normally provide the option of setting a quality option (between 0 and 100) when saving your images, the trick here is to find the right point that will provide a smaller file size whilst still ensuring that your images aren’t grainy and blurry (75% is a good starting point).
- Save as the right file type; as a general rule of thumb JPEG should be user photos and complex logos, PNG for transparent images, vectors, basic logos and block colours with GIFs being used for animated graphics and email imagery.
PROBLEM #2 – MY IMAGES ARE TOO BUSY AND DISTRACTING. SOLUTION: CROP FOR SUBJECT FOCUS.
The crop tool is your friend. Cropping an image (photos in particular) can help clearly identify the subject of the image by removing any unwanted or distracting background elements, this is especially important for e-commerce product photography.
Before you can crop though you need to start with a high resolution image otherwise the end cropped result can turn out blurry and grainy if used at larger sizes.
Pro tip: Correct photo composition also opens up a world of benefits for your imagery.
PROBLEM #3 – MY IMAGES LOOK DULL AND UNINTERESTING. SOLUTION: RETOUCH FOR VISUAL APPEAL.
So you’ve sourced some images for your website but you think they are a little dull and could use that little extra something. Good news, with a few basic tweaks you can get the most out of your images: the basics that you should focus on are:
- Exposure (or brightness)
- Saturation (to boost or tame colours)
- White/Black levels
Pro tip: although it’s tempting to use auto-adjustments they may not achieve the best results so try and play around with making manual adjustments first as this will give you a good handle on how they affect the imagery.
PROBLEM #4 – MY EMAIL IMAGES DON’T SHOW UP IN GMAIL! SOLUTION: RENAME FOR STABILITY.
This is a very common problem that we come across. We receive draft emails from clients with complaints that the images aren’t appearing. 99% of the the time this is due to the images within the email content (or the folders that they have been uploaded into) contain spaces in their names.
To fix this, ensure that when creating folders, uploading photos and adding to content that both the folders and photo file names contain NO SPACES. If you follow this simple rule: Happy days!
PROBLEM #5 – I DON’T KNOW HOW TO RESIZE OR EDIT MY PHOTOS.
SOLUTION: PIXLR TO THE RESCUE!
Let me introduce you to PIXLR. It is a FREE cloud based image editor which is packed with features, it is simple to use and has plenty of tutorials to help get you started. If you live in Google Apps (like me) PIXLR also integrates with Gmail and Google Drive!
BONUS: MORE RESOURCES
- Design School