Maak een Progressive Web App met WordPress

A Progressive Web App (PWA) is a website designed to function like an app. In this article, we’ll explain how you can use your website to create a Progressive Web App with WordPress in just one minute. 

Wat is een Progressive Web App?

Een PWA is een website die is verpakt om eruit te zien en zich te gedragen als een app. Het kan worden weergegeven als een app-pictogram op smartphones, tablets en computers van gebruikers. Het kan ook offline werken, meldingen naar gebruikers sturen en op alle moderne platformen draaien.

Een Progressive Web App maken

Je kunt van elke website een Progressive Web App maken. Het is niet erg moeilijk voor een ervaren webontwikkelaar, maar zelfs als je niets weet over webontwikkeling kan het eenvoudig zijn. Wij laten je zien hoe je dit doet!

Maak een Progressive Web App met WordPresss

Om een Progressive Web App te maken in WordPress, heb je een plugin nodig. We hebben verschillende plugins getest en onze favoriet gekozen, maar je kunt natuurlijk naar andere plugins zoeken door op “PWA” te zoeken in WordPress.

Hier lees je hoe je een Progressive Web App kunt maken met WordPress:

1. Log in op WordPress
2. Ga naar Plugins in het linkermenu en klik op ‘Nieuwe plugin toevoegen’
3. Zoek naar PWA
4. Installeer Super Progressive Web Apps
5. Klik op Activeren

Zo makkelijk is het! Je website is nu een Progressive Web App! Als je je website bezoekt op een telefoon of computer, kan de browser vragen of je je website als app wilt installeren.

Je kunt je Progressive Web App aanpassen in de instellingen van Super Progressive Web Apps in de linker werkbalk. Daar kun je het logo van je app aanpassen, de beschrijving en naam wijzigen, de achtergrondkleur van het laadscherm aanpassen en nog veel meer. Er zijn extra functies voor verdere aanpassingen, het inschakelen van PWA voor meertalige websites en het snel maken van versies van de app voor de Google Play Store. Deze functies hebben een meerprijs en maken deel uit van de pro versie van de plugin.Vergeet niet dat alle plugins die je op je WordPress website installeert regelmatig moeten worden bijgewerkt om de veiligheid te waarborgen, dus we raden over het algemeen aan om automatische updates in te schakelen. Automatische updates brengen wel het risico met zich mee dat een update je website kan veranderen op een manier die je niet voor ogen had. Met Managed WordPress van one.com worden alle automatische updates gecontroleerd om ervoor te zorgen dat je website perfect blijft werken. We voeren een visuele controle uit van je website voor en na elke automatische update om er zeker van te zijn dat er geen updates problemen veroorzaken voor je site.

Andere methoden om PWA’s te maken

Het is mogelijk om een Progressive Web App te maken voor elke website. We zullen niet het hele proces beschrijven in dit artikel, maar in het kort moet je twee dingen doen om een PWA te maken:

1. Maak een Web App Manifest aan met daarin de naam van je website, het app-icoontje, de kleur en het weergaveformaat.
2. Maak een Service Worker, die fungeert als brug tussen het apparaat van de gebruiker en je website. Het is de Service Worker die van je website een Progressive Web App maakt.

Als je meer wilt weten en aan de slag wilt met je Progressive Web App, kun je een uitgebreide handleiding lezen op web.dev.

De voordelen van een Progressive Web App

Veel van ‘s werelds populairste online diensten maken gebruik van Progressive Web App technologie. Enkele voorbeelden zijn Spotify, Facebook, Tinder, Google, Twitter, Uber en Starbucks. Ook jij kunt een Progressive Web App maken en profiteren van de voordelen. Laten we eens een paar van de belangrijkste voordelen van het maken van een eigen PWA op een rijtje zetten.

App-achtige beleving

