Als je ooit op een prachtige, interactieve website bent geweest waar je tegelijkertijd confetti in de lucht wilt gooien en deze met je vrienden wilt delen, is de kans groot dat deze met JavaScript is gebouwd.
In feite elke site die Google Analytics (en andere trackingtools) gebruikt of interactieve elementen of webapplicaties bevat ook maakt gebruik van JavaScript, een vrijwel alomtegenwoordige codeertaal. De mogelijkheden zijn onbeperkt.
Het nadeel? Als het verkeerd wordt gedaan, kan dit uw SEO negatief beïnvloeden. Hoe kunt u JavaScript SEO in uw voordeel gebruiken en uw zoekprestaties verbeteren? Laten we erin duiken.
Hoe u uw JavaScript SEO-vriendelijk kunt maken
JavaScript SEO beste praktijken
Wat is JavaScript SEO?
Voordat we JavaScript SEO definiëren: laten we het hebben over de meest voorkomende gebruiksscenario's voor JavaScript. Naast het ontwikkelen van websites, JavaScript is een uitstekende optie voor gaming, computerprogramma's en meer.
Bij webontwikkeling wordt het voornamelijk gebruikt voor een interactieve website, web- en mobiele apps en dynamische inhoud.
Als u eenmaal weet hoe de programmeertaal wordt gebruikt, gaat JavaScript SEO er simpelweg om ervoor te zorgen dat zoekmachines elke site die met JavaScript is gebouwd gemakkelijk kunnen vinden.
Als uw begrip van SEO zich voornamelijk beperkt tot trefwoordoptimalisatie, bent u verre van de enige. Er zijn uiteindelijk drie soorten SEO: on-page, off-page en technisch.
On-page SEO richt zich op de inhoud van uw site (zoekwoordoptimalisatie). Off-page SEO houdt zich bezig met de reputatie, populariteit en bruikbaarheid van uw site, en ligt grotendeels buiten uw controle.
JavaScript SEO valt onder de derde categorie: technische SEO – die erop gericht is ervoor te zorgen dat uw site doorzoekbaar, indexeerbaar en crawlbaar is, zodat mensen zoeken naar de informatie die u aanbiedt kan het vinden.
Meer weten over On Page en Technische SEO? Bekijk hier onze gratis tutorial!
Hoe u uw JavaScript SEO-vriendelijk kunt maken
Het merendeel van het JavaScript dat op websites wordt gebruikt, inclusief die van jou en de mijne, heeft geen significante invloed op SEO. De grootste uitdaging komt wanneer uw ontwikkelaar JavaScript gebruikt om secties met veel belangrijke informatie of hele pagina's te bouwen.
De reden is simpel: JavaScript kan het voor zoekmachines moeilijker maken om uw site te lezen.
1. Gebruik (spaarzaam) dynamische weergave als tijdelijke oplossing.
Een van de belangrijkste problemen met JavaScript-SEO en indexering heeft betrekking op de manier waarop uw code wordt weergegeven – of hoe Google uw site indexeert (of niet indexeert).
Dat betekent dat u moet begrijpen hoe uw site kan worden weergegeven: weergave aan de serverzijde, weergave aan de clientzijde en dynamische weergave.
Server-side rendering (SSR)
Wat het is: Wanneer JavaScript op de server wordt weergegeven voordat het in uw browser of in de crawlers van Google verschijnt.
Hoe het SEO beïnvloedt: Het vermindert de laadtijd voor de belangrijkste inhoud van uw pagina, waardoor de SEO-prestaties toenemen.
Het nadeel van SSR: SSR kan de benodigde tijd drastisch verlengen als u gebruikersinvoer nodig heeft.
Rendering aan de klantzijde (CSR)
Wat het is: CSR is wanneer JavaScript in uw browser wordt weergegeven met alleen een basisversie van HTML, en de rest van de inhoud wordt geleverd via JavaScript.
Hoe het SEO beïnvloedt: Het vermindert de indexeerbaarheid omdat het grootste deel van uw inhoud via JavaScript wordt geleverd.
De keerzijde van MVO: Hoewel de weergave sneller gaat, zijn de zoekprestaties veel lager. U moet zich er dus op concentreren Google zoveel mogelijk informatie te geven, zodat Google uw inhoud op de juiste manier kan indexeren.
Deskundige tip: Kristina Azarenko, een toonaangevend technisch SEO-expert, zegt: “Het gebruik van weergave aan de clientzijde betekent dat Googlebot geen toegang heeft tot de inhoud.
Een veel betere en succesvollere aanpak is het gebruik van server-side rendering, zodat Googlebot ook de inhoud vanaf de server serveert.”
Dynamische weergave
Wat het is: Dynamische weergave identificeert bots die JavaScript niet kunnen weergeven en levert een SSR-versie.
Hoe het SEO beïnvloedt: Hiermee kunnen bots een versie van uw inhoud indexeren, waardoor deze beter vindbaar wordt.
Het nadeel van dynamische weergave: Uiteindelijk is dynamische weergave een oplossing die volgens Google geen langetermijnoplossing zou moeten zijn, omdat “het extra complexiteit en resourcevereisten met zich meebrengt.”
Dynamische weergave kan worden gebruikt door sites die snelle inhoudsveranderingen ervaren of inhoud hebben die JavaScript gebruikt dat niet compatibel is met browsers. Het is niet de beste oplossing voor de meeste sites en hoeft niet op elke sitepagina te worden gebruikt.
2. Gebruik unieke, beschrijvende meta-inhoud.
Zorg ervoor dat Google gemakkelijk kan achterhalen wat elke pagina gebruikt meta-inhoud, paginatitels en metabeschrijvingen. Dit bevat
- Titeltags.
- Meta beschrijvingen.
- Alt-tekst en attributen voor afbeeldingen.
Door meta-inhoud toe te voegen, kan Google achterhalen waar uw site of pagina over gaat, waardoor het indexeren van uw site en pagina’s eenvoudiger en nauwkeuriger wordt.
3. Implementeer lazyloading.
Trage voortgang versnelt het laden van pagina's door inhoud alleen weer te geven als dat nodig is of op het punt staat te worden gelezen. Het is vooral handig voor het laden van grote afbeeldingen of inhoud waarvoor veel bronnen nodig zijn.
Uw afbeeldingen en inhoud en elementen die veel bronnen vereisen, worden niet geladen met de rest van de inhoud bovenaan de pagina, maar terwijl gebruikers de inhoud lezen, worden ze geladen.
En als uw gebruiker niet tot aan de onderkant van de pagina leest, laadt u geen onnodige afbeeldingen.
Het nadeel is dat als je iemand snel laat scrollen, hij/zij mogelijk wacht tot de afbeeldingen zijn geladen. Bovendien kan dit van invloed zijn op de manier waarop Google uw webpagina ziet. Dus als u deze praktijk volgt, doe dat dan zorgvuldig.
4. Zorg ervoor dat uw JavaScript compatibel is met Google.
Ga in jouw Zoeken Console en plak de URL van uw specifieke pagina in het URL-inspectie tool om te zien hoe Google het weergeeft.
Wil je een ander hulpmiddel om te testen? U kunt ook de Google Rich Results Test en de Google Mobile Friendly Test gebruiken om de weergegeven HTML te bekijken.
Deskundige tip: David Zimmermann van Betrouwbaar Acorn raadt het gebruik van tools zoals de Google Mobile Friendly Test aan, omdat deze u laten zien wat de Google-spider ziet.
Zimmerman voegt eraan toe dat het feit dat “uw ontwikkelaar ‘ergens heeft gelezen’ dat Google JavaScript kan lezen, niet betekent dat hij begrijpt hoe hij een SEO-vriendelijke JavaScript-website moet schrijven.”
De bottom-line hier? Het is een goed idee om op de hoogte te blijven.
5. Los eventuele zoekgerelateerde fouten op.
U kunt een voorbeeld van de geteste pagina bekijken zodra u bevestigt dat Google de pagina heeft geïndexeerd. Google geeft alleen de inhoud weer die het kan zien. Als de geteste pagina dus niet correct wordt weergegeven, kan Google deze niet indexeren.
Het beste van alles is dat u kunt ontdekken wat er gebeurt en waarom, en stappen kunt ondernemen om het probleem op te lossen.
6. Repareer en test opnieuw.
Nadat u eventuele fouten met betrekking tot JavaScript-weergave en -compatibiliteit heeft opgelost, kunt u de URL-inspectietool gebruiken om ervoor te zorgen dat uw JavaScript correct werkt in de live-modus en Google verzoeken de bijgewerkte code te indexeren.
JavaScript SEO beste praktijken
Ik heb met verschillende JavaScript-SEO-experts gesproken om meer te weten te komen over hun best practices, en daar komen we zo op terug. Zorg er echter eerst en vooral voor dat u op basis van de meest recente informatie werkt.
1. Krijg een inleiding over JavaScript SEO.
Er komt veel kijken bij JavaScript SEO, en omdat browsers regelmatig updates ondergaan, heb je misschien een inleiding nodig als je JavaScript SEO al een tijdje niet hebt gedaan.
Als u opnieuw wilt bekijken waar zoekmachines naar op zoek zijn als het om JavaScript gaat of als u gedetailleerde instructies wilt krijgen over wat u moet oplossen (en hoe), zet Google alles wat u moet weten in Google Zoeken Centraal.
Het is het geheime wapen van iedereen met een website, omdat het u precies vertelt hoe u uw website SEO-vriendelijk kunt maken – en het bevat een hele sectie gewijd aan JavaScript.
2. Zet alle belangrijke inhoud in de broncode.
Weet je nog dat ik zei dat Google alleen kan indexeren wat het kan zien? Volg het volgende om ervoor te zorgen dat uw site indexeerbaar is Azarenko's advies en "zorg ervoor dat JavaScript-problemen uw SEO-inspanningen niet ondermijnen."
Ze beveelt aan “ervoor te zorgen dat alle belangrijke inhoud beschikbaar is in de broncode (dat wil zeggen voordat JavaScript wordt uitgevoerd). Hierdoor kan Google uw informatie ‘lezen’ zonder afhankelijk te zijn van JavaScript.
Neem alle metadata op (titel, meta-robots, canonieke tags, enz.), bodycopy en gestructureerde gegevens.
3. Test uw site regelmatig op JavaScript SEO-vriendelijkheid.
Zelfs kleine wijzigingen in uw JavaScript-code of inhoud kunnen de manier waarop Google uw site ziet, veranderen. En dit is niet beperkt tot uw JavaScript: het gebruik van tools zoals Google Search Console om de paginaprestaties te monitoren, kan ervoor zorgen dat uw site bovenaan de zoekresultaten blijft staan.
Deskundige tip: tristan harris raadt aan tools als Google PageSpeed Insights en Lighthouse te gebruiken om de SEO-prestaties te testen en verbeterpunten te identificeren.
Beste praktijk #4. Blijf op de hoogte van de richtlijnen van Google.
Google werkt zijn algoritmen – en dus ook zijn best practices – regelmatig bij. Met dat in gedachten is het een goed idee om op de pagina van Google te letten op updates.
Zimmerman raadt aan een paginamonitor zoals Hexomatic te gebruiken om bij te blijven Richtlijnen van Google voor JavaScript SEO, “Als de paginamonitor mij laat zien dat Google een update heeft doorgevoerd, kijk ik of dit mijn processen op wat voor manier dan ook zou moeten veranderen.”
Beste praktijk #5. Volg de beste SEO-praktijken op de pagina.
Natuurlijk concentreer ik me hier specifiek op JavaScript SEO, maar de belangrijkste principes van SEO nog steeds van toepassing. Hoewel JavaScript de hoeveelheid inhoud die zoekmachines te zien krijgen kan verminderen, is het nog steeds van essentieel belang ervoor te zorgen dat uw inhoud is geoptimaliseerd voor de beste SEO-praktijken.
Tip van een expert: Dave Vermeer raadt aan JavaScript uit te schakelen.
“Het is de snelste manier om een reeks grotere problemen te identificeren. Wanneer u pagina's op uw site bezoekt, kunt u alarmsignalen tegenkomen, zoals ontbrekende inhoud omdat deze niet wordt weergegeven voordat de pagina is geladen en als sommige links niet werken.' zegt Ver Meer.
Probeer het uit
Om mijn nieuwe vaardigheden te testen in een relatief (lees: volledig) veilige omgeving, ging ik naar mijn soms vriend, soms aartsvijand ChatGPT.
Mijn prompt: “Ik wil een JavaScript-codeformulier maken om leads te verzamelen. Gebruik leuke tijdelijke aanduidingen voor naam, e-mailadres, budget en bericht.”
Reactie van GPT: “Zeker! Hieronder ziet u een eenvoudig voorbeeld van een JavaScript-formulier dat leads verzamelt. Dit formulier bevat velden voor naam, e-mailadres, budget en een bericht. Ik heb leuke tijdelijke aanduidingen toegevoegd, zoals je had gevraagd.
Het formulier bevat ook basisvalidatie om ervoor te zorgen dat de naam-, e-mail- en berichtvelden niet leeg blijven.”
Hier is de HTML voor het formulier.
Wat betreft de leuke tijdelijke aanduidingen? Nou, GPT dacht dat Iron Man leuk zou zijn. Zo ziet de volledige code in HTML eruit:
En hier is het JavaScript:
Natuurlijk had ChatGPT een disclaimer:
Nu voor het leuke gedeelte. Laten we eens kijken hoe ChatGPT dit JavaScript optimaliseert voor SEO.
Het is niet verwonderlijk dat de HTML-versie van de code aanzienlijk robuuster was. Ik heb het in twee delen opgedeeld, zodat je de verschillen kunt vergelijken. (Ik zal ze hieronder spellen.)
De hoofdtekst lijkt behoorlijk op elkaar, waarbij de meeste wijzigingen betrekking hebben op de hypothetische inhoud van de leadgeneratiepagina.
Laten we nu eens kijken naar het bijgewerkte JavaScript.
Ziet het er bekend uit? Laten we de code naast elkaar vergelijken.
Ze zijn identiek. Verrast?
Dit is waarom.
Mijn gloednieuwe JavaScript-code is verantwoordelijk voor de functionaliteit van mijn gloednieuwe leadgeneratieformulier.
En alleen de functionaliteit.
Het is niet verantwoordelijk voor de structuur of de “pagina”-inhoud. Dat is waar HTML om de hoek komt kijken. En dat is ook waar aanbevelingen voor SEO-optimalisatie van toepassing zijn.
Hoe ik ChatGPT gebruikte om JavaScript SEO te optimaliseren
Vraagt u zich af welke specifieke wijzigingen ChatGPT heeft aanbevolen om de JavaScript SEO te optimaliseren?
Wijziging 1. Voeg een paginatitel en metabeschrijving toe.
Wijziging 2. Gebruik koptags.
Wijziging 3. Label formuliervelden voor SEO en toegankelijkheid.
Wijziging 4. Voeg alt-tekst toe aan afbeeldingen.
Wijziging 5. Gebruik responsive design om de pagina mobielvriendelijk te maken.
Wijziging 6. Voeg schema-opmaak toe om zoekmachines te helpen de inhoud van uw pagina te begrijpen.
De essentie van JavaScript SEO
Als u besluit JavaScript op uw website te gebruiken, moet u de implicaties voor SEO begrijpen en dienovereenkomstig plannen om ervoor te zorgen dat uw site SEO-vriendelijk blijft – of vindbaar, doorzoekbaar en indexeerbaar door zoekmachines.
Dit is niet bedoeld om u te waarschuwen voor JavaScript. Integendeel, om het meeste uit uw interactieve functies te halen, is het noodzakelijk om ontwikkelaars te vinden en in te huren die JavaScript en SEO begrijpen en u kunnen helpen opvallen terwijl u gevonden wordt.
De grootste afhaalmaaltijd? Het belangrijkste dat u kunt doen om uw JavaScript SEO-vriendelijk te maken, is ervoor zorgen dat deze correct wordt weergegeven en dat de HTML van uw pagina zo is gestructureerd dat deze zoveel mogelijk informatie over de inhoud van de pagina biedt.
Misschien verrassend (en misschien ook niet) zijn de regels van on-page SEO van toepassing op JavaScript SEO – de sleutel ligt in het ervoor zorgen dat zoekmachines uw inhoud kunnen ‘zien’.
- Door SEO aangedreven content en PR-distributie. Word vandaag nog versterkt.
- PlatoData.Network Verticale generatieve AI. Versterk jezelf. Toegang hier.
- PlatoAiStream. Web3-intelligentie. Kennis versterkt. Toegang hier.
- PlatoESG. carbon, CleanTech, Energie, Milieu, Zonne, Afvalbeheer. Toegang hier.
- Plato Gezondheid. Intelligentie op het gebied van biotech en klinische proeven. Toegang hier.
- Bron: https://blog.hubspot.com/marketing/javascript-seo
