The Ham Sandwich, Web Development Analogy

by admin

Writing a proposal for a client recently I somehow came up with an interesting analogy. Talking about web development to someone who knows nothing about it usually ends up with that person saying something to the nature of, “I swear you are speaking English but none of these words are making sense to me”. Although this tends to lead to a laugh about how technology is really something most people like but don’t care about the how or why, the challenge is to relate the information in such a way that will help the client understand the basics.

This is where the Ham Sandwich, Web Development Analogy came into my head; why Ham Sandwich you ask? The problem is most people do not understand web development terminology (XHTML, CSS, Microformats, AJAX), however most people do understand the basic ham sandwich. The analogy works because there are so many different ways to code a page, just as there are so many different ways to build a ham sandwich!  The basic formula for a ham sandwich is bread, condiments, cheese and of course, ham.

Let’s do a quick overview comparison list:

  • XHTML & Bread
  • Microformats & Cheese
  • CSS & Ham
  • AJAX, jQuery, etc. & Condiments

Let’s break this down for everybody. XHTML or EXtensible HyperText Markup Language is to web development as bread is to a ham sandwich for many reason, let’s focus on a few. When you start a sandwich you start it with bread, or a wrap in my case, but for purposes of this argument we are going to say that no ham sandwich can be made without some sort of bread product.  Just the same XHTML is the starting point of any web page, when a coder sits down with a sliced up design they hit Notepad or (fill typically expensive software title here) and start coding the basic XHTML structure of the site. Every coder does it a little differently which one can say is just like the many different types of bread one can use to make a ham sandwich. Good bread is just like good XHTML, more users will eat it right up!

Everyone knows that a ham sandwich means business with cheese, whether it is white american, provolone or any other of the plethora of cheeses there are in the world. Well microformats mean business too, because just like cheese on a ham sandwich, they make what is already there even better. “Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards.” [1]. Microformats can be used to create not only meaningful mark up in XHTML but something more using the same technology. Creating vCards so business associates can quickly get all pertinent information about a person, and creating calendar events in one click, are just scratching the surface of how microformats can help make the same information into something more flexible for the user.

The bulk of the design is layered on top of the XHTML using another language called CSS or Cascading Style Sheets. Layered on bread in a ham sandwich is, you guessed it, ham! Ham makes up the bulk of the taste of a ham sandwich, without it a ham sandwich wouldn’t look so great. Without CSS a web page does not visually look all that great. Just like bread there are many different types of ham, honey ham, capicola or hot ham, virgina ham, and just like ham there are many different ways to code up  a CSS style sheet. Good CSS is coded so that browsers with older technology can still have a rich user experience while taking advantage of the newer browers advance technologies.

This leads me nicely on to my next comparison, AJAX, jQuery other more advance web technologies and condiments. Now I personally love mayonnaise and although I have problems spelling it I use it so frequently I should gain frequent flyer miles so it’s safe to say mayonnaise will be on my ham sandwich! But not every person likes mayonnaise, as a matter of fact, someone may absolutely despise mayonnaise and instead want a particularly delicious flavor of mustard spread on their bread to give the ham sandwich that extra spice. Some web pages work well with some extra’s layered on top for browsers that can handle them, like having Google Maps on a directions page for a law firm web site. It may not make sense to have Google Maps on a site whose target audience are those using screen readers as it is a more interactive visual thing so another advanced web technology may  make more sense in that particular case, just like it doesn’t make sense to have mayonnaise on a sandwich for someone who doesn’t enjoy it.

Okay so maybe comparing a ham sandwich to web development was really childish and didn’t accomplish much more than a laugh or a click of the [x] of this web site tab but someone has to try and educate clients about this technology or else our client’s won’t have respect for what web developers do! Just maybe this had helped someone out there better understand web development a little better, or maybe this article has really just helped someone realize that it is lunch time. =)