Saving images for Web
Save your image at a quality sufficient for Web use, but not too high - or the file size will be unnecessarily large.
When saving a photograph or image for use on a website, it should be optimised so that it displays (downloads) quickly at a sensibly low file size, but without any image degradation resulting from too much compression.
The most common web image file type JPEG (.jpg) can be set at a particular Quality which is configurable when saving the cropped and resized image.
- for relatively large images such as banners, a Quality setting of 50 or lower should be adequate
- for relatively small images, a Quality setting of 60 or higher is often best.
- ensure the colour mode is set to RGB (some browsers will not display other colour modes, such as CMYK)
If using Adobe Photoshop as your image editor, use the Export | Save For Web (legacy) option which allows you to set the JPEG Quality. Use the Progressive option when available - this allows the image to render in successive, higher-quality 'passes' as the page loads.
Other image editors will have similar Save settings.
Other image file types such as PNG or GIF have different methods of optimising file size - ask Webteam for help if necessary: webteam@uhi.ac.uk
Adobe Photoshop Save For Web settings for a JPEG large banner photo image.