Top Ten Tips On Creating Images For Your Web Site

"A picture is worth a thousand words" - Unfortunately, poor quality images on your website can make those thousand words pretty negative ones!

We have created a top ten list of tips for you when creating images for your website:

1. Taking your own pictures - With the advances in modern digital cameras, most people feel more comfortable taking pictures themselves. If you choose to take your own product or sales photographs always try to take the best picture you can 'in camera', this means if the picture looks bad on your camera screen do not be tempted to fix problems later. Image editing software can be used to correct some issues with bad photographs, but the time required is huge compared to a few seconds to switch on an extra light or turn your subject to create a better image.
2. Buying Stock Library Images - If you do not have the confidence or equipment to create your own images then an image library can be a great resource to find professional quality images. By shopping around you can purchase high-quality images for as little as £10, once purchased online the images can also be downloaded for immediate use.
3. Image Quality - When sourcing images for your website always try to take or purchase the highest quality images you can. Some people assume that because the final image on the website will be tiny they do not need high-quality master images, this can be a mistake as some images can be used multiple times by just zooming and cropping the photo for example. Also never use images that are smaller than the size you wish to use on your website, it is possible to add a photograph and scale it up (make it larger than the original) but the results will always be blurred and lower quality than the original.
4. File Formats - When taking pictures with your camera or buying images from image libraries the file format will usually be a Jpeg, this can cause confusion as images that appear on websites are also usually Jpeg files. The Jpeg file format was designed to allow an image to be compressed (reducing its file size) with a minimal reduction in visual quality. As the Jpeg file format is a great way to make images that have a good visual quality at a small file size it is obvious that this is an advantage on a portable digital camera where memory size is limited and also an advantage when viewing a website page where slow download speeds demand smaller file sizes. The common pitfall happens during editing images, when saving images 'optimised' for the web it is easy to save over the original high-quality Jpeg assuming 'a Jpeg is a Jpeg', unfortunately, this is not the case.
5. File Size - As we now know not all Jpegs are the same, so how can we identify an original high-quality image verses an optimised one? If you look at the images that come from you digital camera even in lower quality settings the files will be between 1mb - 3mb (1mb = 1024kb). With modern professional SLR cameras take Jpeg files at 10mb - 20mb files at the highest quailty. Where as the average image on a web site is 10kb - 30kb, this is 1000's of times smaller!
6. Display Size - The final piece in the image size puzzle is the display size of the image or resolution. This is measured in a grid with a height and a width, your camera has a sensor which captures a picture and turns it into a series of tiny squares or pixels. The amount of pixels your camera can capture is measured by multiplying the vertical and horizontal pixel count together. For example, a sensor that captures 1000 x 1000 pixels = 1 megapixel (1 million pixels), the higher the mega pixels the more detail can be recorded into the final image. These huge mega pixel images are great for photographers as they can print large images at high quality. Unfortunately, when displaying images for a web site we are limited by the visitors screen, a computer monitor on average only displays 72 pixels per inche, this would mean that your 1 megapixel photo would be almost 14 inches across! Obviously, images taken straight from your camera will need to be edited before we can use them on our web site.
7. Editing your Photos - Now that we understand the basic properties of an image (Quality, Display Size, File Size and File format) we need to edit our images to use on the web. There are many free and paid editing softwares available for beginners and advanced users, we list a few in point 8, what is important to remember is that images need to be 'optimised' or compressed for web use. We would recommend Jpeg format but there are many other options dependant on your chosen software package. Please remember when editing your images not to save your optimised Jpegs over your original high quality versions, and please don't edit files directly from your cameras memory card, keep this safe and only edit images once you have copied them to your computer first. If something goes wrong during editing you can always go back to the original files stored on the camera card.
8. Free and Paid Editing Software - There are many free and paid image editing softwares for PC and Mac dependant on your budget (GIMP, Paint.net, Photoshop Elements, Photoshop CC etc), always choose a software that allows you to optimise images for the web and read online reviews if you are unsure before purchasing an software.
9. Images and SEO - Unfortunately search engine cannot understand images in the same way as we do, we can add 'alt text' (an short description of the image, usually an editable option in your web sites content management system) to images to help describe the image to the search engine but not much more. On the up side, Google's image search is very popular, if you name your image in a descriptive way and add a descriptive 'alt text' then you can receive more traffic based on image searches. On the flip side because Google cannot understand images that well, do not create pages with only images, always add content to describe the image or only add images to support articles and page content for best results.

Images and Copyright - We have left this section for last as it is the most important subject when using images on a web site.

• If you take a photograph you own the copyright for that image and can add it to your web site with no problems.
• If you have purchased an image from an image library with a license to use it on the web you can add it to your web site with no problems.
• If you find an image online and contact the photographer or web site owner and buy a license to use their image on your web site you can with no problems.
• If you take a photograph from Google images or another web site without permission you are stealing.

Some web sites offer images with public licenses that allow you to use the image free of charge if you link to the owners web site or do not use the image commercially for money making activities. If you are unsure always contact the owner for clarification, if you are caught stealing an image that is owned by someone else you can face legal action and your web site being shut down as most hosts will not allow copyright infringement as part of their terms and conditions. The web is a great place to share but image how you would feel if you visited a competitors web site to find an image you spent time creating and optimising sitting on their home page!

We hope you find this list useful, it is not exhaustive but does give an introduction to some of the concepts associated with creating and editing images for the web.

Two Plus Two is a web design company with offices in High Wycombe, we specialise in web design and search engine optimisation. We offer a free consultation call on web design and search engine optimisation for any new project you may require, simply call us today on 01494 730000.