Restaurant website design: a menu that reads on a phone, reservations, hours that are always right, and events

What a restaurant website needs: an HTML menu instead of a PDF, table reservations, hours that match Google, private dining, photography, allergens and a checklist.

9 min readWebsites

Part of the guide: How to build a business website, step by step

A dish from EMBER, a chef restaurant concept we built for a fictional restaurant
A dish from EMBER, a chef restaurant concept we built for a fictional restaurant. From the studio’s examples. The business is fictional.

A restaurant website has a few jobs, and has to do them fast on a phone: show the menu, let people book a table, and say when and where. The menu should be a web page, not a PDF; the booking button should be on every page; and the hours and address should match the Google Business Profile exactly. After that come private dining and events, photography that shows the food and the room, and answers to guests’ questions on WhatsApp or Instagram.

The general process of building a website is in our guide to building a business website. This article covers what is specific to restaurants, bars and cafés. The example we return to is the EMBER restaurant website, a concept we built for a fictional chef restaurant with a tasting menu, the kitchen, the wine list and reservations.

What does a restaurant website need?

Most people open a restaurant website with a single question: what is on the menu, is there a table tonight, where do I park, can we take over the room for a party. Every one of those needs an answer one tap away:

Part of the siteWhat goes in itWhat to watch
HomeWhat the restaurant is, where, when it is open, and bookingToday’s hours visible without searching
MenuDishes, prices, allergen and vegetarian or vegan marksAn HTML page, not a PDF, with a last-updated date
ReservationsA persistent button on every page, leading to the booking calendarBooking completes on the site, or the hand-off is obvious
Hours, address, getting hereHours, holidays, parking, transit, accessibility of the venueIdentical to the Google Business Profile
Private dining and eventsWhat is possible, capacity, event menus, request formA form that asks for date, guests and type of event
AboutThe chef, the kitchen, suppliers, the storyFacts and people rather than adjectives
Dietary and religious certificationKosher, halal or other certification, if heldOnly with valid certification
ContactPhone, WhatsApp, email, InstagramA number that is actually answered during service hours
EMBER · Business website
EMBER · Business website. Open the demo ↗

Why the menu should be a web page, not a PDF

Many restaurants upload the menu as a PDF because that is the file the printer has. On a phone, it means downloading a file, zooming and scrolling sideways. Google can read PDFs (Google’s list of indexable file types), but an ordinary menu page is better at almost everything else:

  • It reads on a phone at normal text size, without zooming.
  • It updates in a minute: a price, a seasonal dish or a dish that is off, with no file to redesign.
  • It is accessible: screen readers read an HTML page in the right order, and a PDF only if it was specially prepared.
  • You can link to it: the lunch menu, the wine list, a single dish, shared as a link in a message.
  • It can be measured: you see how many people opened the menu and what they did next.

A good web menu follows the courses of the meal, shows prices, marks allergens and vegetarian or vegan dishes next to the dish itself, and says when it was last updated. If there are several menus, lunch, dinner, tasting and wine, each gets its own page or tab. Keep the PDF as an optional download for anyone who wants to print.

Allergens and certification

Allergen marks help guests and staff, but they are only as good as their last update. If the recipe changes and the website does not, the mark misleads. Whoever updates the menu in the kitchen should update the site too, and the menu should tell guests with severe allergies to speak to the staff. Allergen information rules differ by country and type of business, so check yours.

Religious certification is often regulated. In Israel, for example, the Kashrut (Prohibition of Deceit) Law says a restaurant owner may not present the restaurant as kosher in writing unless it has been given a kashrut certificate. Website copy is writing, so the word appears only with a valid certificate and changes when the certificate does. A restaurant without one can describe its kitchen in facts instead.

Reservations: your own booking widget or a third-party platform?

There are two main ways to take bookings through the website, and many restaurants use both: a booking calendar embedded on the restaurant’s own site, and a page on a third-party reservations platform. There is no single right answer, so compare them on the same questions:

QuestionBooking calendar on your own siteThird-party platform
Where the guest booksOn the restaurant’s site, in its designOn the platform’s page, sometimes in its app
Who holds the guest’s detailsThe restaurant, in its own systemDepends on the platform’s terms
CostA reservations system subscription, sometimes developmentPer the platform’s model; check for per-cover fees
DiscoveryOnly people who already found youAlso people browsing the platform
Deposits and no-showsDepends on the systemDepends on the platform
Connecting other toolsCan feed a CRM, email and WhatsAppDepends on the platform’s API

On the website itself, what matters is that the booking button appears on every page and at the top on mobile, that the flow has been tested on a phone through to confirmation, and that if booking moves to another site, the guest knows before tapping. When a slot is full, offer a waitlist or another time rather than an empty message.

EMBER · Automation & AI agents
EMBER · Automation & AI agents. Open the demo ↗

Opening hours and your Google Business Profile

Many guests never open the website. They see the hours, address and photos on the Google Business Profile and decide there. So the rule is that hours, address and phone are identical on the site, on Google and everywhere else, and change everywhere on the same day. In Google Business Profile you can set special hours for holidays and events without changing the regular hours, and more hours for services with different times, such as delivery or takeout (Google Business Profile Help). That is the difference between a guest arriving at an open door and a closed one.