Het grootste voordeel van een Progressive Web App is dat het een website dezelfde gebruikerservaring biedt als een app. Een app is snel, kan notificaties versturen, werkt offline en kan een prominente plaats innemen op het apparaat van een gebruiker. Een website laten functioneren als een app heeft deze extra pluspunten:

App-pictogram op het startscherm

Nadat je een Progressive Web App hebt gemaakt, kunnen nieuwe bezoekers van je website deze downloaden als app. Eenmaal geïnstalleerd verschijnt de app op het startscherm van het apparaat van de gebruiker, of dat nu op een iPhone of Android-telefoon is, in het dock van een Mac of in de taakbalk van een Windows-computer.

Het pictogram van je app kan fungeren als reclamebord voor je website. Toen e-commerce gigant Alibaba een Progressive Web App maakte voor hun webshop, zagen ze dat gebruikers die hun app aan het beginscherm toevoegden vier keer vaker terugkwamen dan anderen. Een app-icoon kan dus veel van je bezoekers veranderen in terugkerende gebruikers en klanten.

Mensen die een computer van een organisatie zoals een bedrijf of school gebruiken, kunnen vaak een Progressive Web App installeren, zelfs als de installatie van andere apps verboden is, wat betekent dat het een publiek kan bereiken waar gewone apps moeite mee hebben.

App met een speciale weergave

Een gewone website wordt weergegeven in een browsertabblad, maar een PWA werkt als een gewone app en krijgt daarom een eigen venster op een computer en verschijnt als een zelfstandige app op mobiele apparaten. Gebruikers kunnen hun browser sluiten zonder een Progressive Web App te sluiten en kunnen wisselen tussen apps zonder verschil te merken tussen een gewone app en een PWA.

Uitgelicht in app stores

Zodra je een Progressive Web App hebt gemaakt, kun je deze als app toevoegen aan de Google Play Store en Apple App Store. Hierdoor ziet je app er professioneler uit en wordt hij ontdekt door nieuwe gebruikers. Een belangrijke bonus van een app store is dat je kunt voldoen aan de verwachtingen van je bezoekers over hoe je een app installeert. Gebruikers kunnen zich veilig voelen als ze je Progressive Web App downloaden van een app store die ze vertrouwen.

Eén app voor alle platforms

Wanneer je een Progressive Web App maakt, open je een portaal naar je website. Dit portaal is gebouwd volgens een standaard die werkt met alle moderne platformen. Net zoals je een website kunt maken die op alle apparaten werkt, kun je ook een Progressive Web App maken die voor iedereen werkt. Je kunt de content in alle apps bijwerken door je website aan te passen, en de updates kunnen naar alle gebruikers worden gestuurd zonder dat ze de app hoeven bij te werken.

Snel laden

De eerste keer dat een bezoeker een Progressive Web App downloadt, wordt de app opgeslagen op zijn apparaat. Dit betekent dat hij de volgende keer dat hij wordt geopend snel kan laden. Hierdoor kan een Progressive Web App sneller zijn dan een website. Hetzelfde geldt voor elke klik binnen de app. Voor elke nieuwe pagina kan het apparaat lokale bronnen gebruiken om de laadtijd te verkorten.

Offline modus

Een Progressive Web App kan zo worden ontworpen dat hij offline beschikbaar is. Dit betekent dat de meest kritieke functies altijd toegankelijk zijn en snel laden, zelfs als gebruikers een langzame internetverbinding hebben. Het betekent ook dat je essentiële functies in je app kunt hebben waar je gebruikers op kunnen vertrouwen. Je kunt bijvoorbeeld een functie hebben om boekingen voor evenementen weer te geven. Deze boekingen kunnen worden weergegeven, zelfs als de internetverbinding op de evenementlocatie traag is.

Notificaties verzenden

