Ingredients for the Perfect Restaurant Website: 11 Inspiring Designs

Ask any web designer what kind of website they prefer to make, and restaurant websites will probably make their shortlist.

Why?

Stunning images of food, beautiful venues and creative chefs… What more could you ask for?

When done properly, restaurant websites become works of art to showcase a chef’s passion and talent, while promoting their culinary creations online. Bonus? They help get more customers and increase sales. Talk about a win-win! 

Unfortunately, many restaurant websites are overly complicated and fall short on at least one of the two keys to creating the perfect restaurant website:

  • Attract your customers with your unique selling proposition (USP)
  • Make it easy to find necessary information

By breaking down these goals into key ingredients, this article will help you understand the important elements required for a great restaurant website that not only looks good, but drives customers through your doors.

 

Pro tip: When designing any website, always try to keep things simple. As quoted by Leonardo Da Vinci, arguably one of the greatest designers of all time: “Simplicity is the ultimate form of sophistication”.



Attract your customers with your unique selling proposition (USP)

Before starting to design your website, you will want to ask yourself (or even your customers) a few questions.

What makes my business unique? What do my customers love about my restaurant? Why am I in the restaurant industry?

These questions are geared towards understanding your USP. The answers to these qualitative questions will serve as a guide for your website structure, feel, choice of images and design.

Without this “je ne sais quoi” (pleasant quality that is hard to describe), your website will struggle to connect with your potential customers.

Here are a few examples of restaurant USPs:

  • The venue or location (views, decor, experience)
  • Food and how it is consumed (several courses, freshness & uniqueness, BYOB)
  • Chef or restaurant story (secret recipe, awards, distinctions)
  • The staff (knowledge, entertainment, uniforms)
  • The prices (this shouldn’t be your only USP, even McDonald’s does more than that!)

Here are some stunning restaurant websites that fully embrace their USP’s.


Moxhe

David & Helen’s passion for fresh Australian seafood and wine exudes from their website. It all starts with a beautiful background video of the ocean on their homepage, which leads into story telling about how their restaurant came to be.

 

restaurant_website_design_Moxhe_Homepage.png

 

 

 

 

The short paragraphs and stunning imagery tell a powerful story, while the easy to read titles give first time visitors the option to quickly understand what Moxhe is all about.

 

restaurant_website_design_Moxhe_Homepage-2.png

 

The simple, focused calls to action (CTA) at the bottom of the homepage guide visitors to learn more via “Discover the Menu” or “Book your table now!”

 

restaurant_website_design_Moxhe_CTA.png

 

There are no distractions, and everything is straight to the point.

The menu section offers another stunning image combined with a description that further demonstrates the chef’s creativity and USP’s.

 

restaurant_website_design_Moxhe_menu.png

Sweet Jesus

This Canadian soft serve ice cream shop has been turning heads with their bold and innovative approach to the classic summer treat.

Take a look their site (or any of their marketing for that matter) and you’ll quickly notice that there is something unique about their offer (their USP).

 

Screen Shot 2017-08-28 at 1.07.42 PM.png
And it’s all efficiently done a on single page with only one paragraph.

 

restaurant_website_design_Sweet-Jesus_text.png

 

Who wouldn’t want to try them out?

Their bold colors and extraordinary photography have made them a hit on social media, too, rocketing them to over 100k followers on Instagram, which has strategically been integrated onto their website.

 

restaurant_website_design_Sweet-Jesus_instagram.png

 

This allows Sweet Jesus to have a fresh dose of yummy treats on their site, while enticing their potential customers to follow them on social media. Well done!

Maison Lameloise 

Ever heard of Michelin stars?

They go from 1 to 3, and in the culinary industry, they are considered the highest honor a restaurant can receive.

Just for perspective, there are over 1 million restaurants in the United States and only 14 have received a three Michelin Star Rating. Talk about a unique selling proposition!

Even if you never make it to Chagny, France, you can experience one these world class restaurants by taking a peek at their gorgeous website.

 

restaurant_website_design_maison-lameloise_Homepage.png
The Maison Lameloise’s site gives food enthusiasts a glimpse of their stunning dishes, as well an overview of the historic venue owned by celebrity chef Eric Pras.

The different sections balance colorful imagery, short videos, whitespace, and powerful text to illustrate the uniqueness of la Maison Lameloise.



restaurant_website_design_maison-lameloise_about.png

The website’s footer does a great job at subtly displaying some of their rewards, reminding guests that they are in for a one-of-a-kind culinary experience.

restaurant_website_design_maison-lameloise_footer.png



 

Make it easy to find necessary information!

To perform online, a restaurant website needs to display important information so potential visitors can quickly find what they are looking for.

This may sound elementary, but you’d be surprised at the number of restaurant sites that don’t offer basic information. Visitors find themselves asking,  Where is this restaurant located?! or What’s on the menu?

After visiting hundreds (if not thousands) of websites, here is a short list of the most important items you need to include for your restaurant to succeed online:

  • Accessibility
  • Restaurant Overview
  • Location & hours
  • Menu with prices
  • Photos
  • Reviews and Rewards
  • Bookings / Contact information

