… especially when your business activities are difficult to photograph.
When I decided to go with the website design of having a banner image, first banner image I chose failed in a big way. I chose a photo that had the two major components I needed: a variety of people and computers. But, the photo was too tall and it really didn’t communicate what my site was about.
The image you choose for your home page banner should have two elements: 1) it should deliver the message of what your site is about, 2) it should fit the size of the banner comfortably and without loss of the message.
What Image Should I Choose for my Website Banners?
When your business message is difficult to photograph
If you are selling goods, such as guitars, the content may be obvious – a photo of a guitar. But, what if your guitars are handmade and the price is thousands of dollars? The photo should be the quality that you would submit to a color, glossy magazine, not a snapshot.
Even some photos of goods may need more than a photo of the product. I recently bought my husband a thing called a “holdfast“. It looks like something the grim reaper would carry. I had never heard of such a thing, but it is something used for a woodworking bench. A photo of a hand-forged holdfast is best if it is in context. That is, if it is shown positioned on a workbench.
In other situations, it is normal to choose a photo that is meaningful to the business owner, but easy for the viewer to misunderstand. For example, I had a client who bred horses for a specific rodeo event. Her product was 4-month old horses. The first idea was that a photo of mares and foals in a lovely outdoor setting would convey the meaning of the site. In fact, it would convey an aspect of the business, but we had to dig deeper to, “What are your clients really buying?” They aren’t just buying a sweet little horse, they are buying a horse with a specific lineage and body configuration. So, we used an action photo of one of the mares in a rodeo event.
When an Icon you Choose Doesn’t Communicate
Example 1
Many years ago, my daughter wanted a hat she had found on a website for her birthday. When I went to the site, the home page was covered with crests, such as you would find on the liner of a fine hat. There were no photos of hats visible until the viewer scrolled down the page. Every time I asked my web development students what message that crest delivered, many of them would respond, “Beer”. Several beers have a crest design on their cartons, bottle labels and cans. That crest was a matter of pride to the company, but it didn’t communicate what they expected when it was out of context.
Example 2
I was looking for an icon that I could use to represent a rodeo prize. Competition with horses is an area where I have very little knowledge. This is a common situation where a developer could easily choose the wrong image. My first thought was to use an image of a rosette, but then my lack of knowledge prompted me to check with someone who has first hand experience. She let me know that my mental picture was not correct for rodeo. I’m so glad I asked.
These examples illustrate why web development is a collaborative process involving the website owner, the developer and testers.
Finding an Image that Fits the Space
There are two main strategies in a home page image or slider, 1) use a very large image that pretty much fills the first screen, 2) use a very horizontal, short image that allows the viewer to see additional features on the page. If your banner image is a very horizontal image, such as this site uses, there is an additional problem in finding an image that not only communicates, but that can be tightly cropped and still communicate.
An outdoor photography student/client found this to be a very big problem. Most of his photos are scenics from wild places and national parks. To communicate the majesty of the locations requires the full photo. So, only a few of his photos work for banner images. 
In the case of this photo of tipi poles, is this crop good enough to use or not? Partly, it depends on the context.
What Banner Images Did I Choose for my Web Development Website?
Some possibilities I considered:
- Small business people – close, but not specific
- Computers – close, but not specific
- Images of client websites – this could be easily misrepresented because there is turnover in clients
- Abstract images – nice, but no message
So, I decided to go with #1, but with a text message over the image. Not a perfect solution, but a solution. What isn’t perfect about it?
- Flattening the text into the image means that it’s not helping me with SEO.
- It’s time consuming to find stock photography that can be cropped to a very short, horizontal image without losing important parts of the photo.
Thanks to Ohio Woodlands forthe use of this beautiful walnut slab photo!
