Progressive Web Apps: wanneer een slimme keuze?

Een Progressive Web App (PWA) als nieuwe optie voor het bouwen van je webshop, we horen er steeds meer over als een gunstig alternatief voor een native app of een responsive site. Hoewel de technologie nog volop in ontwikkeling is, zijn de voordelen inmiddels duidelijk. En dat zijn er heel wat! Voor je bezoekers en dus ook voor jou als webshophouder. Met betrekking tot de gebruikerservaring en conversiepercentage bijvoorbeeld.

Benieuwd of Progressive Web App je e-commerce systeem of je native app kan vervangen? En van welke voordelen je dan profiteert? Lees dan snel verder!

Progressive Web Apps (PWA) zijn websites die zich gedragen als apps. Een PWA kan gebruikmaken van de native functionaliteiten van een mobiel apparaat, zoals camera, microfoon, en GPS. Een gebruiker ervaart de website daarom als een app, maar dus via de browser. Een groot voordeel van deze apps is: snelheid. Dit komt doordat de functionaliteit van de PWA en de content onafhankelijk van elkaar geladen worden. Alle data wordt progressief bij gebruik van de app ingeladen. Dit zorgt voor een super snelle laadtijd, zelfs met een slechte internetverbinding. Je kunt je dus wel voorstellen welke positieve effecten deze ultieme snelheid heeft op de gebruikerservaring van je bezoekers. Maar naast snelheid brengt het nog veel meer voordelen met zich mee.

Voordeliger en makkelijker te ontwikkelen

Omdat PWA’s ontwikkeld worden met standaard webtechnieken, zijn ze relatief goedkoop om te implementeren en te onderhouden. Je hebt eigenlijk een webshop en app in één. Dat zou afzonderlijk vele malen duurder zijn geweest, aangezien ze dan allemaal in losse systemen ontwikkeld moeten worden (website + iOS app + Android app). Developers hoeven voor een PWA dus ook maar één standaard programmeertaal te beheersen. En bovendien ben je niet meer afhankelijk van de voorwaarden van de app stores. De ontwikkeling is makkelijker, maar ook bespaar je veel tijd (en dus geld!). Want alle content kan in slechts één systeem beheerd worden.

Meer gemak voor de gebruiker

Er is geen (betaalde) app download nodig. Gebruikers hoeven voor een PWA dus niks te installeren of updates door te voeren. Ze hoeven alleen maar te surfen naar een website. Dit scheelt opslagruimte op het apparaat van de gebruiker, want een PWA wordt op het web gehost. Nieuwe versies en bugfixes worden door developers doorgevoerd, zonder dat een gebruiker er iets van merkt of voor hoeft te doen. Een PWA is dus voor gebruikers altijd up-to-date. Je kan het gemak nog verder vergroten door gebruikers via een pop-up te activeren om de PWA toe te voegen aan het startscherm van hun smartphone. Dan wordt er eenzelfde soort icoontje als bij een app aangemaakt. En lijkt het alsof de gebruiker van een echte app gebruik maakt. De url is in dat geval ook niet meer in beeld.

Ook offline beschikbaar

Nog een groot voordeel: gebruikers kunnen zelfs je PWA bezoeken als er geen internet beschikbaar is! Doordat developers zelf kunnen kiezen welke elementen uit je shop beschikbaar moeten zijn voor offline gebruik. Dit kan door gebruik van de service worker. Dat is een script (javascript) dat op de achtergrond draait zonder dat de gebruiker de PWA gebruikt. Met de service worker ben je in staat bepaalde functionaliteiten van het apparaat te gebruiken, zoals push notificaties en background synchronisatie.

Meer marketingmogelijkheden (meer engagement!)

Bij een PWA kun je de native functionaliteit voor het verzenden van push notificaties benutten voor een hoger engagement met gebruikers. Ze zijn zo dus altijd te bereiken, zelfs als ze je shop niet gebruiken. Dit verhoogt traffic, maar hiermee stimuleer je ze ook om langer op de site te blijven hangen, en yes: dat verhoogt eveneens de kans op conversie. Een PWA kan makkelijk gedeeld worden via een normale url-structuur. En zoals eerder benadrukt: liefhebbers van je shop kunnen de PWA ook installeren op het startscherm van hun mobiele apparaat.

Een SEO booster

Doordat een PWA dus feitelijk een website is, wordt deze gewoon geïndexeerd door Google. In tegenstelling tot een native app. En dat biedt dus voordelen voor je vindbaarheid. Een PWA is, net als een mobile website overigens, goed te optimaliseren voor SEO. Daarnaast spelen snelheid en veiligheid een belangrijke rol, maar daarvoor zit je goed bij een PWA. Er wordt minder data gebruikt dus is de snelheid gewaarborgd. En met de toepassing van een https verbinding is ook de veiligheid zeker gesteld. Ook de toegenomen gebruiksvriendelijkheid op mobiel die ontstaat met een PWA, wordt door Google gewaardeerd en kan je positie flink boosten!

