My Recipe For Web Design
September 27, 2004 | 
39 Comments
Summary: Defining Web design with a fun little recipe analogy. Yummy.
Defining Web design is hard.
It’s something I’m asked to do fairly regularly and it’s always a tough one to nail down. I usually speak vaguely about a discipline that incorporates Information Architecture, User-Centered Interface design and graphic design into one cohesive whole.
But, let’s face it, it’s not usually as simple as that!
I’ve looked at all the various info-graphics and diagrams out there, but none seemed to convey my thoughts on Web design. So I decided to have some fun with it. Analogies are good fun, and since I used a recipe to help talk about learning Web design, I decided I’d go ahead and create a recipe to help define Web design.
Hope y’all like stir-fry.
Basic Ingredients
- 2 tbsps Solid Goals
- 1/2 Cup User Research
- A liberal dash of Competitive Analysis
- 2 cups chopped Information Architecture
- 2 cups sliced user-centered Interaction Design
- 1-1 1/2 cup Visual Design sauce
- 1 cup diced User Testing
Directions
- Begin by gathering your ingredients. Make sure you have them all available and easily accessible. Each one is important in its own way and while you can eliminate one, it will result in a less than satisfying meal.
- Once you’ve gathered your ingredients, you should take a frying pan and pour in your solid goals. Be sure to coat the surface of the pan equally and adequately.
- Now, stir in your User Research and add your Competitive Analysis. Stir fry until slightly tender.
- Add your Information Architecture fry until cooked thoroughly and golden brown, stirring in your Interaction Design as needed along the way.
- Mix in your Visual Design sauce to taste. Be careful here, too much will leave your dish to spicy, too little and it’ll be too bland.
- Bring to a boil over a Web standards and development best practices flame, reduce and simmer until done.
- Serve over warm content, top with User Testing, and add a nice glass of cold Return On Investment.
Allergy note: For those semantically allergic to the ingredients above, feel free to substitute you’re own personal favorites. Information Design, User Interface Design, Graphic Design and many other related ingredients will work fine as well.
A Bit of Explanation
Notice my recipe is a stir-fry instead of a cake. That’s because baking is a science that doesn’t leave a whole lot of room for interpretation. With a stir-fry you can adapt, revise and season to taste. You can make do with what you’ve got on hand, even if you may have a preference in ingredients. It’s more of an art. The basic ingredients need to be there in-order to have a delicious outcome, but aside from that there is plenty of room to get creative.
I don’t think there is one way to “do” Web design. For example, taking this recipe as a baseline, if you had a client that likes it spicy (wanted more color, flash and imagery) you could add more Visual Design. Make mine five star baby!
In this particular recipe the “meat and potatoes” are represented by Information Architecture and Interaction Design, with the Visual Design providing most of the spice and flavor. These three make up the core ingredients of Web design. The others are important, but most of the work, most of the volume, as far as Web design goes, is in those three parts. Obviously the content is a big part as well, but it’s part of another process.
So there you have it. Sounds pretty yummy doesn’t it?
If you enjoyed my recipe, you might get a kick out of Nathan Shedroff’s Recipie for a Successful site. There are lots of good ingredients in there as well.
Filed under: Web Design
Comments
1. Erik said:
Dang, now I’m hungry.
Posted on September 27, 2004 12:31 PM | #
2. Nick Finck said:
Ok, so I am a bit of a finicky eater here… I just don’t find that as tasty as the rest of you. I guess everyone is entitled to their own opinions and such, right? Maybe I just need to, as Keith suggests, sub out some ingredients.
I think I would also go so far as to change the title of this recipe from “Web Design” to “User Experience” after all, Web Design rarely encapsulates IA …at least in all the places I have worked it it has never. To me Web Design rests solely on that “visual design” ingredient.
SO, if we are talking about UX and not just web design, a missing ingredient may be “web development” …you know, the nuts and bolts of building web pages (css, xhtml, javascript, etc)… maybe show a cutting knife and a fork or something hehe
All in all, it’s a pretty good visualization Keith. Though I would certainly add a fifth of vodka for dealing with the client at times.
Posted on September 27, 2004 01:06 PM | #
3. Keith said:
Nick – I wondered how long you’d take to chime in. You really are a finicky eater aren’t you, in life as well as online! Heh. I’m not surprised you took issue with this, not at all. Not that there is anything wrong with that. You just sit somewhere where you see a narrow slice of what I see as a whole pie.
You and I are going to have to agree to disagree on this one. I imagine all sorts of IAs are not going to like that I lump IA inside of Web design.
It’s not that hard a concept to grasp, but Web design (in my opinion) is absolutely not solely visual design, as you assert. But then again, IAs just love to put things into boxes.
I consider myself a “Web designer” and yet I do much more of what you’d call “information architecture” than I do “visual design”. I like to look at “Web design” as the umbrella, and in a kind of holistic manner. Many disciplines working together and all that…
That is where we disagree and probably always will. No surprise there and it’s all good! ;)
As to the vodka. I thought about saying something about taking Tums or Rolaids, but…
Posted on September 27, 2004 01:18 PM | #
4. Nick Finck said:
I actually agree with your point there Keith. I just think it’s a mutual thing, you also see a very narrow slice from where you are sitting hehe ;)
I guess I can summarize it up from a comment that one of the web designers here at work said “I like having IAs on the team because it helps free up my time to focus on specifically visual aspects of the design” …which tends to suggest she, as a web designer has done IA in the past.. or at least some IA.
…so I guess it depends on what kind of team you have, how many people are on it, and how specialized each person is.. right?
Posted on September 27, 2004 01:31 PM | #
5. Dale Cruse said:
Tasty indeed.
I prefer the dish served different in one way: I like my warm content ON TOP of the rest of the dish rather than on bottom being smothered by everything else.
I like my design and interaction, etc., to support my content rather than the other way around.
Vive le difference!
Posted on September 27, 2004 01:39 PM | #
6. Keith said:
Nick – There is nothing about this recipe that limits the amount of cooks. It was not my intention to imply a solo afair. You, as an IA would fit right in there with an interaction designer and visual designer as part of an overall process. Maybe that is where your “issues” lie.
For your team, you’d have no “Web designer” – you’d have an IA and a UI/Visual designer, for example.
Dale – Of course. Don’t take it too literally. When you eat a str-fry you want to get a bit of the whole thing right? ;) But you’re point is well made and one that I feel goes without saying.
Posted on September 27, 2004 02:02 PM | #
7. Kyle Fox said:
Argh, Keith, you just made my point to Nick.
I see this as a great “unbrella” way to look at it, just like you say. There is no reason why you can’t have 10 people fit right into your recipe as SMEs or whatever.
You talk about where you sit. I don’t think that makes a differece, this could work no matter what you’re job title is – it’s all about “Web design.”
Great post.
Posted on September 27, 2004 02:05 PM | #
8. vanderwal said:
I like the analogy as I was talking to a friend over the weekend and we commented the best web developers and application developers (in the broad sense) are either good cooks or musicians. Good cooks know to prep their food so everything is at hand. Good cooks also understand their eaters and how to adjust recipies for varied eaters and still manage to make a meal taste great. Good cooks also take pride in their tools, understand how to best use their tools, and how to improvise if their favorite tool(s) is not available. Understanding the each of the ingredients is extremely important and knowing how to select the best and/or freshest ingredients can make an okay meal turn fantastic.
Posted on September 27, 2004 02:15 PM | #
9. Nick Finck said:
Thomas: part of the reason why I use the term “web craftsman” in reference to what I do… be it IA, “Web Design”, web development, or whatever.
Posted on September 27, 2004 02:42 PM | #
10. Keith said:
Nick – I like “Web craftsman” as well, but the point of this post was to define the process or practice of Web design. Not to describe the job of a “Web desinger” or “Web craftsman”.
It’s not about the cook(s), it’s about the recipe. ;)
Posted on September 27, 2004 02:50 PM | #
11. Darren said:
The definition of a Web Designer has always been vague in my mind…
I’ve always labeled myself a Web Developer. Of late, however, I’ve come to the realisation that perhaps I’m actually a Web Designer.
I’m a ‘front-end’ person. What this means is that I not only use the ingredients you list but also:
Surely a web designer is someone who can design the look (interface) and then write the code to do the feel (look & feel).
That means a web developer is someone who builds all the backend stuff, no? The framework, databases, etc…?
I’m just throwing these ideas out…
After saying all that I still think I’m going through an identity crisis…and am more confused than before.
Posted on September 27, 2004 04:51 PM | #
12. Nick Finck said:
Isn’t the process/practice part of the job?
Just because you have a good recipe or several recipies it doesn’t mean that this makes you a cook… much less a chief. ;)
I agree that we disagree here.
Posted on September 27, 2004 05:21 PM | #
13. Keith said:
Nick – Umm, what? I’m not sure I understand what you are trying to say. How hard is this to understand? I just got threw telling you that this wasn’t about a single person or a job.
I guess if you can’t separate yourself from the process I understand, but I don’t see how you can disagree with something I didn’t even say.
I’ll repeat–this isn’t about a particular position or job function, it’s about an overarching philosophy and process. You said:
Just because you have a good recipe or several recipes it doesn�’t mean that this makes you a cook�, much less a chief.
No shit, Sherlock! (and I think you mean “chef”) However, I just got through saying it wasn’t about the cook. If you botch my recipe (or your own) there isn’t much I can do about that.
If you don’t agree with my particular view, that’s fine, but lets try and stay within the scope of the discussion. Which isn’t about defining your job role.
Posted on September 27, 2004 06:21 PM | #
14. James C. said:
Am I the only one who thinks that Nick is trying, unsuccessfully, to hate on Keith’s game? Wonder why that is?
Hang in there playa, I got your back. I don’t think I agree with all the lables you’ve got, but I get the general gist and think it’s a good definition.
I’m more of a content focused geek myself, although I do appreciate the effect a good, clean, usable design can have. Posts like this are fun and interesting to read – gives us a little peak into a talented “Web craftsman’s” head.
keep it up!
Posted on September 27, 2004 06:37 PM | #
15. Geoffrey said:
Huh? That sounds like a big, fat sweeping generalization. I guess it would be funny if it were true.Posted on September 27, 2004 07:28 PM | #
16. Keith said:
Geoff – Isn’t that what IA is all about? Big, fat sweeping generalizations? I kid, but for some reason IAs have a really hard time defining themselves and for some reason Nick (being an IA) can’t seem to reconcile his place in the Web professional world with my definition.
Fine by me. I’m a Web designer who does much more IA than I do visual design. I see myself fitting into my recipe at various points right now. If I worked with Nick where they have a bit more of a silo-ed structure, I’d probalby be an IA that did nothing but IA.
Nick seems to think this is the norm, and I’m not sure about that. In fact, in my 10 years in the biz, I’ve never worked with an organization (internal, external, etc.) that works that way.
Doesn’t mean it’s wrong, in fact, I’m sure it’s a great way to work if you have the resources. Either way it shouldn’t matter as I’ve done my best to leave lots of room for interpretation here. If Nick could get past the fact that I’ve put IA under an embella called “Web design” and get past the semantics, he’d probably see he fits right in.
The bottom line is that I think it works for how I see Web design and that’s pretty much the goal of the post.
Mileage may very and all that.
Posted on September 27, 2004 08:38 PM | #
17. Geoffrey said:
I guess our field does have a bit of an identity problem, I just never have the time to sit down and figure out all the nomenclature. I’m more of a generalist anyway, but I see Nick’s point. Though “Web Craftsman” sounds a tad pretentious to me. I’ve always felt that the term “craftsman” should only apply if you get your hands dirty on the job, as in actual dirt. (Or at least splinters.)
As you said, semantics… ;)
Posted on September 27, 2004 09:27 PM | #
18. Keith said:
Geoff (and Nick) – Yeah semantics are a bitch. But really this isn’t about a job title. I could really see the point if I were defining the title “Web designer”, but I’m not and that is probably where it real confusion lies.
I’m more of a generalist as well, but I work in teams and can see how it would be great to have people dedicated to each part of the process.
Then again, it wouldn’t be as fun as it is to work on different aspects…
As far as even bothering to figure it out, I’d not have spent the time either if I wasn’t constantly asked about it. ;)
Posted on September 27, 2004 09:34 PM | #
19. Nathan Woods said:
Hmm… I’d have to agree with your analogies. Most User Groups are nuts. :-)
Posted on September 27, 2004 10:24 PM | #
20. ankifunki said:
so we webdesigners are we called IA?????
Posted on September 27, 2004 10:27 PM | #
21. Keith said:
ankifunki – No. IA, to me, is an essential function of Web design. Again, I’m defining the process or act of Web design NOT the job title “Web designer.”
Posted on September 27, 2004 11:11 PM | #
22. ankifunki said:
well said keith…..so we are called web designer only, but the designing part we do is called infomation architect….no???
Posted on September 28, 2004 02:25 AM | #
23. Amit Deshpande said:
Whoa! Slurp….
Whets mah’ appetite!
Posted on September 28, 2004 03:40 AM | #
24. calin said:
interesting recipe!
so you are trying to say that web design includes usability studies as well right? and web Usability as a science as well?
Thanks for the tasty web design definition :) the featured links were insightful as well
Posted on September 28, 2004 06:14 AM | #
25. Keith said:
anikifunki – this isn’t about job titles. You can call yourself what you like. IA isn’t Web design, but IA is part of the Web design process. You could be an IA and never work on a Web site I imagine, but if you are designing and building a Web site you (or an IA you work with) should do some work in the IA area.
But then again, this is how I see Web design, you could see it differently and be just fine!
calin – yes, usability studies, in some form, are usually part of my Web design process. As far as Web usability being a science, sure, why not?
I think one thing I can say to help clear things up (I said this was hard to define) is that I don’t think, by any means, that IA, ID, usability and visual design are somehow limited to being part of Web design.
All I really mean is that they are essential parts of a Web design process.
They can easily extend beyond, above, and around Web design. I just look at “Web design” as the overarching term to define what it is to produce a Web site. It seemed the most logical term to me.
I’m not sure why this is hard to grasp, it seems obvious to me. Maybe I need to do a better job explaining myself?
Posted on September 28, 2004 09:30 AM | #
26. Geoffrey said:
I think web design is a perfectly good term for what you are describing. Architecture is made up of many different disciplines, but when you hear the word you have a pretty good “big-picture” idea of what someone is referring to. I think the same holds true for web design. Maybe it’s best to leave the task-specific naming for use within the industry.
Also: Great choice of beer! One of my favorites. ;)
Posted on September 28, 2004 01:04 PM | #
27. Nick Finck said:
That is still up for debate within the IA community itself.
As far as process, keith, after these emails me and you sent back and forth, I am going to agree with your recipe to the extent of context… the semantics is what’s killing us here.
It would be interesting to continue this thread and let everyone write their own recipes for their own… uhh… skill(?). Just to see what everyone comes up with. Just a thought… maybe thats a different thread.
Posted on September 28, 2004 01:26 PM | #
28. Alf Kåre Lefdal said:
Thanks for the recipe. Being a novice in this field (I am a programmer who occasionally do “web work”), I would like to learn more in order to become a great chef!
Could you (or someone else) please point me to literature on Information Architecture and on Interaction Design. Preferably books, but also web sites.
And by the way: I’m based in Oslo, Norway, so we’re not competing about the same customers ;-)
Thanks for an interesting blog!
Posted on September 28, 2004 03:25 PM | #
29. ankifunki said:
hey hey hey watch it there man!!!!
what’s the big controversey between u and nick finck……by the way i am currently reading articles from digital web magazine, the site designed by nick finck and i think the site is simply gr8!!!! the color combi is also the best and the site looks and works ………what can i tell……i have no words…….how can i describe it……
aaaahhhh forget it!!! its great…..that’s it
Posted on September 28, 2004 09:12 PM | #
30. Keith said:
ankifunki – No worries. For the record Digital-Web is published by Nick. I’m actually the Editor in Chief and we’re good friends. It’s all good.
The design was actually done by Didier Hilhorst.
Posted on September 28, 2004 09:23 PM | #
31. ankifunki said:
uuuuuffffeeeeewwwww
i thought so !!!!
you know controversy is always betwen best friends
carry on guys…..
don’t leave him nick…give him in face….take that and that and that …..way to go keith
Posted on September 28, 2004 11:09 PM | #
32. Jim Amos said:
Stir fry is a much better analogy than a cake. And I think some of the commenters on this thread are two cakes short of a stir fry.
Posted on September 29, 2004 08:20 AM | #
33. Keith said:
Just an FYI on the IA tip. AIFIA defines IA, in part, as:
“The art and science of organizing and labeling web sites, intranets, online communities and software to support usability and findability.”
I guess there is some room in there for creativity, yes? I thought so.
Posted on October 1, 2004 08:32 AM | #
34. iProceed.com said:
Thanks so very much for this wonderful recipe. For those of us who are content developers (rather than web designers) but do web design anyway to get our content in front of our fans, this is a great way to improve our work.
Posted on October 1, 2004 10:43 AM | #
35. web designer said:
Hi,
I really think this is amazing. Moreover, when I created my website content I used the recipe analogy as well. Mind you, it just came to my mind… I didn’t copy the idea from anywehere. But now I see that I wasn’t the first. Erch…
I like the way your mind thinks!
Posted on October 11, 2004 04:30 AM | #
36. Edgard Durand said:
Web design as you said it’s not easy to explain.
Retaking your analogy I think there are recipes for web design as much as web designers.
If the recipe is great depends greatly on the mastery of the web designer. Everyone can have access to the same ingredients, but mastery is different.
And when it comes to tastes, you can’t have a recipe for all people.
Posted on October 14, 2004 05:48 PM | #
37. Ryan, Web Designer said:
I’d advice a “housewife” to add some spices (fresh Flash, bright spring Colour, intriguing pics) upon her taste to make the meal unique. But we shouldn’t forget that some people have gastritis :))
Posted on January 17, 2005 09:38 AM | #
38. Walter said:
First off let me just say I love the cooking Analogy. Being a web designer who just started his own company I can see excatly what you’re trying to say. What I hate is working a 9-5 as a web designer and being expected to work 50 jobs (um I mean be 50 indegridents) here’s the analogy I use…
Being a web designer is unlike any other job out there. Which other job are you responsible for:
1. Building the store front
2. Designing the interior
3. Bringing the customers into the store
4. Making all the sales
5. Processing all the transactions after sales have been made
6. customer support/ complaint guy
I’m sure I’m forgetting more but you get the idea…
Posted on January 31, 2005 10:59 AM | #
39. Pittsburgh said:
This is one of the most interesting ways to look at the web design field. Kudos on a fine job with the article… very useful content.
Posted on January 11, 2006 08:33 PM | #
Comments are now closed