Restaurant and hotel website navigation: menu, rooms, book

Key takeaways

Restaurant and hotel website navigation should get guests to the menu or rooms, prices, location and booking in a tap or two. Show food menus as web pages, not only PDFs, link rooms and offers from the main menu, make allergen, opening hours and directions easy to find and keep a 'Book' button visible on every page, especially on phones.

• Food menus as web pages, not only PDFs.
• Rooms, offers and events linked from the main menu.
• Allergen information, hours and directions easy to find.
• A visible 'Book' button on every page.

What do guests look for first?

Restaurant guests look for the menu, prices, opening hours, location and booking. Hotel guests look for rooms, rates, availability, location and facilities. Most browse on phones, often on the move. Navigation should put those items in the first screen.

• How clear website navigation improves user experience
• The guest journey on restaurant and hotel websites

Why should food menus be web pages?

PDF menus are slow to open on phones, need zooming and cannot be read easily by screen readers or search engines. A web page menu loads quickly, reflows to fit the screen and can link to allergen information. Keep a PDF as an extra download if you like, but not as the only version.

• PDFs on a mobile website: why menus and brochures fail
• Restaurant mobile websites: menu, booking and directions

What should the menu include?

A short, specific menu covers most hospitality businesses.

• Restaurants: Menu, Book, Private dining, Gift vouchers, Find us.
• Hotels: Rooms, Offers, Dining, Facilities, Location, Book.
• Pubs: Food, Drinks, Events, Rooms if offered, Find us.
• Book as a distinct header button.

• The header CTA button: one action that stands apart

Where should allergen information go?

Make it easy to reach from the food menu page. The Food Standards Agency's guidance requires food businesses to provide information about the 14 major allergens, and for food sold online or by phone, before the purchase is completed. Link allergen information next to each menu and say how to ask staff.

What about booking systems?

Many restaurants and hotels use third-party booking engines. Keep your header and a link back to the site on booking pages where the system allows, and make sure the 'Book' button opens the right booking type, such as table or room, without extra steps.

• E-commerce navigation: help shoppers find products fast

What does this look like in practice?

A pattern we see: a restaurant's menu is a large PDF linked from 'Food & drink', and booking sits behind 'Contact'. On a phone, guests download a slow file and then hunt for booking. A web page menu and a 'Book a table' header button cut both steps.

• See client work
• Website Design & Development for UK businesses
• Websites for UK hospitality businesses

Hospitality navigation checklist

• Food menus as web pages.
• Rooms and rates one tap away.
• Allergen information linked from menus.
• Hours, location and parking easy to find.
• Book button visible on phones.
• Booking pages link back to the site.

• Clinic website navigation: treatments, fees and booking
• Accessible navigation: clearer for every visitor

Next step

On a phone, time how long it takes to see your menu and book a table or room.