On the site itself, add Restaurant structured data with the address, opening hours, cuisine and a link to the menu page. Google documents these fields in its local business structured data guide and recommends the most specific type possible, such as Restaurant rather than just LocalBusiness.

Private dining and events

Events often bring the most revenue per enquiry, and they deserve their own page rather than a line on the contact page. A good events page says how many guests the space holds in each layout, whether the whole restaurant or only a room can be booked, which event menus exist and what needs deciding in advance. The form asks for the date, number of guests, type of event and a way to reply, so the answer can be a proposal rather than a list of questions.

Hôtel Marée · Paid campaigns & AI creative
Hôtel Marée · Paid campaigns & AI creative. Open the demo ↗

Photography: the food, the room and the people

On a restaurant site, images do much of the work. You need three kinds: dishes as they really leave the kitchen; the room, in the light of the hours guests actually come; and people, the chef and the team. Stock food photos undermine trust, and a dish that looks different on the plate than online disappoints. AI-generated imagery works for backgrounds, mood and campaigns, but the dish itself has to match what is served. We discuss that line in our article on AI product photography.

WhatsApp, Instagram and guest questions

Many questions a restaurant receives repeat: is there a table tonight, are dogs welcome, is there parking, is there a gluten-free option. An AI agent on WhatsApp and Instagram can answer them from the restaurant’s own information, book the table in the reservations system and pass any special request to the team. In the EMBER agent concept, the agent answers guests on WhatsApp, Instagram, the website and the phone and books tables in the calendar; we cover the trade-offs in our article on WhatsApp AI agents for restaurants and hotels.

Speed on a phone

A restaurant website is mostly opened on a phone, sometimes on the street with a weak signal. Background video on the home page and heavy images are the usual reasons a restaurant site is slow. Modern image formats sized to the screen, a short compressed video that does not block the text, and a minimum of third-party scripts do most of the work. We cover Google’s speed metrics and their thresholds in our guide to building a business website.

Bringing in new guests

A good website does not bring guests by itself. New guests arrive through Google search and Maps, Instagram and word of mouth, and sometimes through a paid campaign around an opening, a new menu or a holiday. Such a campaign should land on the page that matches it, the holiday menu or the events page, not the home page. We cover local campaigns in our guide to Google Ads for local businesses, and the Hôtel Marée launch campaign, a concept we built for a fictional boutique hotel in Jaffa, shows the creative and the budget week by week for a hospitality business.

Restaurant website checklist

  1. The menu is a web page, with prices, allergen marks and a last-updated date.
  2. A booking button is on every page, and booking has been tested on a phone through to confirmation.
  3. Hours, address and phone match the Google Business Profile, including holiday hours.
  4. Certification claims such as kosher or halal appear only with a valid certificate.
  5. There is an events page with a form asking for date, guests and type of event.
  6. Photos show real dishes, the room and the team.
  7. The home page loads fast on a phone, video included.
  8. Restaurant structured data is in place, linking to the menu.
  9. There is a privacy policy and an accessibility statement, and the site has been reviewed for accessibility.

How much does a restaurant website cost?

A restaurant site is usually small, so it tends to sit in the lower and middle part of the range we see in Israel for a site designed and built for the business: roughly $2,000–$11,000 as a rough conversion, not a price list, and agencies in the US or Western Europe often charge more. What moves the price is photography, the number of menus and languages, a reservations integration, an events page and a shop for gift vouchers. A restaurant inside a hotel is part of the hotel’s site, which we cover in our article on hotel websites and direct bookings. The full cost breakdown is in our article on website cost.

At Libra we build restaurant websites from the brand and photography through to table booking and an agent that answers guests; the service is described on our websites, landing pages and stores page. Send a brief with the type of restaurant, the reservations system you use and what exists today, and we will reply by email with a direction, a written price and a date.

Questions

What should a restaurant website include?

A menu as a web page, a booking button on every page, hours, address and directions, an events page, contact details and any certification you hold. Hours should match the Google Business Profile exactly.

Is a PDF menu bad for a restaurant website?

Google can index PDFs, but an HTML menu page reads better on a phone, updates faster, works with screen readers and can be linked to. Keep the PDF as an optional download.

How should a restaurant take reservations online?

Through a booking calendar embedded on the site, a page on a third-party reservations platform, or both. Compare them on who holds guest data, cost, discovery and how they connect to your other tools.

How do I keep holiday hours right on Google?

Set special hours in Google Business Profile, which override the regular hours for specific dates without changing them, and update the website the same day.

What structured data does a restaurant website need?

Restaurant structured data with the name, address, opening hours, cuisine and a link to the menu page. Google recommends the most specific LocalBusiness sub-type, such as Restaurant.

How much does a restaurant website cost?

In the market we work in, a site designed and built for the business typically costs roughly $2,000–$11,000 as a rough conversion, and restaurant sites usually sit in the lower and middle part. It depends on photography, menus, languages and the reservations integration.

Getting started

Want this for your business?

Send a short brief: three required questions, the rest only if you like. We reply by email with a direction, a written price and a date.

Related examples

All examples→

Concepts we built to show the level. The businesses are fictional.

More on Websites

Websites→