An exciting benefit of our lovely new web site is the opportunity to draw your audience in with enticing images. So as you start to think about how your pages will look, take a moment to consider your pictures. Are they the right size and format, and of good quality? Are they relevant to the information on the page, and will they draw the user in?
- The majority of web publishers will be dealing with content images that sit within the main text area of a page.
- Images that are 400px x 320px (or 320px x 400px depending on the orientation) work best in the content area. This is more of a guide than a steadfast rule as each page is different.
- Images should be no bigger than 50KB each – a maximum of 750KB worth of images per page.
- Resize images before uploading them to the CMS rather than using the editing tools in Squiz.
- You can resize images using Microsoft Office Picture Manager by clicking on the Picture tab at the top of your screen and going to the Resize tab. Or, open your image with Adobe Photoshop, if available, and click on the Resize tab under Image in your top menu bar.
- Make sure you “Smush” your images before uploading them (http://www.smushit.com/ysmush.it/). This online program compresses the file size and optimizes images for the web, which will reduce the time it takes for your page to load. Alternatively, if you have access to Adobe Photoshop, you can save images “for web and devices” by going to the File tab in the top navigation bar.
- Quality is crucial. When you look at your current images, make sure they are in focus and not pixelated. Stretching images to make them bigger will cause some pixelation.
- The preferred image format is JPEG. Most small digital cameras and mobile phones will save photos as JPEGs for you. If this is not the case, open your image using Microsoft Office Picture Manager and hit Save As under the File tab at the top of your screen – then click on the Save As Type drop-down menu and select .jpg from the list.
- Consider the relevance of you images. This Jakob Nielsen eye-tracking study: http://www.nngroup.com/articles/photos-as-web-content/ confirms that images with no importance or relevance to the content are ignored by the reader. In other words, adding “fluff” images to improve the look of your pages will not draw your audience in. However, images that are relevant to your information can spark interest, break up long sections of text and engage the reader.
We are working on a complete Style Guide for web publishers but in the meantime, if you have any questions about images, one of our friendly team members will be happy to help.