Mobilanpassning för restaurangens sajt: checklista 2026

Kort svar: en mobilanpassad restaurangsajt 2026 betyder att gästen kan läsa menyn, hitta öppettiderna och boka bord från telefonen utan att zooma, vänta eller scrolla i sidled. Checklistan nedan täcker allt – design, meny, bokning, hastighet och de fem vanligaste fallgroparna – så att du kan granska din egen sajt på en kvart.

Öppna din restaurangs hemsida i telefonen just nu. Kan du läsa menyn utan att nypzooma? Hittar du kvällens öppettider inom tio sekunder? Går det att boka bord med tummen, utan att fylla i ett formulär som kräver precisionsarbete? Om svaret på någon av frågorna är nej har du just hittat anledningen till att vissa fredagskvällar känns lugnare än de borde.

Mobilanpassning låter som ett tekniskt modeord, men för en restaurang är det något mycket konkret: det är skillnaden mellan en gäst som bokar och en gäst som ger upp. I den här guiden får du en komplett checklista anpassad för just restauranger, kaféer och barer – inte generiska webbtips, utan de saker som spelar roll när någon står på gatan och väljer var de ska äta. Vi går igenom hur du testar din sajt på två minuter, vad varje del av checklistan betyder i praktiken, de fem vanligaste fallgroparna i branschen och hur du håller allt uppdaterat med en kvartalsvis rutin. Checklistan fungerar oavsett om du byggde sajten själv, har en byrå eller funderar på att bygga om.

Mobilen först: så hittar gästerna dig i dag

Börja med att förstå spelplanen. När någon letar efter en restaurang i dag sker det i överväldigande grad från mobilen: sökningen "restaurang nära mig" görs på bussen, lunchen väljs vid skrivbordet på telefonen, och kvällens middag bokas från soffan. Google har svarat genom att vända på hela sitt index: det är mobilversionen av din sajt som Google tittar på när den bestämmer vad din sida handlar om och hur den ska rankas. Det kallas mobile-first indexing, och det har varit verklighet i flera år.

För restauranger förstärks effekten av två saker. För det första är konkurrensen lokal och omedelbar – gästen jämför dig med tre andra ställen inom samma kvarter, och bytet kostar ett svep. För det andra är besöket ofta tidskritiskt: någon är hungrig nu. En sajt som kräver tålamod förlorar mot en sajt som levererar menyn direkt. Det är därför mobilanpassning för en restaurang inte är en designfråga utan en affärsfråga, i samma klass som öppettiderna på dörren.

Det är också värt att skilja på två begrepp som ofta blandas ihop. Mobilanpassad betyder att sajten fungerar bra på mobilen. Responsiv design är hur man uppnår det: en enda sajt vars layout automatiskt anpassar sig efter skärmstorlek. Alternativet – en separat mobilsajt på en adress som m.dinrestaurang.se – var populärt för tio år sedan men är i dag föråldrat. Det ger dubbelt underhåll, risk för att mobil och dator visar olika information (till exempel olika menyer eller priser), och Google har tydligt sagt att responsiv design är den rekommenderade lösningen. Om din sajt fortfarande har en separat mobilversion bör det stå högt på listan över saker att åtgärda.

Gästen jämför dig inte med din hemsidas potential. Den jämför dig med konkurrentens sajt, som laddade på två sekunder.

Vad Google faktiskt bedömer på mobilen

Det hjälper att veta vad Google tittar på, eftersom det i praktiken är samma saker som gästen upplever. Dels är det mobil användbarhet: text som går att läsa utan zoom, tryckytor med tillräckligt avstånd, och inget innehåll som är bredare än skärmen. Dels är det sidupplevelsen: hur snabbt det viktigaste innehållet syns, hur snabbt sidan reagerar på tryck, och om layouten hoppar medan den laddar. Båda delarna syns i PageSpeed Insights, och båda påverkar rankingen.

För en restaurang finns en tredje, inofficiell faktor: lokal relevans i mobilögonblicket. När någon söker "restaurang nära mig" väger Google in avstånd, öppettider och recensioner – men det är din sajt som ska bekräfta det sökresultatet lovar. Om Google visar att ni har öppet till 22 och sajten säger 21, eller om menyn på sajten inte stämmer med det gästen såg i sökresultatet, bryts förtroendet direkt. Mobilanpassning handlar alltså inte bara om teknik; det handlar om att hela kedjan från sökresultat till bokningsbekräftelse hänger ihop.

Testa din sajt på två minuter

Innan du går igenom checklistan: gör det här testet. Det tar två minuter och ger dig en ärlig bild av utgångsläget.

1. Telefontestet. Öppna din sajt i din egen telefon (inte datorn). Försök att: läsa dagens meny, hitta öppettiderna, hitta adressen och påbörja en bordsbokning. Notera varje gång du behöver zooma, scrolla i sidled eller vänta.
2. PageSpeed-testet. Gå till pagespeed.web.dev, skriv in din adress och titta på mobilpoängen. Under "Mobil användbarhet" listas konkreta problem som för liten text eller för tätt placerade tryckytor. Läs vår guide om hemsidans laddningstid om du vill gå djupare i hastighetsdelen.
3. Väntestet. Be någon som aldrig sett sajten – en vän, en släkting, en stamgäst – att hitta menyn och boka bord medan du tittar på. Där de tvekar finns dina problem.

