Een introductie tot Progressive Web Applications (PWA’s)

In de geschiedenis van e-commerce zijn er belangrijke mijlpalen: De start van het telewinkelen in de jaren zeventig, een gepensioneerde vrouw die als eerste ter wereld thuis winkelt in de jaren tachtig, en de uitvinding van het wereldwijde web in de jaren negentig. Maar de afgelopen jaren draaide het vooral om shoppen via je mobiele telefoon, social buying en Amazon.

Al deze ontwikkelingen gaan hand in hand met de vooruitgang van de wereldwijde technologie, of specifieker: het internet. Nu steeds meer mensen online gaan, smartphones kopen of toegang krijgen tot snel internet, versnelt de evolutie van e-commerce.

En dit is waar Progressive Web Applications (PWA’s) om de hoek komen kijken.

Sinds Google de term in 2015 heeft bedacht, veranderen PWA’s het app-landschap. Het gebruik ervan neemt dan ook toe. Uit gegevens blijkt dat desktop-PWA-installaties in slechts één jaar tijd met 270% zijn gestegen. Experts voorspellen dat de marktwaarde van PWA’s in 2027 meer dan 10 miljard euro zal bedragen.

PWA’s kennen dus een duidelijke groei, maar uit cijfers blijkt dat het voor een kwart van de e-commercebedrijven nog niet helemaal duidelijk is wat Progressive Web Applications zijn en hoe ze die kunnen gebruiken. Daarom duiken we in dit artikel even in de wereld van PWA’s: wat zijn ze, hoe worden ze ontwikkeld en gebruikt, en welke voordelen bieden ze jouw bedrijf?

Wat zijn Progressive Web Applications?

Een Progressive Web App is een soort webapplicatie via het internet. Zie ze als websites die op dezelfde manier werken als native apps – apps die zijn ontwikkeld voor het gebruik op een specifiek platform of apparaat. Om te kunnen functioneren gebruiken PWA’s webtechnologieën, of de tools en talen die apparaten gebruiken om met elkaar te communiceren. Daarnaast kunnen PWA’s worden geoptimaliseerd voor elk apparaat, werken ze in alle belangrijke browsers en kun je ze zelfs offline gebruiken. Gebruikers hoeven geen software te downloaden om ze te gebruiken.

Een PWA is:

– Progressief. Aangezien ze zijn gebouwd met een progressieve verbetering als kern, werken ze op elk apparaat en maken ze gebruik van de specifieke functies van het apparaat en de browser van de gebruiker.

– Vindbaar: Je kunt de app vinden via zoekmachines.

– Makkelijk te installeren: Je kan een PWA op het startscherm van je toestel installeren of op een app launcher.

– Deelbaar: Je kan de URL van een PWA delen.

– Connectiviteits-onafhankelijk: Een PWA kan offline werken of met een internetverbinding van slechte kwaliteit.

– Re-engageable: Een PWA kan worden gebruikt om pushmeldingen te verzenden.

– Responsive: Je kunt het gebruiken op elk apparaat met een scherm en browser.

Voordelen van PWA’s

De voordelen van PWA’s zijn:

Betrouwbaar

Ze laden direct, of je nu een goede internetverbinding hebt of niet. Hierdoor bieden PWA’s een snelle en betrouwbare gebruikerservaring. Ze nemen ook minder opslagruimte in dan native apps.

Geen installatie vereist

Een PWA wordt niet geïnstalleerd via een app store. Je kunt ze direct openen via een URL, of toevoegen aan je startscherm. Dit maakt de gebruikservaring soepel. Doordat je ze makkelijk kunt openen, verhoogt het de retentie.

Snelle laadtijd

Door gebruik te maken van webtechnologieën zoals data caches, laden PWA’s snel. Dit helpt de gebruikerservaring en retentiepercentages te verbeteren. Ze werken ook offline of met een slechte internetverbinding.

Werkt op elk apparaat

PWA’s zijn ontworpen om voor elke gebruiker te werken, vanaf welk apparaat dan ook. Ze passen op elk schermformaat en gebruikers krijgen overal dezelfde ervaring, zelfs als ze de PWA op verschillende apparaten gebruiken.

Combineert het beste van web en app

Door de beste web- en app-functies te combineren, leveren PWA’s een betere ervaring voor gebruikers en bedrijven. Ze kunnen gebruikmaken van de functies van de browser én van het apparaat waarop ze worden gebruikt. Denk aan pushmeldingen, de camera en GPS. Daarnaast zijn ze vindbaar door zoekmachines.

Minder duur en tijdrovend om te ontwikkelen

Om een native app te ontwikkelen, moet je er vaak een bouwen voor zowel Android als Apple’s iOS. Maar met PWA’s kunnen bedrijven simpelweg één app ontwikkelen die op alle apparaten werkt. Dit verlaagt de kosten en bespaart tijd.

Automatische updates

