Optimising images for web

Optimise an image on a Mac

Making sure all images are under 250kb in size

1. Open the image in Preview: Open your image in Preview by double-clicking on the file. Preview is the default image viewer on a Mac.
2. Resize the image: To resize the image, go to "Tools" > "Adjust Size". In the dialog box that appears, make sure that the "Resample image" checkbox is checked, and then adjust the width or height of the image to your desired size. Ensure that the resolution is set to 72 pixels per inch (ppi) for web use.
3. Save the image for web: To save the image for the web, go to "File" > "Export...". In the Export dialog box, choose JPEG as the file format, and adjust the quality level to achieve a file size of 250kb or less. You can preview the estimated file size at the bottom of the dialog box.
4. Preview the optimised image: Once you have adjusted the settings to your liking, click "Save" and save the image to your desired location. Then, open the image in your web browser to preview the optimised image and make sure it looks good.

If the resulting file size is still too large, you can further compress the image by using Photoshop Elements, which all staff have access to.

Optimise an image on a PC

Making sure all images are under 250kb in size

1. Open the image in an image editing software: There are software options available on a PC, including Adobe Photoshop, and Photoshop Elements. Once you have your software of choice, open the image in the software.
2. Resize the image: To resize the image, use the "Image Size" or "Canvas Size" option to adjust the dimensions to your desired size. Ensure that the resolution is set to 72 pixels per inch (ppi) for web use.
3. Save the image for web: To save the image for the web, go to "File" > "Export" or "Save As". In the "Save As" dialog box, choose JPEG as the file format, and adjust the quality level to achieve a file size of 250kb or less. Some software may also have an option called "Save for Web" or "Export for Web", which will give you more control over the optimization of the image.
4. Preview the optimised image: Once you have adjusted the settings to your liking, click "Save" and save the image to your desired location. Then, open the image in your web browser to preview the optimised image and make sure it looks good.

If the resulting file size is still too large, you can further compress the image by using Photoshop Elements, which all staff have access to.

Optimise an image with Adobe Photoshop

Making sure all images are under 250kb in size

1. Open the image in Photoshop: First, open the image you want to optimise in Photoshop.
2. Resize the image: If the image is larger than you need, you can resize it by going to "Image" > "Image Size" and setting the dimensions to the desired size. Be sure to set the resolution to 72 pixels per inch (ppi) for web use.
3. Adjust the quality settings: To optimise the image for the web, go to "File" > "Export" > "Save for Web (Legacy)" (Photoshop CC), or "File" > "Export" > "Save for Web" (Photoshop CS5 or earlier). In the "Save for Web" dialog box, you can adjust the file format, quality, and compression settings to achieve a file size of 250kb or less.
4. Choose the appropriate file format: The most common file formats for web images are JPEG, and PNG. JPEGs are best for images.
5. Adjust the quality and compression settings: The quality and compression settings will vary depending on the type of image you are optimising. For JPEGs, you can adjust the quality slider to balance file size and image quality.
6. Preview the optimised image: Once you have adjusted the settings to your liking, click "Save" and save the image to your desired location. Then, open the image in your web browser to preview the optimised image and make sure it looks good.

By following these steps, you can optimise your images for the web and ensure that they load quickly and look great for your users.

Optimise an image with Photoshop Elements

Making sure all images are under 250kb in size

1. Open the image in Photoshop Elements: Open your image in Photoshop Elements by selecting "File" > "Open" and selecting the image you want to optimise.
2. Resize the image: To resize the image, go to "Image" > "Resize" > "Image Size". Make sure the "Constrain Proportions" and "Resample Image" options are checked. In the "Pixel Dimensions" section, change the width or height to your desired size. Ensure that the resolution is set to 72 pixels per inch (ppi) for web use.
3. Save the image for web: To save the image for web, go to "File" > "Save for Web". This will open the Save for Web dialog box. In this dialog box, you can choose the file type and adjust the quality and size of the image to meet your needs. To keep the file size under 250kb, choose JPEG as the file type and adjust the quality level until the file size is under 250kb. You can also experiment with the image size to achieve a smaller file size.
4. Preview the optimised image: Once you have adjusted the settings to your liking, click "Save" and save the image to your desired location. Then, open the image in your web browser to preview the optimised image and make sure it looks good.

By following these steps, you can optimise your images for the web and ensure that they load quickly and look great for your users.