Here are some examples of websites that did a great job at showcasing these necessary items:


Accessibility: 
Grilled Cheeserie 

Your website needs to be easily accessible AND easy to navigate from anywhere, from any device. Period.

Grilled Cheeserie not only made a beautiful mobile site, but they even tackled a problem that most restaurants don’t have - their location changes locations!

As a food truck, they found a very simple way of delivering a mobile site for a mobile restaurant.

 

restaurant_website_design_grilled-cheeserie_mobile-desktop.png

“Find the truck” is the CTA that leads you to a calendar showing you where they will be on any given day. It’s just that easy!

Hats off to them for an easy to read website with simple navigation that beautifully conveys the essence of accessibility. Hey, you can even order online using the TOGO app which is seamlessly integrated into their site.



Restaurant overview: Pinza

Don’t leave customers asking Who are you? What do you do?

You’d be shocked at the number of restaurants that don’t even say what they do. A simple, straight to the point overview is all you need on your homepage to let people know what you’re all about.

If you have lots of things to say, add it to an ‘About’ section for people curious to learn more.

Pinza (nope not Pizza), did a great job at quickly explaining how their product is different and why you should try it out!

 

restaurant_website_design_pinza_homepage.png

 

Location and hours: Made Nice

Made Nice, located in New York, knows how to keep things simple.

If someone clicks on your location, it shouldn’t take them more than a few seconds to figure out where to find you. Your address, a Google map, and your hours of operations - that’s it.

 

restaurant_website_made-nice_contact.png

If you want, you can toss in an image of the exterior of your restaurant as a visual cue to help people find you.

Remember to link your address to Google Maps (open in a new window so they don’t lose your site) and to lock the scroll in your maps.

Asking your guests to copy and paste your address or having them get lost in a map that zooms in-and-out uncontrollably isn't going to leave a good taste in their mouths.



Menu and prices: Momofuku Group

Yes, you need to put your menu on your website, and yes, you do need to include your prices.

People have questions, and your site should have answers. What do they serve? Am I allergic? Do they have vegan options? Gluten Free options? Can I afford this?

If you don’t include this information, some people might call you. But, what happens if your restaurant is closed? Or no-one answers the phone? Not a great first impression!

The Momofuku Group created easy-to-navigate menus for all their restaurants and courses that are a delight to look at. They even include social sharing buttons, as well as a printable version of their menu if needed.

 

 

restaurant_website_momofuku-group_menu.png

 

Keep in mind, your menus should always be HTML friendly so that every browser can view them. Please, no more PDF menus! Some devices have difficulty opening them. Remember the importance of accessibility?


Photos: Bone Kettle

Sometimes all you need is one stunning photograph to convince someone to try out your restaurant. So make sure to your pictures really portray what you have to offer.

If you can, avoid stock photography - in the restaurant game, originality is everything!

Bone Kettle used beautiful pictures to elevate their website to another level. The most interesting thing about their website is how instead of having a “gallery” section, they simply link you to their Instagram account so you can view their most up-to-date images.

 

restaurant_website_bone-kettle_photos.png

Social media is a must for restaurants, and this example illustrates how seamless the transition can be between a website and its social media counterpart.


Reviews and rewards: Quay

Reviews and rewards can be the social proof you need to convert an undecided foodie to try out your restaurant. They can also help you grow your business!

Don’t be shy about showcasing these accomplishments on your website. However, same as with people, being humble is a quality that will get you respect from your audience. Nobody likes a braggart!

Quay, a popular restaurant in Sydney Australia, has a humble and beautiful way of showcasing their distinctions on their homepage without taking anything away from their core message.

restaurant_website_quay_reviews.png

A popular web design trend is to include these awards in the footer, or in a ‘Press’ or ‘News’ section of your website.



Reservation / Contact info: Nour

If you accept reservations at your restaurant, you need to include it on your website.

There are several different online booking apps that you can use you get more reservations.

The goal is to automate the process of taking reservations, so you don’t have to rely on your staff to do so.

OpenTable is the market leader in this space. They’ve succeeded by offering a very simple, user friendly interface that makes reservations a breeze.

 

restaurant_website_opentable_bookings.png

Nour, another restaurant out of Sydney, embraces this modern must-have with an Open Table integration on their website. It’s an online reservation technique that is free of distractions, so guests can focus on getting their name on the list!

 

restaurant_website_nour_opentable.png

This one-page website shows how you don’t need a bunch of pages to be efficient and attract your users. They offer them the important information they are seeking all in one spot.

Oh, and last but not least, always include your contact information so that people can reach you! A form is a great idea, because it reduces the chances of receiving spam.

 

Pro tip: Make sure that if you have emails, phone numbers or addresses that they are clickable so you’re not asking your users to go the extra mile to reach you!



Summary

To succeed online, your restaurant needs a website that is accessible from anywhere!

Your site needs to be simple and it must include all the important information your potential customers are looking for.

Remember what your unique selling proposition is, and to include it in the words you use, the pictures and colors that you choose. After all, this is your brand we’re talking about.

 

Build a website with PageCloud's website builder

With the proper balance, you will be well on your way to creating the perfect restaurant website!