Images are an important part of websites.  They can help your site look more attractive and get across your message in a way words cannot match.

However, it is important that you realise that images can also be a website negative if they are not produced for your website correctly.

Images can take some time to load, so you must ensure that any images uploaded onto your website are web optimised.

You should also ensure that you use the correct image format for the type of image you are uploading.

Image Formats

SmartSpace accepts the following website formats;

• .jpg or .jpeg - Use this format for photos of people, places and products,
• .png - Use this format for graphics which have clear well defined lines and colours,
• .gif - As for .png.

You should always save your images using lower case names and extensions, using only alpha-numeric characters with no spaces.

Image Size and Shape

You should always try to produce an image which will fit well into the desired space.  Different websites have different shapes and proportions so each case is different.

If you are uploading images using the image upload tools, it is the proportion of the images that matter, as the image can be resized in the upload process.

We recommend that images be no larger than about 1000px wide and 750px high.

If you are uploading images via FTP (only graphic designers have this option) you will need to size the images prior to uploading as this system does not resize the images.

You will need to use a photo editor to be able to crop, resize and optimise your images.  Use the link below for an excellent free photo editor.

When installing the program, ensure that you prevent the installation of any toolbars or extras that may come with the program.  They can be very hard to get rid of after they install.

* It is worth noting that images taken directly from digital cameras are usually NOT suitable to be uploaded directly to a website as they will be far too large to view quickly in a webpage.

A digital camera image will typically be 2 - 10 mb (about 2000 - 10000kb) whereas an image for a website should not be larger than about 100kb (that is anything up to 100 times smaller than the digital camera image).

http://www.serif.com/free-photo-editing-software/

Preparing Images

When using the image editing software to prepare images for your website, you can do a number of things to reduce the size of the image.

1. Reduce the physical size of the image;
   • You will normally find an image sizing selection in one of the main program menus,
   • Ensure that you maintain the aspect ratio of the image so that the image remains in proportion.
2. Crop the image;
   • Cut a specific area out of the original image using the crop tool.
3. Optimise the image;
   • Most programs have a selection which enables optimisation of the image,
   • It might be called Save for web,
     • Optimise image,
     • Reduce image.
4. Reduce the quality of the image;
   • Most image editing programs enable you to select a quality setting,
   • For .jpg look for a percentage setting (use between 50% and 70%),
   • For .png and .gif look for the number of colours that are used to create the image.

Saving the Images

Once you have edited the image, save it in a specific directory.  It is best that you create subdirectories which mirror what you want to appear on the website.

If you plan to bulk upload the images, you need to ensure that the saved size is as small as possible and less than 100kb per image.  If they are any larger, they will take too long to download into the webpage, annoying and possibly forcing your clients to leave your website before they have fully viewed your offer.

If you are uploading your images one by one using the image upload tool, you may leave the images as large as 1 mb (as long as you are resizing);

• Always select one of the resize options unless there is a specific reason you need them larger,
• When uploaded, they will be reduced and saved (except in some specific cases) in multiple sizes for different circumstances.

Using the Right Image

In many cases, SmartSpace can be configured to use different sized images for different purposes.

For example, product images sizes can be set in the e-store and product category configurations so that you get the most out of your images.

Once configured, SmartSpace selects the correct sized image for the job.

Embedding Images

When embedding images in content or descriptions, make sure you select the correct sized image for the job.  The images that are seen in the top level of each album are the largest of the images on the server.

If the image you require to embed does not have to be large, open up one of the album subdirectories.  The Preview subdirectory holds the largest of these smaller images.

Do not just resize a larger image to appear smaller on the page as it still takes as long to download, even though it appears small.

Selecting the right image will mean that your page opens quicker, meaning more regular visitors staying longer and visiting more pages.