Het is veel goedkoper om een Progressive Web App te maken dan om apps te ontwikkelen voor zowel iOS als Android. Als je al een goede website hebt, kunnen de kosten om een PWA te maken minimaal zijn. Zelfs als je grote ambities hebt voor je app en van plan bent om uiteindelijk een app met veel functies te maken, kan een Progressive Web App een veel betaalbaarder alternatief zijn tijdens de ontwikkeling.

Goedkoper dan het ontwikkelen van een gewone app

Het is veel goedkoper om een Progressive Web App te maken dan om apps te ontwikkelen voor zowel iOS als Android. Als je al een goede website hebt, kunnen de kosten om een PWA te maken minimaal zijn. Zelfs als je grote ambities hebt voor je app en van plan bent om uiteindelijk een app met veel functies te maken, kan een Progressive Web App een veel betaalbaarder alternatief zijn tijdens de ontwikkeling.

Verkeer en conversie verhogen

Veel grote techbedrijven gebruiken Progressive Web App technologie en daar is een goede reden voor. Een geweldige gebruikerservaring creëert omstandigheden voor veel verkeer en goede conversies. Alibaba heeft een conversiestijging van 76 procent gerapporteerd dankzij hun Progressive Web App. Softwarebedrijf Corel zag een 31 procent hoger percentage terugkerende gebruikers met hun Progressive Web App.

De nadelen van een Progressive Web App

Er zijn ook nadelen aan het maken van een Progressive Web App, vooral in vergelijking met meer traditionele apps die zijn ontwikkeld voor iOS en Android.

Werkt niet op oudere apparaten

Progressive Web Apps zijn een relatief nieuwe technologie en daarom niet beschikbaar op alle apparaten. Voor Apple iOS is ondersteuning beschikbaar sinds iOS 14. Dit betekent dat iPhones uit 2014 of eerder geen ondersteuning bieden voor PWA. Hetzelfde geldt voor Windows, waar ondersteuning ontbreekt in Windows 8 en eerdere versies van Windows. Dat betekent dat veel apparaten die niet compatibel zijn, meer dan tien jaar oud zijn.

Beperkte functionaliteit

Een Progressive Web App kan niet dezelfde functionaliteit hebben als traditionele apps. Er kunnen bijvoorbeeld beperkingen zijn op de manier waarop een app kan integreren met spraakassistenten. Sommige besturingssystemen hebben ook lage limieten voor de ruimte die een Progressive Web App kan innemen op een telefoon, meestal 50 MB. Dit kan het voor sommige grote websites moeilijk maken om als Progressive Web App te functioneren.

Trager dan gewone apps

Omdat een Progressive Web App in wezen een website is die is ontworpen om eruit te zien als een app, wordt hij niet op dezelfde manier gebouwd als een gewone app. Een gevolg hiervan is dat een Progressive Web App vaak trager reageert op klikken dan een gewone app. Een PWA kan nog steeds aanzienlijk sneller zijn dan een website, maar een gewone app zal altijd sneller zijn dan een PWA.

Is het maken van een Progressive Web App de moeite waard?

Heb je een website waarvan je denkt dat je bezoekers die als app zouden willen gebruiken? Is je website ook gebouwd met WordPress? Dan zou je vandaag nog een Progressive Web App moeten maken! Het is heel eenvoudig en kan heel voordelig zijn voor zowel jou als je bezoekers. Een Progressive Web App kan het verkeer naar je website verhogen, je conversies een boost geven en je in staat stellen om met je bezoekers en klanten te communiceren via notificaties.

Als je geen WordPress website hebt, kan een PWA nog steeds waardevol zijn, maar het kan een uitdaging zijn om het te laten werken. Er zijn genoeg hulpmiddelen online, maar je moet een ervaren webontwikkelaar zijn om te slagen.We hopen dat je nu alles hebt wat je nodig hebt om aan de slag te gaan met je Progressive Web App en te begrijpen waarom het een goede technologie is voor jou en je bezoekers. Als je nog geen WordPress website hebt, klik dan hier om te beginnen!