Skriv ner resultatet. Checklistan nedan är sedan din åtgärdslista: bocka av punkt för punkt och testa igen när du är klar.

Design och layout: tummen bestämmer

På mobilen är tummen både mus och tangentbord. Allt på sajten ska gå att nå och använda med en tumme, med den andra handen upptagen av en väska, ett paraply eller ett barn. Det låter självklart, men många restaurangsajter är fortfarande designade för en muspekare.

Navigation som fungerar i farten

Mobilmenyn – oftast hamburgermenyn med tre streck – ska vara synlig direkt, utan att man behöver leta. Håll den kort: Meny, Boka bord, Öppettider & hitta hit, Om oss. Fler än fem-sex alternativ blir en vägg av text på en liten skärm. De två viktigaste åtgärderna – menyn och bokningen – förtjänar dessutom egna, alltid synliga knappar. En vanlig och effektiv lösning är en fast knapp längst ner på skärmen ("Boka bord") som följer med när man scrollar. Den ska gå att nå med tummen utan att sträcka sig.

Text och tryckytor i rätt storlek

Två siffror att komma ihåg: brödtext minst 16 pixlar och tryckytor minst 44 x 44 pixlar. Mindre text än så tvingar besökaren att zooma, och mindre knappar än så leder till feltryck – särskilt för den som har bråttom eller lite större fingrar. Lämna också luft mellan klickbara element; två länkar som sitter dikt an är en feltrycksfälla. Rubriker ska vara korta och beskrivande eftersom långa rubriker bryts fult på smala skärmar.

Ingen horisontell scrollning

Om besökaren måste scrolla i sidled för att se hela sidan är något fel. Det beror oftast på bilder eller tabeller som är bredare än skärmen, eller text som inte får plats. Testa varje sida i telefonen och åtgärda det som sticker ut. Samma sak gäller popup-fönster: en nyhetsbrevspopup som täcker hela mobilskärmen och är svår att stänga är ett av de snabbaste sätten att bli av med en besökare.

Menyn i mobilen: läsbar utan nypzoom

Menyn är den mest besökta sidan på de flesta restaurangsajter, och det är också där mobilanpassningen oftast brister. Testet är enkelt: kan en förstagångsbesökare läsa hela menyn – rätter, beskrivningar och priser – utan att zooma? Om inte, läs vidare.

HTML-meny slår PDF – varje gång

Den vanligaste boven är menyn som PDF. En PDF är gjord för papper, inte för en 15 centimeter bred skärm: texten blir pytteliten, man måste nypzooma och panorera, och Google har svårt att förstå innehållet. En meny i HTML – alltså som vanlig text direkt på sidan – går att läsa direkt, går att söka i, kan Google indexera (så att dina rätter dyker upp i sök), och kan uppdateras på några minuter när priset ändras. Om du fortfarande har PDF-meny är det den enskilt mest lönsamma mobilförbättringen du kan göra. Vi har skrivit en hel guide om varför PDF-menyn skrämmer bort gäster och hur bytet går till i praktiken.

Så ska menysidan se ut på mobilen

• Tydliga avsnitt med rubriker: Förrätter, Varmrätter, Desserter, Dryck. Gästen ska kunna hoppa direkt till det som intresserar.
• Priserna synliga vid varje rätt – inte i en separat prislista.
• Korta beskrivningar. På mobilen orkar ingen läsa tre rader om varje rätts proveniens. En rad räcker; spara berättelsen till bords.
• Allergener och vegetariska alternativ markerade med enkla symboler eller etiketter. Det är både service och, i många fall, ett lagkrav att allergeninformationen finns tillgänglig.
• Dagens lunch och aktuella menyer överst. Den som söker lunch en tisdag ska inte behöva scrolla förbi helgmenyn.

En gäst som måste nypzooma din meny är redan halvvägs till konkurrentens sajt.

Bokning och kontakt: ett tryck bort

Bokningen är sajtens hela affärskritiska moment. Allt annat – vackra bilder, fin historik, stämningsfulla texter – finns för att leda hit. På mobilen måste vägen från intresse till bokat bord vara så kort som fysiskt möjligt.

Bokningsflödet i mobilen

Det ideala flödet är: tryck på "Boka bord" → välj datum och tid → fyll i namn och telefonnummer → bekräfta. Fyra steg, alla med tummen. Vanliga problem att leta efter: formulär som kräver att man fyller i tio fält (varje extra fält kostar konvertering), datumväljare som inte fungerar på touchskärmar, bokningssystem som öppnas i ett nytt fönster där man måste logga in, och bekräftelsesidor som inte syns ordentligt på mobilen. Testa hela flödet själv i telefonen, från början till bekräftelse. Om du tycker det är krångligt kommer gästerna att tycka det är omöjligt. En genomgång av alternativen finns i vår jämförelse av bordsbokningssystem.