In tegenstelling tot native apps kunnen PWA’s automatisch worden bijgewerkt. Gebruikers hoeven niet op de hoogte te worden gesteld of akkoord te gaan met een update voordat deze wordt uitgevoerd. Dit zorgt ervoor dat ze altijd de nieuwste versie gebruiken.

Pushmeldingen

Met PWA’s kun je pushmeldingen versturen. Dit kan bedrijven helpen iets op de markt te brengen of belangrijke updates rechtstreeks uit te sturen.

Verbeterde beveiliging

PWA’s gebruiken Hypertext Transfer Protocol Secure (HTTPS) om gegevens veilig op te slaan, waardoor er geen risico is op beveiligingsinbreuken of andere illegale activiteiten.

Voorbeelden van Progressive Web Applications

Veel internationale bedrijven, zoals Twitter, Clipchamp, Pinterest en Forbes, hebben opvallende resultaten gezien sinds ze PWA’s gebruiken. Andere voorbeelden van bedrijven die met PWA’s opmerkelijke resultaten boeken:

Roeckl

Het Duitse merk voor luxe accessoires — en Mollie-klant — Roeckl bestaat al sinds 1839. Vroeger gebruikten ze de traditionele point-of-sale-methoden bij de verkoop, maar al snel kwam het besef dat ze zich moesten aanpassen aan de veranderende behoeften van hun klanten. Online gaan, was dus de boodschap. Dankzij een Magento 2 PWA, is het aantal bestellingen met bijna 200% omhoog gegaan, hebben ze 150% meer gebruikers en is hun bouncepercentage met 35% verlaagd.

Flipkart

India’s grootste e-commercesite Flipkart verhoogde hun conversies met 70% nadat ze hun online aanwezigheid en native app combineerde tot een PWA. Daarnaast wisten ze hiermee de gemiddelde tijd die een gebruiker op hun site doorbracht meer dan te verdrievoudigen en leidde het gebruik van een PWA tot 40% meer engagement.

Lancôme

Om bezoekersaantallen en re-engagement te stimuleren, gebruikte het luxe cosmeticamerk Lancôme de PWA-technologie om een snelle, app-achtige ervaring op mobiele apparaten te leveren. Hiermee verhoogden ze de conversies met 17%, zagen ze een toename van 53% in mobiele sessies op iOS en een toename van 8% in conversiepercentages op het herwinnen van achtergelaten winkelwagentjes via pushmeldingen.

Een PWA ontwikkelen

De ontwikkeling van PWA-apps gebeurt met behulp van een website-toolkit, meestal HTML5, CSS, JavaScript of WebAssembly. Deze technologieën zijn beschikbaar op bijna alle platforms, wat betekent dat de code in één keer kan worden geschreven en op meerdere apparaten en software-omgevingen werkt.

Dit is een eenvoudiger proces dan het ontwikkelen van native apps, die meestal door ontwikkelaars moeten worden geschreven in ecosysteemspecifieke programmeertalen (zoals Kotlin voor Android of Objective-C voor iOS).

PWA’s in de e-commerce

PWA’s zijn de ideale tool voor elk e-commercebedrijf: Ze bieden opmerkelijke gebruikerservaringen, hoge retentiepercentages en alle functionaliteiten van een native app. PWA’s zijn over het algemeen ook goedkoper, sneller en makkelijker om te ontwikkelen dan native apps. Je hoeft bovendien geen verschillende tech stacks te gebruiken voor jouw mobiele en desktopsite — met PWA’s heb je slechts één codebasis nodig voor al jouw kanalen.

Een progressieve webapplicatie maakt het ook gemakkelijker om bezoekers bij je merk te betrekken, vooral als ze de app op hun startscherm hebben. Zo kun je namelijk pushmeldingen inzetten voor marketingberichten en updates, en een naadloze checkout bieden. Hoe verder de e-commerce evolueert, hoe belangrijker PWA’s worden voor indrukwekkende klantervaringen en groei.

Moeiteloze PWA-betalingen met Mollie

Wil je jouw klanten een naadloze checkout-ervaring bieden en alle betaalmethoden aanbieden die ze nodig hebben? Of wil je meer weten over het toevoegen van PWA-betaalmethodes? Bij Mollie bieden we een moeiteloze betaaloplossing waarmee je meerdere betaalmethoden kunt aanbieden, klanten een conversie-geoptimaliseerde checkout geeft én toegang hebt tot verschillende features en andere voordelen om betalingen te vereenvoudigen en je groei te boosten.

Met een API-first benadering is het makkelijk om met Mollie PWA-betalingen te implementeren. We bieden een plug-in voor PWA’s van Magento 2 – welke technologie je ook gebruikt voor je app. We lanceren ook een plug-in voor Shopware 6 en bieden al integraties met ScandiPWA (een frontend voor Magento 2) en commercetools. Integraties voor meer frameworks, waaronder Vue Storefront en Shopware PWA, volgen binnenkort.

Wil je jouw business laten groeien dankzij moeiteloze betalingen? Kom alles te weten over betalingen met Mollie of meld je aan om ons product te ontdekken — zonder lock-in contracten of aanmeldkosten.