March 17, 2004 | View Comments (32) | Category: Design
Summary: Images and design
If you could not tell I have never been a man to use a lot of images (or any) on a site. I seem to lack the "total creative vision" necessary to implement them to their greatest effect. However, when used properly, images help to greatly increase the experience of the site in dramatic fashion. I am not talking about ecommerce sites that have images of their products, but any kind of site that has an image that does not have to be there, but is there and helps give the site its feel. A great example of this is Dunstan's site with its header image. A horrible example of this is the new Project Gutenberg 2 site.
Never should an image be used just for the sake of it, but only to enhance the design. In the case of the PG2 site, there are images that in the designer's mind would help carry across the message and idea of PG2, but when your website begins to look like a collage the whole message gets lost.
One designer that I know of that uses images in probably the most effective way I can think of is Didier Hilhorst. I have had the pleasure of seeing a couple of his latest creations (maybe he will show the world one day, but here is an example) and the way he uses images almost tells the story of the site. However, the images never get in the way, yet it is hard to imagine the site without the images.
Many web design firms like to create their own company sites with some person smiling at you or working on a laptop. Is this good, bad, or overplayed? I would go with overplayed and most of the time it does not even go along with the message. For example:
We are a web design firm that focuses on simplicity and aesthetics. We keep design simple and have high regards for usability.
*img of guy with his laptop*
Is there a reason for the image or are we just putting it there to "fill the page?" Maybe this is why I shy away from a lot of images because I just simply can not think of ones that would enhance the message. Maybe I am just too message-oriented or I just have not been taught the "designer's guide to picking and choosing images". How do you go about choosing images and why even use them at all (yes I know there are reasons, I am not Nielsen)?
sidenote: This is not big news I spoke of yesterday. I think I will wait till all the party people at SXSW get back in as I will need a lot of suggestions for this one.
Trackback URL: http://9rules.com/cgi-bin/mt/mt-tb.cgi/178
I think the *img of guy with his laptop* is suposed to personalize the site, or something like that. As if to say 'yes, we are real people too'.
Its like that small blurp in a catalog about there great customer service and/or sales reps with a pic of this apparently pleasant to talk to, smiling person on the phone, usually wearing a headset. In that blurp they tell me that they have plenty of people waiting to answer the phone so I won't have to wait to long on hold. If that is the case, what is the likelyhood that I will actualy get to speak to the one person pictured? Why couldn't they include a group pic? Is that the only employee that looks pleasant to talk to? Is that really an employee or just some model hired for the pic? As employee turnaround is general high in such jobs, is that person still there? You get the idea.
So while these pics don't realy need to be there, they are not totaly bad. Although I have to say they can be. I've notice a lot of sites with rotating banners recently advertising that broadband telephone service (??Vontage?? or something like that??). The adds only show mugshots of people that have no association with their product. If the people were at least using a phone I could maybe assume that all the various types of people pictured as the add rotates use there service. But no such indication can be found. In at least one of the 'mug shots' the women's face is all scrunched up and not attractive in any way. This would certainly not move me to consider purchasing their product. At least the catalog example can be somewhat encouraging to the perspective buyer.
On the PG2 site: Yuck!! And to think all those people did all that beutiful work on Version2 all for not. Even many of the entries I did not like would do compared to that.
waylman (http://achinghead.com)
Just to clarify real quick the PG2 site has nothing to do with the original PG site. They just stole the name.
Scrivs (http://www.9rules.com/whitespace/)
I am for minimal use of images as well. If the site has a need for it, I will in corporate them, but tastefully.
If a site happens to be lite on content, images can make it or break it. Same applies if a site is heavy on content. If you have 20 items on your homepage and you want to have a thumbnail along with each of them, that gets to looking kind of cluttered, and possibly confusing a user and causing them to flee your site and never return.
It is difficult to state a definite situation that would require or not require images. It really has to be taken on a per-site basis.
Jeremy Flint (http://www.jeremyflint.com)
oh thank goddness that's not the project gutenberg that last month's redesign was for! pg2 is uuuuugly! and takes a while to load for those of us with dialup (sux).
andrea (http://mellowtrouble.net)
My pet peeve is stock photos of picture-perfect smiling' people shot from above so it can show their whole body but still emphasize the artificially-whitened teeth. I admit the idea was cool for the first 1000 designs that used it, but now it just says 'cookie-cutter'.
Of course, to a business client does that matter? Where a designer thinks 'played out', a user might well think 'professional'. That said, PG2 is a flat-out horrible design with or without gratuitous images. What's with the weird blurred edges everywhere? yechhhh!
Gabe (http://www.websaviour.com/nexus/)
>takes a while to load for those of us with dialup
Hell, it takes forever to load for those of us on a T1.
Personally, I'm with Scrivs. I have a hard time using images effectively. The problem is that I know a good look when I see it, but I don't always know why it looks good, so I struggle when I'm trying to create something workable from scratch.
Paul G (http://www.relativelyabsolute.com)
Most larger businesses use stock photos rather than taking their own... we have a few of our own, but it's only $400 for a disk of fairly diverse images and costs a heck of a lot more for a professional photo shoot where we're only going to get a small number of individuals... we'll do it for some things, but generally not the website (I think on our website we have had 3 photos of people that we took, and we've had to remove or alter two of them because the people left the bank -- it just doesn't pay to have employee photographs on a website
How we choose photos -- it's tough. We have hundreds of pages, and each page has an individual 180x200 photo which is specific to that page. I have a library of 2,231 stock photos that I can choose from on my hard disk, and the CDs with the high-resolution versions next to my desk in case I want to do one that's an extreme crop. If I can't find anything in that, I can contact our marketing division, they have probably 10-20 times the number of disks I do; alternatively we can pick royalty-free photos from getty images and order them if need be (we prefer to avoid it unless we need enough to justify buying a complete disk).
But I do make sure each photo has some relation to the content of the page, whether it's direct or symbolic, and that the same image isn't used more than once (though I'll freely admit to using the same source checkbook image on 3 different pages and changing the tint and rotation and degree of cropping)
I'm pretty darn sure that when we redesign the site, it's going to have a heck of a lot fewer photos.. we didnt know what we were getting into when we started the project, we expected maybe 50 pages, not 400+
JC (http://thelionsweb.com/weblog)
1. dear god that gutenburg site is gross...i think i stepped in something.
2. stock photo of smiling people w/ laptop = plaaa-aaayed...out. its gone beyond obligatory, right into "patronizing". customers know it too.
3. my thoughts on site imagery vary with the effect sought. if the focus is the writing, then the image has an obligation to support the story, and in some cases it can be simpler to show rather than tell. of course, image as interface is utilitarian, and i love to see that done well(like on this here site). also, image tastefully done as decoration, so as not to distract, can be nice too. images can be powerful and i think it takes real skill and intuition to use them correctly. maybe thats why in the olden days graven images were forbidden...who knows.
Devastatin Dave The Turntable Slave (http://www.submunition.com)
When you say images, do you mean specifically photos? or graphics also? I think this is an important distinction.
In general, I try not to use photos at all unless they are for informational purposes. I think that stock photos can often give a site a stock look.
However, I am trying to incorporate more graphics into my designs to "spice things up" a bit. Background images, h1s and h2s, bullets. Replacing some of these elements with images can help make the page more interesting and create a stronger brand.
clint (http://www.516media.com/)
Eh, it depends, Dave. We have smiling woman on laptop using our online banking site (ain't photoshop grand?) on a page promoting electronic banking, for example.
I thought about really messing with people and taking a screenshot of her looking at the page with her picture containing a screenshot of her looking at the page with her picture. and continuing ad infinitum. But I'm far too lazy for that. :-)
JC (http://thelionsweb.com/weblog)
So, I'm not a designer, and have no training in design, but it seems to me that a few well-chosen images serve a similar purpose as whitespace: they give the eye (and brain) a bit of rest from all the text. After all, the physical world around us is not a bunch of text (or Matrix-style flying bits).
Jennifer Grucza (http://jennifergrucza.com)
My feelings on images has always been this: Use imagery to back up what the copy is saying, plain and simple.
That changes if you have a site which needs to be based on the images (design agency, photo studio). Then it seems to me that you should use your imagery to tell the story. Picture's worth a thousand words, etc.
The standard stock photos (smiling people, laptop woman or man) are something that corporations like because they're fairly cheap and can be used over and over again. I'm not really bothered by them too much. I do find it funny when I see sites or marketing material that have a stock photo you've seen somewhere else, or perhaps used on a project!
Todd (http://www.monkeyhouselounge.com/loungeact/)
I think you have to really play it on what the industry or audience is expecting. Business sites, in particular are similiar in the photo styles they use. Try looking at several web counsulting companies for example. They'll all, for the most part, have the obglitory person staring at a laptop or group (team of consultants) of smart, yuppy looking people looking at you.
I think a major part of building sites that are useful and usable is building a site that looks like it "belongs" within the community or industry. If that means having the smiling customer service person w/telephone headset bust shot - then that's what you do.
Speaking of busts...
Alanna, cute picture. But, given the hype you put out there - in particular, the spash page for your site - I would've expected something more risque.
Mark Fusco (http://www.lightpierce.com/ltshdw)
You mean like this lady, Mark (and Todd)?
In addition to taxforms.com, whatever that is, we use her, comcast uses her, and I've seen her on at least half a dozen other sites. For partial justification, I can say that we chose the pic because she looks just like one of our call center employees.
JC (http://thelionsweb.com/weblog)
JC -
That's a bad image and an equally bad treatment, but yes that's the idea.
Bigha does a better job.
Mark Fusco (http://www.lightpierce.com/ltshdw)
IMHO Gutenberg site is more sellable. It is a little too heawy, but only blogs should be 99% tended on content. And anyway, the grey text/white background is allready kinda slipping away, just like the blue+orange backgrounds color sheme whas a top style few years ago.
I agree with waylman- images MUST be used for personalising a site. There are not so much combinations what you can do with two background colors, a few 1px lines and plain Verdana text.
Optron
Optron -
The images themselves aren't bad (well, with the exception of the stacks of books and the tablet-pc at the bottom, that's just a really bad clipping job) it's how the montage was put together, ie - the heavy shadow on the title text, how Gutenburg is just "slapped" on top of the building, the digital press text not wrapping around the badly clipped bottom image, and the "all books" table border cutting into the tablet-pc - which makes it look bad.
Mark Fusco (http://www.lightpierce.com/ltshdw)
not to mention that I don't think any of the images are optimized.
Though to be fair, it *was* on the front page of /. today and may still be suffering from server overload
JC (http://thelionsweb.com/weblog)
Although not directly related to images, and I think speaking somewhat to the point I think Optron is going, Jason has a great post worth looking at.
To bring it into topic to your post, images are appropriate when they:
1. Give you a break (as Jennifer - the non designer pointed out
2. They convey in part (or whole) the message / information your audience is seeking
3. They provide some call to action for the company
Remember, not everyone can read as well as you. More importantly perhaps, is not everyone reads the same language as you. Images can play a strong role in conveying to a visitor what you're all about. Even in the bad example of the Gutenburg 2 site - if nothing else it gets across the message that this is something about electronic printing and books just through the medium of images only.
As Jason put it, it's all about the human experience.
Sorry for the novel.
Mark Fusco (http://www.lightpierce.com/ltshdw)
Mark, I am the purest soul ever created by the copulation of a penis and a vagina. I don't know how you came to an utterly different conclusion. :)
As to be on topic - images. yes. they be nice.
Back to working overtime!
Alanna (http://www.virginmoistness.com)
Alanna -
As a man who's old enough to be your daddy, and as someone who's about to have a daughter of his own - I can't tell you how happy I am to hear (read) that about you.
Sincerely.
Mark Fusco (http://www.lightpierce.com/ltshdw)
ya images....
Well sometimes they are good, sometimes not. I always said when discussing css and NS4, no design is a lot of the times, better than a bad design.
I don't think it a question of bandwidth anymore, you pay 80$/month for tv, come on pay 40$ for high speed, just an opinion.
It is however a question of the client. MOST people don't think of design guidelines. You do obviously do, you have a blog, so you are obviously on here more than most. But Clients, most of the time, are not. And when talking to you the designer, they automatically become a better designer than you are, because you don't do this 24/7, right?
Don't get me wrong, I think your site is great. It loads fast, I get what I want, but most "clients" would get another designers opinion, who wants the job, and comes up with something like pg2 and all of a sudden, the deal is done.
So then you have to become good with images so you are satified and so is the client. But in the end do what you will and the ones who like you will come to you.
ya images...well up yo you
dan
Oh my God! Thats PG2 site is horrendous and repulsively ugly. Honestly, at first glance, I thought it was a defaced (one of those hacked) sites, but upon closer inspection, it unfortunately was not the case. Such a pity that PG has been tarnished with something that horrible.
prasnation (http://www.prasnation.com/cinematicrain)
I've found that stock photos are getting very played out, especially those in a “business” setting. You know the ones: a group of people, all happy, in a meeting, all exactly racially diverse and non-threatening. At my last place of employment, this was par for the course, in addition to pictures of the company’s building on nearly every page, as if somebody from Minnesota really cares about what a building in Orlando looks like.
I still like to use stock imagery once in a while, but now I take a harder look when deciding whether I should use it on a page or not. I’m also noticing a trend towards line art and vector drawings instead of traditional photography. I like that trend personally.
Vinnie Garcia (http://blog.vinniegarcia.com)
The racially diverse bit is necessary... even if you're a 100% caucasian business with only caucasian customers in the middle of minnesota or something... you don't want to be sued for or even accused of discrimination, and there are always lawyers looking for a nice juicy company to ruin, even if no one else of any race cares about the ethnic content of your website.
We try to avoid photos of people if we can, to avoid the issue entirely, but it's hard with so many pages with photos. Last year, though, we found a few disks that were ethnically diverse and useful for our industry at the same time, so we loaded up on photos from that disk to help balance things out some. But we are a fairly diverse company with a pretty diverse customer base, so it's good to represent everyone, even if their representatives in all cases are people who've probably never even set foot in our region. :-)
JC (http://thelionsweb.com/weblog)
The racially diverse bit is necessary... even if you're a 100% caucasian business with only caucasian customers in the middle of minnesota or something... you don't want to be sued for or even accused of discrimination, and there are always lawyers looking for a nice juicy company to ruin, even if no one else of any race cares about the ethnic content of your website.
To be honest, the “racially diverse” part isn’t a big deal to me at all. I can just see how it adds to the whole “patronizing” factor from a customer viewpoint. You know you’re never gonna see those stock image people if you walked into that company, and I think that is what gets to people. I’ve also seen a lot of sites that use their own employees/management in their imagery throughout the site. I think it can add a lot to the perception of a company when the people you see on the site are the actual people you’re in meetings with. To me, it shows a greater level of transparency within the company. Maybe it’s just me though. ;)
Vinnie Garcia (http://blog.vinniegarcia.com)
Using your own employees is a major problem unless you're a very small company or maybe an extremely large one (and only using executives)
First, you have to get their permission and have them sign a release... then, if they leave the company, you need to remove them and find new pictures. And unless you have the images professionally done, they just won't look as polished as good stock photography. And that doesn't even get into the privacy and safety issues of having an employee's photograph on her company's website (stalkers, anyone?).
We have a few pages that have photos of our employees (some departments are as bad as realtors, their photos must be on *everything*), but only as portraits. As I noted above, every time we've used an employee in a photo other than a portrait, we've had to change it several times because of an employee leaving or something.
I've never once gotten the impression from anyone that they consider stock photography in websites (or for that matter in print ads, or the actors in commercials or ) to be "patronizing" in any way. Frankly, anyone who thinks that has some issues. No company is going to go out of their way to be patronizing to customers or anyone else... what an utter waste of time and money that would be, and with no benefit! I've seen people (myself included) who find it amusing, but not something to get bent out of shape over.
It's just a fact of life. You don't usually see employees of companies in commercials because they can't act, if they could act, they'd be actors, not windshield wiper salesmen or computer programmers. (and of course, there are exceptions, but of the small number of commercials that use employees -- or owners -- only a tiny percentage of those don't look really amateurish).
JC (http://thelionsweb.com/weblog)
oh... should note. On our intranet, we have lots of employee photos in various places (and of course in the employee directory so you can see who you're going to be having a meeting with or whatever). But that's for the employees, not the customers.
JC (http://thelionsweb.com/weblog)
Coming from the journalism world, images should only be present if they contain content and the content of the image works with the content of the text (note: they don't have to be the same message, just complimentary).
There is a difference in reading modes between print and online.
With a magazine cover or a newspapers front, images and headlines have to grab your attention as you walk buy them.
With a Web site there is no real equivalent of walking buy... if you're at a site you made a conscious decision to come there (either via typing in a URL or by search...).
In that case, we can use the headlines and content-driven images to guide the reader through the page... help them find the content they're looking for.
I think, all too often, the "guy with a laptop" and its brethren, don't really add to the content of the page or help guide the reader.
That's a roundabout way of saying, use images when you should :-)
Chris Heisel (http://www.heisel.org)
I'd like to add the discussion of color to this string of comments. A color scheme is very important in a website, as it helps to define an identity, which we all know is essential to get repeat visitors. I would think that it would be different to define a color scheme using only text and background colors, etc. A nice bold image with a solid blue background or a nice green grass really helps to develop a color scheme in my opinion.
And as for the PG2 site - what is this world coming to?
thomas (http://gendes.elivy.com)
Keep track of comments to all entries with the Comments Feed
©2003-06 9rules, Inc. | Thoughts Feed | Notes Feed
Amazon Stores: Powertools | Jewelry | Books | Health | Landscaping | Kitchen | Movies
#1
Dear God, the Gutenberg site is positively repellant. No images at all would be better than that.
I think images are useful when they quickly and cleanly convey something -- be it an idea, a brand, or something else -- that would be messier to do in words.
JS (http://12frogs.com/)