Restaurant-Website fürs Handy optimieren: Speisekarte und Bestellung einfach erreichbar machen

Ein Gast sucht unterwegs nach einer Pizzeria, öffnet Ihre Website und möchte wissen: Was gibt es, was kostet es und wie kann ich bestellen? Muss er dafür eine winzige Speisekarte vergrößern oder die Telefonnummer suchen, wird aus einer einfachen Entscheidung schnell eine Geduldsprobe. Eine gute Restaurant-Website führt auf dem Handy direkt zu den Informationen und Funktionen, die Gäste gerade brauchen. Dafür zählen vor allem lesbare Inhalte, kurze Ladezeiten und leicht erreichbare Schaltflächen.

Die wichtigsten Wege beginnen auf der Startseite

Wer seine Restaurant-Website mobil optimieren möchte, sollte zuerst die Reihenfolge der Inhalte prüfen. Auf einem kleinen Bildschirm ist wenig Platz. Ein großes Begrüßungsbild kann dazu führen, dass Speisekarte und Bestellmöglichkeit erst nach längerem Scrollen auftauchen.

Im ersten sichtbaren Bereich sollten Gäste Ihren Betrieb erkennen und direkt zur Speisekarte gelangen. Bieten Sie Online-Bestellungen an, gehört auch dieser Einstieg weit nach oben. Öffnungszeiten und Standort sollten unmittelbar darunter folgen.

Richten Sie die Startseite an den häufigsten Anliegen aus:

• Speisekarte ansehen: Gerichte, Preise und Auswahl prüfen.
• Bestellen: Lieferung oder Abholung starten.
• Anrufen: Fragen klären oder telefonisch bestellen.
• Anfahrt öffnen: Den Weg zum Restaurant finden.

Die Grundlage ist ein responsives Design: Inhalte passen sich der Bildschirmbreite an, beispielsweise indem mehrere Spalten untereinander erscheinen. Auch die Hinweise der IHK München zur Gestaltung einer nutzerfreundlichen Website empfehlen eine anpassungsfähige Darstellung und Texte, die auf Mobilgeräten ohne Zoomen lesbar sind.

Prüfen Sie bei Ihrem Website-Baukasten deshalb die mobile Vorschau mit Ihren tatsächlichen Inhalten. Lange Gerichtsnamen und zusätzliche Schaltflächen können eine Vorlage anders wirken lassen als die kurze Beispielseite des Anbieters.

Eine mobile Speisekarte muss ohne Mühe lesbar sein

Die Speisekarte ist oft der entscheidende Teil einer Restaurant-Website. Gäste wollen Gerichte vergleichen, Zutaten lesen und Preise erkennen. Das sollte auch mit einer Hand am Smartphone funktionieren.

Gerichte direkt auf der Website darstellen

Eine mobile Speisekarte lässt sich besonders gut als normale Webseite aufbauen. Jedes Gericht erhält einen eigenen Bereich mit Name, kurzer Beschreibung und Preis. Bei schmalen Bildschirmen dürfen diese Angaben untereinander stehen.

Eine fotografierte Papierkarte ist dafür meist unpraktisch: Die Schrift wird beim Einpassen in den Bildschirm sehr klein. Auch ein für den Druck gestaltetes PDF kann häufiges Vergrößern und seitliches Verschieben erfordern. Stellen Sie Ihre Gerichte daher möglichst zusätzlich als lesbaren Seitentext bereit. Ein PDF kann weiterhin als Download dienen.

Wichtig ist dabei eine verlässliche Pflege. Wenn Website, Bestellsystem und PDF unterschiedliche Preise zeigen, entstehen Rückfragen. Legen Sie fest, wo Änderungen eingetragen werden und welche weiteren Ansichten anschließend aktualisiert werden müssen.

Kategorien und Preise klar ordnen

Gliedern Sie eine umfangreiche Karte in vertraute Kategorien wie Pizza, Pasta, Salate und Getränke. Gut sichtbare Kategorie-Schaltflächen können direkt zum passenden Abschnitt führen. Bei einer kleinen Karte reicht häufig eine übersichtliche Liste.

Für die Darstellung helfen diese Einstellungen:

• Eine klare Schrift verwenden; etwa 16 bis 18 Pixel sind ein sinnvoller Ausgangspunkt für normalen Text.
• Preise gut sichtbar beim jeweiligen Gericht platzieren.
• Beschreibungen mit ausreichend Zeilenabstand setzen.
• Dunkle Schrift auf einem hellen, ruhigen Hintergrund verwenden.
• Größen, Varianten und Aufpreise eindeutig zuordnen.

Informationen zu Zutaten, Allergenen und Zusatzstoffen sollten ebenfalls gut erreichbar und lesbar sein. Verstecken Sie sie nicht hinter winzigen Symbolen.

Testen Sie außerdem eine vergrößerte Schrift im Browser. Gerichtsnamen und Preise sollten vollständig sichtbar bleiben, auch wenn dadurch mehr Zeilen entstehen.

Anruf, Anfahrt und Bestellung mit dem Daumen erreichen

