Het gebruik van een Progressive Web App wordt steeds populairder en wordt door vele marketing experts gezien als een handige manier voor het verhogen en optimaliseren van de SEO.
Lees de onderstaande tekst en kom alles te weten over wat een PWA inhoudt, wat zoal de voor- en nadelen zijn, waar je op moet letten en hoe je je PWA kunt testen op SEO.
Wat is een PWA?
PWA staat voor ‘progressive web apps’, en is in wezen een combinatie van een webapplicatie (app) en een website die beschikt over bepaalde functies die voorheen slechts toegankelijk waren voor native desktop- of mobiele applicaties.
Een PWA webpagina wordt weergegeven in een app-vormgeving en heeft veel functies die we kennen van een app, zoals de push meldingen (notificaties) voor bezoekers. Deze pushmeldingen verhogen de gebruikersbetrokkenheid en kunnen je marketingstrategie een flinke boost geven.
Een PWA heeft zijn app-achtige karakter te danken aan de application shell architecture (de code waaruit de app bestaat, namelijk HTML, CSS en Javascript) en dankt zijn functionaliteit aan de service worker (een soort proxy die functioneert tussen de website en de browser).
Het grote verschil tussen een PWA, een website en een native app is dat een PWA de voordelen van zowel een website als een app bij elkaar brengt en hierdoor dus veel voordelen heeft.
Wat zijn de voordelen van PWA voor SEO?
Het grote voordeel van PWA ten opzichte van normale native desktop- of mobiele applicaties is dat ze vindbaar zijn voor zoekmachines.
Zo kan de content van een PWA volledig geïndexeerd worden, waardoor je dus kunt werken aan het optimaliseren van je Search Engine Optimization (SEO).
PWA’s kunnen gelezen worden door de zogenoemde ‘crawlers’ van Google en kunnen jouw pagina’s hierdoor optimaal zichtbaar maken.
Met PWA is zowel achtergrondsynchronisatie als offline navigatie mogelijk, waardoor bestanden worden opgeslagen die al zijn gedownload. Hierdoor krijgt de gebruiker van de pagina toegang zonder de pagina’s opnieuw te hoeven downloaden, bv. als de gebruiker even niet beschikt over een internetverbinding.
Een PWA is daarnaast altijd up-to-date en vergt geen updates zoals traditionele apps. Ook hoeft de gebruiker geen app store te gebruiken en is een PWA toegankelijk voor elk soort besturingssysteem. Hiermee kun je een groot publiek bereiken.
John Mueller, Head of Search bij Google zegt overigens dat PWA’s an sich geen voordeel hebben ten opzichte van normale webpagina’s:
“PWA’s currently don’t have any advantage in Google Search and as far as I know, there are no plans to change this.”
Oké, het hebben van een PWA levert je dus niet direct SEO-voordeel op ten opzichte van normale pagina’s. Dat zou ook gek zijn. Toch kan een PWA indirect natuurlijk wel SEO-voordelen hebben.
Dit zit hem met name in de snelheidswinst die je boekt. De snelheid van je pagina is namelijk een belangrijke ranking factor voor Google.
Maar ook een betere gebruikerservaring (UX) komt je SEO vaak ten goede. Een betere UX zorgt er voor dat bezoekers langer op je website blijven en sneller converteren.
Wat zijn de nadelen van PWA voor SEO?
PWA is niet voor elke situatie ideaal en heeft niet altijd een positief effect op je SEO resultaten. Zo is het ontwikkelen van een PWA een lastige klus en is het gebruik van PWA nog redelijk in de ontwikkelfase. Laat dit dan ook door echte professionals met verstand van zaken doen. ?
Er kleven echter nog meer gevaren aan een PWA voor je vindbaarheid. Een PWA is namelijk op JavaScript gebaseerd en JavaScript en Google gaan nog lang niet altijd goed samen.
Dit komt doordat statistische websites gebruik maken van server-side rendering (SSR) en websites gebaseerd op JavaScript gebruik maken van client-side rendering (CSR).
Bij gewone statische websites wordt de HTML geheel klaargezet op de server, terwijl bij een op JavaScript (SPA/PWA) gebaseerde website de HTML opgebouwd wordt in de browser van de gebruiker.
Sommige SPA/PWA-applicaties maken gebruik van SSR, waarbij de JavaScript op de server uitgevoerd wordt, zodat de HTML al klaar staat voor het eerste bezoek.
Voor vervolg-requests van dezelfde bezoeker wordt de HTML wel aan de client-kant bijgewerkt en niet meer door de server gegenereerd. Bij een traditionele applicatie wordt alle HTML bij iedere request opnieuw geheel aan de kant van de server opgebouwd.
Vanuit UX-perspectief heeft CSR de voorkeur, maar het is ingewikkelder als het gaat om SEO. Niet alle content is namelijk direct zichtbaar. De oplossing volgens Google is Dynamic Rendering.
Met Dynamic Rendering combineer je beide render-mogelijkheden: bots voor zoekmachines krijgen de SSR-versie, terwijl de echte bezoeker de CSR-versie krijgen.
Naast het verschil tussen de twee rendering systemen, is het belangrijk dat je let op het ontwerp van je site. Zorg ervoor dat je site offline toegankelijk is, mobielvriendelijk is en de PWA functies bevat die aan het startscherm kunnen worden toegevoegd.
Controleer en test je PWA op verschillende browsers om problemen te voorkomen en vermijd daarnaast het gebruik van lange URL’s en URL’s met dubbele inhoud. Met korte, beter leesbare URL’s en een SEO-vriendelijke presentatie van de inhoud, kun je jouw PWA op een positieve manier presenteren aan de gebruikers.
Hoe test je je PWA op SEO?
Er zijn diverse manieren waarop je je PWA op SEO kunt controleren. Een veelgebruikte methode hiervoor is Lighthouse, een open-source tool van Google. Dit programma biedt de mogelijkheid je PWA te controleren op snelheid van laden, de veiligheid en op de toegankelijkheid.
Daarnaast kun je met behulp van de de Fetch As Google-tool in Search Console zien hoe Google door jouw PWA crawlt en Google jouw PWA “ziet”.
Hierdoor kun je zien wat gebruikers zien en of de pagina’s visueel aantrekkelijk zijn. Via dit systeem kun je ook controleren of bepaalde pagina’s worden geblokkeerd door robots.txt, zoals bepaalde JavaScript-bestanden of andere PWA-functies.
Conclusie
Progressive Web Apps bieden tal van voordelen maar vereisen ook een zekere kennis van zaken. Zonder de juiste programmering voegt een PWA weinig toe aan je SEO. Echter, met de juiste toewijding kun je met behulp van een PWA zorgen voor een zeer goede gebruikerservaring en pagina’s die wel degelijk compatibel zijn met SEO.
Het is belangrijk om de PWA mobielvriendelijk te maken en bruikbaar te maken voor verschillende schermformaten. Een goede gebruikerservaring zorgt er ten slotte voor dat bezoekers graag terugkeren naar jouw pagina’s. Zorg daarnaast voor korte URL’s en nauwkeurige en kwalitatieve inhoud.
