10 Tips To Choose and Use Photos on Your Web Site
July 14, 2011 | Design Basics, Web Design
A critical piece of many web designs is photography. Photographs really can be worth a thousand words because they have the power to immediately convey emotions, give a sense place, describe a feature or product in detail, illustrate a concept or set a tone. All without having to read a word.
Professional photography can help make your whole brand looking more professional, while cheap, poorly shot photos can really make a bad impression.
If you cannot afford custom photography, you are probably going to rely on either royalty-free photos or the non-professional photos taken by you, your staff or your clients. Both of these options can save money, but plan to take some time to select the best images and to present them in a way that will add relevance and visual interest to your web site design.
Ten tips for using photography effectively on your web site.
- Avoid cliched, overused images and ideas. Because royalty-free photos, by their nature, are not created specifically for your project or concept they tend to have very general concepts behind them: business, teamwork, global network, etc. Therefore low cost royalty free photo sites are filled with photos that are too cliched. Adding an image like that does nothing to distinguish your company, product or service from your competitors. And in many cases it really makes you look worse.
- Make sure the people look real. Photographing your own team is always a great idea if it’s possible. However, you may not have the budget for a custom shoot, or you may not have the set-up to make it ideal. But if you turn to stock and royalty free photographs to represent either your own business or your clients, make sure you are realistic. Do all or your clients look like models? Do all or your employees dress like fashionistas? Probably not. There are plenty of more “everyday” looking models that are featured in photographs.
- Beware of subjects smiling at the camera. Another way to help make things look a little more “real” is to avoid photos where the people are looking at, and smiling at, the camera. Once they start mugging for the camera, it takes away from the idea that you’ve caught them acting natural.
- Crop images to focus on what’s important. As a graphic designer and web designer, I nearly always end up cropping a photo rather than using at exactly the size and shape that it is provided. Trimming the edges (cropping) allows you to focus on the part of the photo that’s most relevant. It cuts out any distracting background images or other parts to an image. It can also create a more unique look at the subject.
- Try different shapes. Most photos come in a format that’s around 3:5. They are basically a pretty balanced rectangle. By cropping them into something different, they become more unique. You may want to try photos that are wide and panoramic, or tall and skinny, or square. You’ll need access to a photo software tool to do this.
- Make sure the photos are crisp and not fuzzy or out of focus. Many small business owners use photographs that they take with their own camera or photos supplied by clients. This is a great way to have photos that are truly unique and feature your own products, people, locations, etc. However, if the photo is blurry and not in focus to begin with, it’s just not going to work. Immediately disregard photos that are out of focus because it’s nearly impossible to fix.
- Do basic photo editing to clean up red eye and brighten if necessary. Poorly lit (dark) photos are also a problem when using non-professional images. Also, people can have red eyes. Both of these sometimes can be fixed with an editing program. Either fix them, or do not use them.
- Make sure images are scaled correctly. There is nothing sillier than looking at photo on a web site and having it look like the people are standing in front of a fun house mirror. Sometimes, when adding a photo to a design layout there may be a predetermined size and ratio that the photo must be. If it does not fit that size and shape it is either cropped or scaled to fit. If you are working within specific sizes like this, make sure you size and crop outside of your web site’s CMS for the best results.
- Keep the resolution low for faster loading. The content management system for your web site may allow you to upload a very large image file and it will scale it for you. However, the data behind that image is probably still stored with the image making it act like a very large file, even if you are seeing it small with in the web site’s design. If you are working with large images (and it can be a good practice to start with high resolution images) make sure you crop and bring the resolution down to avoid slow loading graphics.
- Realize you can’t fix all photos; start with high-quality images. Many people have the mistaken notion that with digital photography and Photoshop you can just fix any image and make it look good. Unfortunately, it’s just not possible. For example, an image that is too dark and too out-of-focus to begin with probably cannot be salvaged because there is just not enough data there. Other times people want to photoshop out or photoshop in something in an image. While this is not impossible, you need to realize that you’re basically turning a photo editing job into an illustration job: you need to recreate whatever is missing in the photo. While something like some clouds and sky can be done easily, something complex like a hand would take some serious work.
Great photography can help tell the story of your brand, but poor photography just detracts from your professional image. If you decide to use photographs on your web site, make sure they are well-lit, in focus, and cropped appropriately. Also make sure they are adding to your message, not just using cliches that add nothing to your brand’s unique story.