SEO för JavaScript-sajter – fallgropar med rendering
Av CodexierPublicerad 4 min läsning
Moderna webbplatser byggs ofta som JavaScript-applikationer med React, Vue eller liknande ramverk. I en webbläsare ser de ut och fungerar perfekt. För en sökrobot kan det första den får vara en nästan tom HTML-sida med en skripttagg. Google kan köra JavaScript, men inte alltid direkt och inte alltid fullständigt, och många andra robotar – däribland de flesta AI-robotar – kör det inte alls. Här förklarar vi var luckorna kommer ifrån och hur du täpper till dem.
Så hanterar sökrobotar JavaScript
Googlebot hämtar adressen och läser den råa HTML-koden. Sidor som kräver JavaScript läggs i en kö för rendering, där en webbläsare utan gränssnitt kör skripten och fångar resultatet. Det andra steget blir oftast av, men det kostar Google resurser, kan dröja och misslyckas om skripten kraschar, tar för lång tid eller är beroende av sådant roboten inte har, som användarinteraktion eller sparad inloggning. Bing renderar också, med liknande begränsningar. Sociala nätverk som bygger förhandsvisningar av länkar och de flesta AI-robotar läser bara den råa HTML-koden.
Riskerna med rendering i webbläsaren
| Risk | Vad som händer | Vanlig orsak |
|---|---|---|
| Tom första HTML | Robotar utan rendering ser inget innehåll | Ren rendering i webbläsaren |
| Länkar som robotar inte kan följa | Sidor upptäcks aldrig | Navigering byggd med klickhändelser i stället för riktiga ankarlänkar med href |
| Fel eller saknade metataggar | Samma titel överallt, fel kanonisk adress, ingen förhandsvisning | Taggar som sätts av JavaScript efter laddning |
| Mjuka 404-fel | Saknade sidor svarar med status 200 och texten "hittades inte" | Servern skickar alltid appens skal |
| Innehåll bakom interaktion | Flikar, dragspel och "visa fler" indexeras aldrig | Innehåll som bara hämtas vid klick eller skroll |
Förrendering och serverrendering
Lösningen är att leverera meningsfull HTML redan vid första anropet. Det finns tre huvudvägar, och vilken som passar beror på hur ofta innehållet ändras och hur många sidor du har.
Statisk förrendering
Sidorna renderas till HTML när sajten byggs. Idealiskt för marknadssajter och innehåll som ändras vid driftsättning. Snabbt och billigt att drifta.
Serverrendering
HTML skapas på servern vid varje anrop. Passar stora kataloger och innehåll som ändras ofta, men kräver en servermiljö.
Hybrid
Ramverk som Next.js och Nuxt blandar båda per sida: statiskt för marknadssidor, serverrenderat eller i webbläsaren för resten.
Dynamisk rendering, där robotar får en annan version än användare, rekommenderades en gång som nödlösning, men Google beskriver den nu som en tillfällig lösning snarare än en långsiktig. Vi förrenderar själva vår egen sajts publika sidor av just de här skälen.
Metataggar, kanoniska adresser och routing
- Varje adress har egen titel, beskrivning och kanonisk adress i den första HTML-koden.
- Interna länkar är riktiga ankarelement med href, inte knappar med klickhändelser.
- Varje sida har en ren sökväg – undvik routing med fyrkant som /#/tjanster.
- Okända adresser svarar med riktig 404-status, inte appens skal med status 200.
- hreflang-taggar för svensk och engelsk version finns i HTML-koden, inte inlagda i efterhand.
- Strukturerad data finns i den renderade HTML-koden – se strukturerad data för företagssajter.
Testa vad Google ser
- Visa sidans källkod (inte inspektören) och kontrollera att huvudinnehåll och länkar finns där.
- Använd verktyget för adressgranskning i Google Search Console och titta på den renderade HTML-koden och skärmbilden.
- Jämför antalet indexerade sidor med antalet sidor du förväntar dig.
- Hämta sidan med JavaScript avstängt eller med ett enkelt anrop från kommandoraden.
- Kontrollera förhandsvisningar i sociala medier och hur några AI-assistenter beskriver dina sidor.
Renderingsproblem hör till de vanligaste fynden i våra tekniska SEO-granskningar. När du inte behöver det här: körs sajten på WordPress, Webflow eller en annan serverrenderad plattform är rendering sällan ditt SEO-problem – titta hellre på innehåll och länkar. Indexeras inte din JavaScript-sajt som väntat kan du boka ett kostnadsfritt samtal.
Vanliga frågor
Kan Google indexera en React-app med en enda sida?
Ofta ja, men med fördröjning och risker. Innehåll som kräver interaktion, fel i skripten eller långsam datahämtning kan göra att sidor bara indexeras delvis. Förrendering eller serverrendering tar bort det mesta av osäkerheten.
Läser AI-sökverktyg innehåll som skapas med JavaScript?
De flesta AI-robotar läser bara den råa HTML-koden. Syns ditt innehåll först när JavaScript har körts är det troligen osynligt för dem. Vår guide om synlighet i AI-svar går djupare in på det.
Är Next.js automatiskt bra för SEO?
Det gör serverrendering och statisk generering enkelt, men bara om du använder dem. En Next.js-sajt som renderar allt i webbläsaren har samma problem som vilken enkelsidesapp som helst.
Måste vi bygga om sajten för att lösa renderingen?
Oftast inte. Att lägga till förrendering i det befintliga bygget, rätta länkarna och flytta metataggarna in i HTML-koden löser ofta problemet utan ombyggnad.
Är din JavaScript-sajt osynlig i sök?
Skicka oss adressen. På en kvart visar vi vad robotarna faktiskt får och vad som krävs för att rätta det.
Boka ett kostnadsfritt 15-minuterssamtal