Søgemaskiner kan nu udføre JavaScript og indeksere det renderede indhold. Men mange hjemmesider har stadig problemer med JavaScript, der skader SEO. Indhold, der afhænger af JavaScript for at indlæses, bliver måske ikke indekseret. Billeder med lazy loading bliver måske ikke opdaget. Rendering på klienten kan være for langsom. Søgemaskiner venter måske ikke på, at alt indlæses. Ordentlig optimering af JavaScript sikrer, at søgemaskiner ser alt dit indhold, forstår det og kan crawle det effektivt.
Sådan håndterer søgemaskiner JavaScript
Google crawler sider, som en browser ville. Den udfører JavaScript, renderer indhold og indekserer det, den ser. Det er gode nyheder. Komplekse applikationer med JavaScript kan indekseres.
Google behandler sider i to bølger. I første bølge crawler den HTML for at se sidens grundlæggende struktur. I anden bølge renderer den JavaScript for at se dynamisk indhold. Den proces i to bølger tager tid og ressourcer.
For sider med kompleks JavaScript eller tung rendering venter Google måske ikke på, at alt indlæses. Den indekserer måske kun det, der er synligt efter rendering i nogle få sekunder. Indhold, der indlæses langsomt eller med lazy loading, bliver måske ikke indekseret.
Almindelige problemer med JavaScript i SEO
Rendering på klienten forsinker synlighed af indhold. En blank HTML-side indlæser JavaScript, der renderer indhold. Google ser først den blanke side. Hvis rendering tager for lang tid, indekserer Google måske den blanke version.
Billeder og indhold med lazy loading indlæses kun, når brugere scroller. Google scroller ikke altid. Indhold med lazy loading under folden bliver måske ikke opdaget eller indekseret.
JavaScript-fejl ødelægger rendering. Hvis JavaScript har fejl, bliver siden måske ikke renderet ordentligt. Søgemaskiner ser ødelagt, ufuldstændigt indhold.
Dynamisk genererede URL'er med parametre (page?id=123&sessionid=abc) skaber duplikeret indhold. Hver unik parameter skaber en ny URL. Søgemaskiner ser måske tusindvis af dubletter for det samme indhold.
Metatags, der genereres af JavaScript, bliver måske ikke set af alle crawlere. Open Graph-tags, kort til sociale medier og andre metatags, der tilføjes via JavaScript, bliver måske ikke læst korrekt af crawlere fra sociale medier.
Rendering på serveren mod rendering på klienten
Rendering på serveren genererer HTML på serveren og sender den til browseren. HTML'en indeholder allerede alt indholdet. Browsere viser den med det samme. Søgemaskiner ser alt indhold med det samme.
Rendering på klienten sender minimal HTML og JavaScript, der bygger siden i browseren. Indhold genereres i browseren, efter JavaScript er udført. Det tager længere tid, og søgemaskiner ser måske ikke alt.
Til SEO er rendering på serveren eller statisk generering bedre. HTML sendes komplet til browseren (og søgemaskiner). Indhold er synligt med det samme.
Test rendering af JavaScript
Brug værktøjet Inspektion af URL i Google Search Console. Indtast en side med meget JavaScript. Google viser, hvad den fandt efter rendering. Du kan sammenligne siden, som den blev crawlet (det, Google ser), med det, du ser i din browser.
Brug Lighthouse i Chrome DevTools. Det tester, hvor crawlbar din side er, og markerer problemer relateret til JavaScript.
Se sidens kilde i din browser for at se rå HTML. Inspicér så elementet for at se det renderede DOM. Sammenlign dem. Hvis de er meget forskellige, har du rendering på klienten, der kan forvirre søgemaskiner.
Brug en proxy til fejlfinding af JavaScript. Simulér, hvad Google crawler, og hvad der bliver renderet.
Bedste praksis for JavaScript i SEO
Brug rendering på serveren (SSR) eller statisk generering af hjemmesider (SSG) til kritisk indhold. Det sikrer, at indhold står i den HTML, der sendes til søgemaskiner.
Indlæs vigtigt indhold på forhånd eller med det samme. Stol ikke på lazy loading til indhold over folden. Indlæs kritiske billeder og tekst med det samme.
Undgå dynamisk genererede URL'er med unødvendige parametre. Brug rene, enkle URL'er. Hvis du må bruge parametre, så brug canonical-tags til at samle dubletter.
Sørg for, at metatags står i HTML'en eller bliver renderet hurtigt af JavaScript. Crawlere fra sociale medier og søgemaskiner bør se metatags med det samme, ikke efter tung rendering.
Test med Google Search Console. Tjek, hvad Google ser efter rendering. Ret uoverensstemmelser mellem det, du ser, og det, Google ser.
Minimér størrelsen på pakken med JavaScript. Store JavaScript-filer tager længere tid at downloade og udføre. Mindre pakker renderer hurtigere, og søgemaskiner crawler hurtigere.
Frameworks og SEO
React, Vue, Angular og andre moderne frameworks bruger som standard rendering på klienten. Det skaber udfordringer for SEO, fordi indhold skal renderes, før søgemaskiner kan se det.
Next.js og Nuxt.js er meta-frameworks, der tilføjer rendering på serveren eller statisk generering til React og Vue. De løser mange problemer med rendering på klienten.
Hvis du bruger et framework på klienten uden rendering på serveren, skal du være ekstra omhyggelig med JavaScript i SEO. Test grundigt med Google Search Console.
Ofte stillede spørgsmål
Kan Google indeksere indhold med meget JavaScript?
Ja, Google kan udføre JavaScript og indeksere renderet indhold. Men det tager tid og ressourcer. Meget tungt JavaScript bliver måske ikke fuldt indekseret, hvis rendering tager for lang tid. Hold JavaScript effektivt, og test med Google Search Console for at sikre, at dit indhold bliver indekseret. Med WEMASY's hjemmesidebygger kan du sætte det op direkte på din hjemmeside.
Skal jeg bruge rendering på serveren eller rendering på klienten?
Rendering på serveren er bedre til SEO. Indhold står i den HTML, der sendes til søgemaskiner. Søgemaskiner ser det med det samme uden at vente på JavaScript. Rendering på klienten skaber forsinkelser og risiko for, at indhold ikke bliver indekseret. Brug rendering på serveren eller statisk generering til indhold, der skal placere sig i søgning.
Skal jeg levere anden HTML til søgemaskiner?
Nej. Google foretrækker, at du leverer den samme HTML til alle. Lav ikke særlige versioner til Googlebot. Brug ordentlig rendering på serveren eller registrering af rendering. Google crawler den normale version til brugere og bør se alt indhold.
Hvordan retter jeg billeder med lazy loading til SEO?
Indlæs kritiske billeder over folden på forhånd. Brug indbygget lazy loading (loading="lazy") med ordentlige reserveløsninger til ældre browsere. Brug Intersection Observer API til at indlæse billeder, mens brugere scroller. Test med Google Search Console for at sikre, at Google ser dine billeder.
Gør JavaScript min hjemmeside langsommere?
Ja, udførelse af JavaScript tager tid. Store pakker med JavaScript og tung behandling gør indlæsning af siden langsommere. Det skader brugeroplevelsen og Core Web Vitals. Minimér størrelsen på pakken med JavaScript, del koden op, og udskyd JavaScript, der ikke er kritisk. Indlæs kun det, der er nødvendigt.
Skal jeg bruge JavaScript til at generere metatags?
Undgå det, hvis det er muligt. Metatags bør stå i kilden til HTML. Crawlere fra sociale medier og nogle søgemaskiner udfører måske ikke JavaScript. Hvis du må generere metatags med JavaScript, så brug rendering på serveren eller prærendering for at sikre, at de står i HTML'en.