Telefonnummer och adress ska vara klickbara

Det här är en liten detalj med stor effekt. Ett telefonnummer på sajten ska vara en länk (tekniskt: en tel:-länk) så att ett tryck ringer direkt. Samma sak med adressen: ett tryck ska öppna vägbeskrivningen i Google Maps eller Apple Kartor. Många gäster ringer hellre än bokar online – särskilt för större sällskap – och varje extra steg mellan nummer och samtal kostar samtal. Öppettiderna ska dessutom finnas på varje sida, eller högst ett tryck bort, och de ska vara aktuella. Ingenting eroderar förtroendet snabbare än att åka till en restaurang som enligt sajten har öppet men i verkligheten har stängt.

Vägbeskrivning och parkering – den glömda detaljen

När bordet är bokat börjar nästa mobilmoment: att hitta fram. En länkad adress som öppnar vägbeskrivning är grunden, men tänk ett steg längre. Gästen som kommer med bil undrar var man parkerar; gästen som kommer med kollektivtrafik undrar vilken hållplats som är närmast. Några rader text på kontakt- eller hittasidan – "Parkering i P-huset Nordstan, 2 minuters promenad" eller "Spårvagn 3 till Centralstationen, sedan 5 minuter till fots" – tar bort den sista osäkerheten. Det är en liten textinsats som gör att gästen kommer fram avslappnad istället för stressad, och en avslappnad gäst beställer mer.

Hastighet i mobilnät: 4G-tålamod är kort

Mobilanpassning handlar inte bara om hur sajten ser ut utan också om hur snabbt den laddar på ett mobilt nätverk. En sajt som känns snabb på kontorets wifi kan vara plågsam på 4G i en tunnelbanevagn. Målet: det viktigaste innehållet – namn, meny, boka-knapp – ska synas inom cirka 2,5 sekunder även på mobilnät.

De vanligaste hastighetsbovarna på restaurangsajter är desamma som på datorn, men de slår hårdare på mobilen: stora okomprimerade matbilder (komprimera varje bild innan uppladdning; sikta på under 200 kilobyte per bild), bildspel med fem stora bilder på startsidan (byt mot en enda stark bild), tunga bokningswidgetar och Instagramflöden som laddas på varje sida (begränsa dem till sidorna där de behövs), och inbäddade kartor och videor som laddas automatiskt (ladda dem först när besökaren ber om det). En fullständig steg-för-steg-guide finns i vår artikel om att mäta och förbättra hemsidans laddningstid på 30 minuter.

Fem vanliga fallgropar (och snabbåtgärderna)

Efter att ha granskat många restaurangsajter ser vi samma fem misstag om och om igen. Känner du igen din sajt i listan vet du exakt var du ska börja.

Notera att den femte punkten inte är teknisk alls – men den är kanske den viktigaste. En blixtsnabb, vacker mobilsajt med fel öppettider är värre än en långsam sajt med rätt information, eftersom den aktivt lurar gästen att åka någonstans i onödan. Aktualitet är en del av mobilanpassningen: gästen i farten litar på det som står på skärmen.

Den snabbaste mobilsajten i världen hjälper inte om öppettiderna är från förra sommaren.

Håll det uppdaterat: kvartalscheck på 15 minuter

Mobilanpassning är ingen engångsinsats. Nya bilder laddas upp, nya tillägg installeras, menyer ändras – och varje ändring kan bryta något som fungerade. Lägg in en återkommande påminnelse en gång i kvartalet och gå igenom den här listan. Det tar en kvart:

1. Öppna sajten i telefonen. Gå igenom de tre kritiska vägarna: läs menyn, hitta öppettiderna, påbörja en bokning.
2. Kör PageSpeed-testet på startsidan och menysidan. Jämför med förra kvartalets siffror.
3. Kontrollera nya bilder. Är allt som laddats upp sedan sist komprimerat?
4. Granska tillägg och popups. Har något nytt lagts till som sinkar sidan eller täcker skärmen?
5. Verifiera öppettider och meny. Stämmer det som står på sajten med verkligheten – inklusive helgdagar och säsongsändringar?
6. Testa bokningsflödet hela vägen till bekräftelsen.

Den som sköter er Instagram kan sköta detta – det krävs ingen teknisk utbildning, bara rutinen och en telefon. Och om något ser fel ut vet du nu exakt vilken del av checklistan det hör till.

Om listan känns övermäktig, eller om sajten behöver mer än puts – kanske är det dags att bygga om från grunden med mobilen först. Då är det värt att veta vad det kostar: läs vår genomgång av vad en restauranghemsida kostar 2026. Och om du vill slippa tänka på teknik helt och hållet finns PowerfulWebsite – vi bygger restaurangsajter som är mobilanpassade, snabba och bokningsklara från dag ett, så att du kan lägga tiden på maten istället.

Vanliga frågor