Auf dem Handy müssen Schaltflächen genügend Platz bieten. Kleine Symbole direkt nebeneinander führen leicht zu falschen Eingaben. Planen Sie großzügige Flächen und Abstand zwischen den einzelnen Aktionen ein.

Beschriftungen wie „Anrufen“, „Route planen“ und „Zur Bestellung“ erklären unmittelbar, was beim Antippen passiert. Ein Symbol kann den Text ergänzen.

Die Funktionen sollten jeweils direkt zum passenden Ziel führen: „Anrufen“ öffnet die Telefonfunktion mit Ihrer Nummer, „Route planen“ die Kartenansicht mit dem richtigen Standort und „Zur Bestellung“ den Bestellbereich Ihres Betriebs. Bei mehreren Filialen muss klar sein, welcher Standort ausgewählt ist.

Für einen Lieferservice kann eine am unteren Bildschirmrand sichtbare Bestellschaltfläche hilfreich sein. Sie bleibt beim Scrollen durch die Speisekarte erreichbar. Prüfen Sie allerdings, ob diese Leiste Inhalte, Preise oder Formularfelder verdeckt – besonders dann, wenn die Bildschirmtastatur geöffnet ist.

Kurze Ladezeiten durch bewusst ausgewählte Inhalte

Appetitliche Fotos gehören zu einer Restaurant-Website. Große Bilddateien, automatisch startende Videos und zahlreiche eingebundene Zusatzfunktionen können den Seitenaufbau jedoch verzögern.

Beginnen Sie mit den Bildern. Laden Sie Fotos in einer Größe hoch, die zur vorgesehenen Darstellung passt, und komprimieren Sie die Dateien vor dem Einfügen. Nutzen Sie die Bildoptimierung Ihres Baukastens, sofern sie verfügbar ist. Ein Foto, das auf dem Handy nur einen kleinen Bereich ausfüllt, braucht keine riesige Originaldatei.

Weitere praktische Schritte sind:

• Auf automatisch startende Hintergrundvideos verzichten.
• Bildergalerien auf eine überschaubare Auswahl begrenzen.
• Bilder weiter unten auf der Seite erst beim Annähern nachladen lassen, falls der Baukasten diese Einstellung bietet.
• Nicht benötigte Zusatzmodule entfernen.
• Eine umfangreiche eingebettete Karte durch Adresse und eine Schaltfläche zur Routenplanung ersetzen.

Das erste sichtbare Bild sollte dagegen früh geladen werden. Entscheidend ist, dass Gäste Speisekarte und Schaltflächen schnell nutzen können.

Testen Sie die Seite auch über Mobilfunk. Im schnellen WLAN des Restaurants fallen Verzögerungen möglicherweise weniger auf.

Den Bestellweg bis zum Abschluss prüfen

Eine gut erreichbare Bestellschaltfläche ist der Anfang. Auch die folgenden Schritte müssen auf dem Handy verständlich bleiben – einschließlich eines eingebundenen oder externen Bestellsystems.

Lassen Sie Gäste früh zwischen Lieferung und Abholung wählen. Bei Lieferung sollte möglichst vor der umfangreichen Gerichtsauswahl feststehen, ob die Adresse im Liefergebiet liegt. Zeigen Sie Mindestbestellwert, Lieferkosten und verfügbare Zeiten gut sichtbar an.

Halten Sie Formulare kurz und fragen Sie nur Angaben ab, die für die Bestellung benötigt werden. Wenn Ihr System es ermöglicht, bieten Sie eine Bestellung ohne verpflichtendes Kundenkonto an. Feldbeschriftungen sollten auch nach der Eingabe sichtbar bleiben; Fehlermeldungen sollten konkret erklären, was fehlt.

Im Warenkorb müssen sich Mengen, Varianten und Gerichte einfach ändern lassen. Vor dem Abschluss sollten Gäste ihre Auswahl, die Gesamtkosten sowie Liefer- oder Abholdaten prüfen können. Danach braucht es eine eindeutige Rückmeldung zum Bestellstatus. Unterscheiden Sie dabei zwischen einer eingegangenen Bestellung und einer vom Restaurant bestätigten Bestellung.

Ein kurzer Praxistest zeigt die nächsten Verbesserungen

Bitten Sie jemanden, der Ihre Website noch nicht kennt, drei Aufgaben auf einem echten Smartphone zu erledigen: ein bestimmtes Gericht mit Preis finden, die Anfahrt öffnen und eine Bestellung bis zur letzten Übersicht vorbereiten.

Beobachten Sie, wo die Person sucht, zögert oder versehentlich falsch tippt. Testen Sie nach Möglichkeit auf einem iPhone und einem Android-Gerät sowie mit größerer Schrift. Falls Sie eine vollständige Testbestellung durchführen, stimmen Sie diese vorher mit dem Team ab und prüfen Sie auch den Eingang im Restaurant.

Verbessern Sie zuerst die Stellen, an denen Gäste ihre Aufgabe nicht abschließen können. Danach folgen Lesbarkeit, Ladezeit und gestalterische Details. Wiederholen Sie diesen kurzen Test nach größeren Änderungen an Speisekarte, Vorlage oder Bestellsystem. So bleibt Ihre Website auch im laufenden Betrieb einfach bedienbar.