When we talk about how to “optimise” images for the web, you can think about this in three ways:
- making them look good
- making them load quickly
- making them easy for search engines to index
Ideal Image Size #
You won’t need in most cases to make your images any bigger than 1024px but if you want to have something bigger, aim not to go over 1500px, but in generally if you set to 1024px you will see your image file size reduce from the original images.
You want to keep your image file sizes below 1mb.
You can also optimise your images by reducing the ‘information’ they contain using a quality percentage guide so that the images dont use up so much file size space but still retain their quality so they dont get fuzzy, a lot of photographs contain meta data that you dont need, especially for a website.
You can use a site like tinyjpg.com to remove the extra data that isn’t needed on your website and help you reduce the file size, (after you resize the pixel size of your images) which should make them smaller file sizes and load quicker on your website.
How to Optimize Images for Website #
Online Tools for Optimize Images #
Applications for Optimize Images #
Photoshop #
If you have Photoshop there is an inbuilt option to ‘Save for Web’ which helps you get the best sizes and quality, there are tutorials online covering this option, such as https://thecontentworks.uk/optimise-images-for-web-photoshop/
GIMP #
A Free image application available from gimp.org
Pixelmator #
A good alternative to Photoshop at a much lower price with most of it’s tools, including ‘Save for Web’ available from pixelmator.com
Naming Image File name #
After you have optimised your image file and pixel sizes it is a good idea to name your new optimised files with a title related to its content rather than the default that a camera or your phone gives it.
So for example an image of a youth group standing outside their building could be named ‘youth group in front of smith centre-1024px-web.jpg’, including the pixel size helps you make the new imagine unique as well as making it easy for you to tell what size your images are.
Naming your files with related titles can also help people find your website in the search engines results as they are indexed alongside your website pages and are linked to your website.
Note #
*Please note while I have linked to these websites and applications I do not endorse any of the websites or products, and as always take care when visiting websites or downloading applications