Hoewel er veel meer voordelen zijn dan nadelen, is het altijd goed om kritisch te kijken waar je rekening mee moet houden. De belangrijkste nadelen:

Niet alle functies van mobiel apparaat zijn te gebruiken

Je kunt niet van alle mobiele telefoon functionaliteiten gebruikmaken. Een PWA kun je bijvoorbeeld nog niet koppelen met de draadloze ‘Near Field Communication (NFC) communicatiemethode’. Ook toegang krijgen tot de kalender en de contactenlijst van de gebruiker is nog niet mogelijk bij PWA’s. Daarnaast kun je in chrome een PWA al koppelen met Bluetooth maar bijvoorbeeld in FireFox en Safari nog niet. Het hangt van je platform en browser af welke functionaliteiten van het apparaat gebruikt kunnen worden.

Tegenwerking in de App Stores

Tegenwoordig is het mogelijk om je PWA's in te dienen bij de Apple en Android App Stores. Hiermee maak je de ervaring voor de gebruiker nog meer zoals een native app. Echter is met name Apple af en toe wat huiverig op Progressive Web Apps op hun platform. PWA's die volledig identiek zijn aan mobiele website worden mogelijk uit de App Store verwijderd, dus zorg dat je PWA iets unieks te bieden heeft om dit te vermijden. Meer weten over hoe jij je Progressive Web App kun aanbieden via de App Stores? In deze blog leggen we je er alles over uit.

1. Is een bestaande (Magento 2) webshop om te zetten naar een PWA?

Ja, dat is zeker mogelijk. Het is uiteraard wel afhankelijk van de functionaliteiten die je wilt gebruiken. De meeste tijd gaat zitten in de uitbreidingen van je PWA met native features van het mobiele apparaat. Dus welke native features je wilt gebruiken en de complexiteit van je bestaande website, bepalen de omvang van het omzetten van je bestaande shop naar een PWA. Als je wilt dat de webshop ook offline gaat werken, vraagt dit meer tijd.

Een PWA ontwikkelen betekent frontend loskoppelen van de backend. Een uitdaging nog wel, zeker bij een complexe Magento 2 shop. Maar met de aankondiging van Magento PWA studio biedt Magento de oplossing. Dit is een toolset om een PWA mee te bouwen. Het koppelt de storefront los van de Magento backend. Via de Magento API communiceer je dan met de backend van je Magento shop. Zo is het dus mogelijk om een zelfgemaakte storefront toe te voegen. Je bent bovendien niet meer gebonden aan PHP. De PWA Studio maakt deel uit van Magento 2.3.

2. Ik twijfel tussen een PWA en een native app, wat is het beste advies?

Een PWA is een verrijking van de mogelijkheden op het web, maar zal een native app voorlopig niet vervangen. Qua functioneren concurreren PWA’s pas met native apps als ze ook alle mogelijkheden van een mobiel apparaat krijgen. Maar dat is nu nog niet het geval. Het beste advies is afhankelijk van je doelstelling. Waarom wil je een app? Wat moet deze app kunnen? En wat is de toegevoegde waarde? Dit laatste is essentieel, zeker bij een native app. Aangezien je doelgroep hiervoor een handeling moet verrichten: het downloaden van de app. Dat is vaak best wel een drempel. Een PWA is een laagdrempeliger alternatief. Denk dus ook aan je doelgroep.

Verder is het goed om stil te staan bij de uitstraling van je oplossing. Indien de app dezelfde beleving, look and feel dient te hebben en vooral een aanvulling moet zijn op je huidige website, is een PWA een goede oplossing. Als alle functionaliteiten die je in je app wilt ook te realiseren zijn via een PWA, is dit zeker het overwegen waard. En daarmee profiteer je van de eerder genoemde voordelen. Maar wanneer je app een totaal andere beleving moet creëren of wanneer je native functionaliteiten van een mobiel apparaat wilt inzetten die niet door alle browsers ondersteund worden, blijft de native app voor nu de beste keuze! De app is dan iets totaal anders dan je website.

Het is van belang om te beseffen dat we ons nog altijd in de (door)ontwikkelingsfase bevinden, wat betreft PWA’s. Nog niet alle functionaliteiten van de telefoon worden al ondersteund door browsers en het is nog onduidelijk welke verdere gebruiksfuncties in de toekomst ondersteund gaan worden. Op dit moment is Google in de lead, waardoor het in eerste instantie allemaal erg Android gerelateerd is. Apple blijft gelukkig niet achter, na lang wachten werd de ondersteuning van PWA’s in de 11.3 iOS-update officieel uitgebreid. En dat betekent dat ze makkelijker en in grotere aantallen geïmplementeerd kunnen gaan worden.

Als de technologie dus zover is, dat meer native functionaliteit gebruikt kan worden in PWA’s en de de activatie met een druk op de knop te realiseren is, zal het hard gaan. Dus be ready voor als het zover is!