The Do’s and Don’ts of Restaurant Web Design

Restaurant websites are more important than ever, since more and more people are using their iPhones to find out what kind of food a particular restaurant has, how much it costs, whether it serves booze, how to get there and even for reserving a table. There are more than a million restaurants in the United States, and an ample selection in any medium-sized town. For a restaurant to successfully entice their potential customers, the website has to be well-designed and perfectly functional. Grainy diner spaghetti photos or auto-play music are not practical for a well-designed restaurant website. What should you include? Keep reading to discover the do’s and don’ts of restaurant web design.

Best Features for Restaurant Websites

1. Beautifully-Presented Food Photography

This really should be an inclusion of common sense. The end goal of any business website is to sell — aka, conversions — right? If a website is trying to “sell” Thai cuisine, or in most cases, encourage potential customers to dine in, appetizing photos are one of the most logical ways to entice a hungry person looking for their pad Thai fix. Yummy pictures of whatever cuisine the restaurant specializes in should be a priority, and one of the first things that hit a website visitor upon loading your site.

Never go to stock photos as an option for a restaurant website. Invest in a food photographer to come in and take beautiful images of your dishes. They specialize in how to present food so it looks even more appealing and mouthwatering.

2. Mobile Access/Optimization

We are long past the days of requiring visitors to check out your website from their desktop computers. Website visitors – especially those who seek out restaurant websites – are on the go, and your website needs to reflect that or you will lose customers. A website needs to be able to adjust to any resolution on any mobile device.

Around 50% of web traffic is from mobile devices, and the number grows every year. More people use mobile exclusively for their internet browsing needs. Someone looking for a place to dine is likely out and about, and they’ll use their phone to search for a restaurant. If your site isn’t optimized for mobile, you’re potentially missing out on a lot of customers. Test your website on actual mobile devices to ensure its looks the way you want.

3. Restaurant Food and Drink Menu

How you arrange this is up to you, but everyone wants to know what dishes a restaurant has, not just what kind of cuisine it serves. Brief descriptions and photos to accompany each entrée item is ideal — you generally like to know what you’re going to eat, right? Make sure to take or hire a professional to take high quality photos of your own dishes instead of using stock photos. This prevents unpleasant surprises that can happen when someone orders something based upon a super-appetizing photo and then is disappointed when it’s not what they expected.

If some items are seasonal, indicate this or leave them off your mobile site. You can always note that there may be additional selections available based on what is in season.

4. Social Media Buttons and Contact Info

Social media is essential in today’s world of marketing, no matter what the business. Be sure to link out to your social channels, and provide the potential customer with the potential to more easily establish a reputation. Contact information is also pretty much common sense. Why have a website if no one can call and make a reservation or order pick-up? Directions and a local area map are also very much appreciated by those passing through, new or unfamiliar with the restaurant’s location, and can help bring additional customers.

If you add any type of content to your site, install a plugin that lets users share information about specials or events at your venue. The more word-of-mouth buzz you get going, the better.

5. Directions and Hours

It’s easy to get so caught up in showcasing beautiful photographs of food that you forget to include basic information. At a minimum, your site should offer several ways to get in touch via telephone or messaging. Add a map and detailed directions, so patrons find your establishment easily. Be sure to list the hours you’re open and when you seat the last customer. If you simply say you’re open until 10 p.m., customers may walk in the door at 9:55 p.m. and stay until midnight.

6. History of the Restaurant

The story behind why you began serving food matters to a lot of your customers. People want an experience more than just a meal, so add to the event by sharing your humble beginnings. This creates interest that might draw in new patrons. Share press clips, such as an article in the local paper about what makes you unique. Include old photographs of your family if they influenced your dishes in some way. Think about what makes you unique and share the information with others.

Examples to Emulate

Here are some restaurants that perfectly capture the great things about restaurant web design.

Schmidt German Village Restaurant in Central Ohio features several menus via a drop-down in its navigation bar. It also operates a food truck with a limited selection, so it indicates there is a separate menu for that. It provides catering and banquet options, as well. By listing all the menus on this tab, it targets different segments of its audience.

Fat Rice is a unique dining experience featuring spices and recipes from the Luso-Asia provinces. The fusion of different countries and their cuisine is at the heart of what the restaurant does. It features several areas where people can visit and it lists the menus for each, such as the Ladies Room, where people can try out some interesting drinks. The Bakery and Cafe offers unusual selections, such as a Portuguese egg tart or palm sugar sea salt cookies. Since the foods are unusual, a full description of each item is included with the online menus.

Bricco is a casual fine-dining restaurant in Harrisburg, PA. Their website is kept up-to-date with seasonal menus; it’s informative, full of great photos, menu items, new drinks, contact info and everything a website should have.

Balaboosta is a Middle Eastern/Mediterranean fusion restaurant in NYC that puts their quiet atmosphere and amazing wine selection front and center. Though they don’t feature images on the menu, the “Photos” section gives an appetizing preview of what you’re in for if you visit.

This regional restaurant in California called Lemonade screams “fresh” when you see its website. Its brand, cuisine and most importantly, its food are visually presented with a gorgeous parallax scrolling design. The colors are striking, there’s a great use of white space, and the navigational tabs are at the ready.

The Don’ts of Restaurant Web Design

1. Auto-Play Music

I don’t know why, but a lot of restaurant designs seem to include this. Maybe it’s an ambience thing that’s supposed to make customers imagine sitting in the restaurant? But don’t do it — it’s much more of an annoyance than an inspiration.

2. An Auto-Play or Slow-Loading Embedded Video of the Owner (or Anyone Else)

Videos can be as equally obnoxious as auto-play elevator music. Most website visitors just want to browse the site themselves, see what the restaurant offers, be informed of price ranges and maybe appropriate attire, etc – they don’t care about the owner’s “personalized” greeting. Save that kind of thing for social media.

3. Flash

I know flash is fun to use as a designer, but, especially for restaurant websites, it should really only be used to enhance non-essential pieces of content. For one thing, lots of mobile devices can’t access flash-based content, and secondly, it causes a lot of problems, from slow loading to auto-play videos to complex navigation. You don’t need it.

4. Missing Details

When including menu items or anything else people will encounter in your place of business, be as detailed as possible. Use expandable menus to show an image of the dish, and list the ingredients. Some people have allergies or are on a budget, so they’ll want to know each component used in a recipe, as well as the price. So many online menus list only the name of the dish but don’t add additional descriptions, so it’s impossible to tell what it really is.

There are certainly plenty of other things that should and should not be included on restaurant web design, but these are the major ones. If you stick to this list, you’ll be off to a good start.