What your restaurant homepage needs on the first screen

What should a restaurant homepage show before anyone scrolls?

On a phone, before any scrolling, a restaurant homepage should show what kind of food you serve, whether you are open now, where you are, and one obvious button to book, order or get directions, plus a clear way to the menu. That is the whole job of the first screen. Everything else can wait further down the page.

Think about who is looking. Most people who open a restaurant website are not browsing for fun. They are on the sidewalk, in a parked car or on the couch, deciding where to eat tonight. They have a short list of questions: what do you serve, are you open, where exactly are you, can I book, can I order. If the first screen answers those, the guest acts. If it shows a slogan over a dark video, they press back and pick the next place on the map.

Here is how to build each piece, and what to keep off.

Say what you are, where, and if you are open.

The top line of a restaurant homepage should say plainly what you serve and where you are, such as "Wood fired pizza by the old train station" or "Neighbourhood bakery and café, open from breakfast." A slogan like "Passion on a plate" tells a hungry stranger nothing. Your name already sits in the header, so the line under it does the explaining.

Right beside that line, show whether you are open now and today's hours. "Open now" or "Closed today, back tomorrow for lunch" answers the question most guests have before they even think to ask it. Make the address tappable, so it opens straight into a map, and keep the neighbourhood in the top line for anyone who does not know the street.

Keep all of it true. If the site says open and the Google listing says closed, the guest trusts neither. When hours change for a holiday or the end of patio season, change them once and let your website, Google and Apple Maps follow. That is part of how we look after restaurant SEO and the Google Business Profile.

Where should the menu link go?

The menu link on a restaurant homepage should open a real menu page on your site, written in text and laid out for a phone, not a PDF or a photo of the printed menu. A guest taps "Menu" to check one thing: is the dish they want on tonight, and what does it cost. That should take a moment, not a download.

A PDF has to load in full before it shows anything, often opens in another app, and makes the guest pinch and drag to read the prices. It is also harder for Google to read, so the dishes people search for may never count. We go through it in more detail in why PDF menus hurt restaurant SEO.

Label the link plainly. "Menu" works. "Discover our offerings" makes people guess. If you run separate brunch and dinner menus, one page with a heading for each is easier than two links fighting for space.

Which button should be the big one?

The main button on a restaurant homepage should match how most guests actually come in: "Book a table" for a sit down dinner spot, "Order" for a kitchen that lives on takeout, "Get directions" for a café full of walk-ins. Pick one, make it big and easy to see, and put it near the top where a thumb can reach it.

Then add a second, smaller button for the next most common action. A bistro might pair "Book a table" with "Call us". A pizza place might pair "Order" with "Get directions". Two is plenty. A row of buttons all the same size asks the guest to think, and hungry people do not want to think.

If you are not sure which comes first, ask your staff what people ask on the phone. If most calls are "do you have a table tonight", the answer is booking. If most are "do you deliver", it is ordering.

Show one real dish people actually order.

The photo on the first screen should be a real dish from your own kitchen that people order often, not a stock image of strangers clinking glasses. One good photo of the thing you are known for tells the guest what the food looks like and what kind of place this is.

It does not need to be fancy. A clear phone shot in daylight, plate up close, often beats a polished image that could belong to anyone. Guests spot stock photos quickly, and a stock photo quietly says there is nothing of your own to show. Size it for a phone so it loads fast, and swap it when the dish comes off the menu, so nobody walks in asking for last season's tart.

What slows down or crowds the first screen?

The first screen of a restaurant website should load quickly on two bars of signal and show the guest what they came for straight away, so leave off anything heavy or anything that covers the page. An autoplay video that holds up loading, a pop-up over the menu, or a slider that hides your hours all stand between a hungry guest and a decision.

• SlidersRotating banners move before anyone can read them, and the slide with your hours is never the one showing.
• Welcome essaysThe story of how you started is worth telling, further down or on an About page. Not above the menu.
• Newsletter pop-upsA box asking for an email before the guest has seen a single dish gets closed, and often the tab goes with it.
• Social feedsAn embedded Instagram feed is slow to load and pulls people off your site. A small link to your account does the job.
• Autoplay videoA full screen video can look great on office wifi and stall on a phone outside your door. If you love the film, put it lower down and let people press play.

A simple test: stand outside, turn off wifi and open your own restaurant website on your phone. Notice how long you wait and what you see first. That is exactly what your guests see.

Build the first screen around where guests come from.

The right first screen depends on how people arrive, so start by asking where your visitors come from and what they want when they land. A guest from Google Maps wants hours and directions. A guest from an Instagram post wants to see the thing in the post and act on it.

Le Cookie, a custom cookie studio, is a clear example. Its visitors mostly arrive on a phone from Instagram, so the whole site is one page: design a cookie in a few taps, watch it bake as you scroll, then send an inquiry. No pages to dig through, no detour between seeing the cookie and asking for it.

That is how we approach every restaurant website. We open your current site on a phone the way a hungry stranger would, then fix or rebuild around what people come for, with the menu, hours, directions and booking up top. See how we handle the website, or send us a note and get your plan: a plain English list of what needs fixing first, and why, back within one business day.