Web Design Anatomy: Restaurant Websites

Any professional will tell you that design is pointless without context. This is especially true in the design of a company’s website.

Even if you have no interest in design theory and fundamentals, for the sake of your business there is one point that should never be forgotten: the purpose of design is communication.

Communication Demands Relevance

Each industry has a unique audience, with unique needs & expectations. What works for a law firm website will not necessarily translate well to the design of a catering company website. In an industry flooded with generic templates and unqualified or (worse) apathetic service providers, this simple fact is often overlooked. For this reason, we present to you the first in a series of Web Design Anatomy articles. Motivated by the short and frustratingly familiar script referenced here, our first article will deal with Restaurant Websites.

Why Does a Restaurant Need a Website?

We’re not talking generalities here – in today’s marketplace just about EVERY type of business needs an online presence if they want to stay competitive. More specifically, we are asking the question: what is the purpose of a restaurant website?

The reductionist answer is twofold:
• To create an attraction between diners and your restaurant
• To provide the information they need to spend their money there


This is the point that far too many restaurant owners get caught up in, at least superficially. It’s no secret that we are not supporters of Flash to the detriment of accessibility or functionality. How can you attract when you can’t be seen? It’s best to consider Flash as just one specialized tool in a very well stocked toolbox… it serves a niche function, comes with a ball of strings attached, and with advancements in the capabilities of JavaScript is quickly becoming obsolete.

It is important to present an impressive online image that represents everything great about your restaurant. But in order to make that impression, diners need to be able to actually VIEW your website. If they are out driving around, browsing for a restaurant on their iPhone, they will not be able to view your Flash website. At all. If they are using a search engine to find a restaurant, yours will likely be way down the list, as search engine optimization techniques for Flash sites are crippled, at best. There is also the issue of not being able to copy/paste, or bookmark individual pages. Statistically, Flash sites have an exponentially higher abandon rate than XHTML/CSS based sites.


Following is a short list of requirements that every restaurant website should have in order to provide customers with the information they’re seeking:

  • Restaurant Overview
    A basic introduction to your restaurant is a must. Even if you think the name of your restaurant is self-explanatory, people still like to see how you describe yourself. If you have any unique selling points (local-sourced or seasonal ingredients, fair-trade, vegetarian options, etc.) this is a great place to mention them.
  • Location
    Diners need to know where you are, and how to get there. You don’t need to provide directions from every corner of town, but an address, basic map, and link to a direction-giving site like Google Maps is very helpful indeed. BONUS: include a photograph of the front of your restaurant, so first-time visitors will recognize it easily from the street.
  • Hours
    Basic stuff, here. And this is very near the top of the list of priorities when a diner visits your website. Make them easy to find.
  • Menu
    Your food is your business! If ever there were an influential and unique selling point, it would be a mouth-watering menu. Words paint a picture, here. Don’t just scan your paper menu into an annoying PDF file, either – invest in having a digital menu designed to complement your physical one. This is the page people will want to bookmark.
  • Photos
    A picture surely does speak a thousand words. Show what you’ve described in your menu, and make the imagery so vivid that it elicits a Pavlovian response in your visitors. Show your food, show your restaurant, your staff, and your dining room. The food is the star, but the experience is the whole package.
  • Reviews
    This is not a must-have, but it certainly is nice. Reviews are the first thing many people look at when considering a new restaurant to try. If your restaurant has been reviewed in print, you definitely want to boost the influence that press affords by including it in your website. If you’re not in print, patch in reviews from consumer sites like UrbanSpoon or Restaurantica, or any of the other dozens of options available in any given city. And if you’re brand-spanking-new, include a reviews page with a simple request and link for people to visit a chosen review site, and let the world know what they thought of their experience with you.
  • Reservation/Contact Info
    This area can be the deal-closer in many cases. If you make it easy and painless for people to book a table, guess what they’ll be more likely to do? Provide an easy-to-find phone number, of course, but also consider bookings by email, or requests via a form on your website. You can even program in live reservations through services like OpenTable.

How to Annoy Your Customers

Some food for thought, straight from the horses’ mouths:

“I’m always taken aback when music emanates from my speakers when I’m viewing a site”

“Flash required. Biggest irritant of a restaurant website. Even more so if they have an “Intro” graphic/animation. Two of my fav places use flash for their sites and it’s very very annoying. Even more annoying with flash is not being able to copy/paste phone numbers.”

“Can’t stand it when a site starts with music or that stupid talking character/video. I’ve got my own playlist going already, thanks. I don’t want your music. And when I’ve opened a ton of tabs at once, skimming through to find a cool place to eat, it’s always a pain to figure out which ones are making the noise.”

“I have my windows set up so that everything is sized and positioned the way I want it. Nothing bugs me more than when a website takes over your browser and forces it to fill the screen.”

“Flash, flash, flash. I don’t care about your intro. I don’t want to watch a video of leaves unfurling. Atmosphere is nice, but I usually end up closing these sites before they’re even done loading.”

“Where’s the damn menu?! I scour the site for ages, then when finally find it, it’s a crappy PDF.”

Who Does It Right

Here are just a few examples of restaurants with websites that walk the walk in terms of design, attractiveness to their own target customer base, and serving their purpose through the provision of convenient, easy-to-find information.

FIG (Food is Good)

Squid Ink

Each of these sites has a design that appeals the demographics the restaurants are trying to attract. They look great. They work the way they should. And information is very easy to find.

The central lesson in all design, whether it be for print, digital distribution, or the web, is that (the right kind of) communication is king. The goal for any company’s website is to sell a product, service or idea. Obviously you want to look good doing it, but dressing up for a job interview will do you no good if you can’t communicate with your prospective bosses. And let’s face it… the customer is the boss.

Be Sociable, Share!