Progressive Web Apps (PWA) zijn websites gebouwd met webtechnologie die zich gedragen als een app. Dat brengt diverse voordelen met zich mee. Voor bouwers is het ontwikkelen van een Progressive Web App een stuk eenvoudiger. En voor de gebruikers is de drempel tot installatie een stuk lager doordat de app ook offline beschikbaar is. Daarnaast vinden gebruikers een Progressive Web App vaak prettiger dan een mobiele website, omdat het hele scherm van een mobiel apparaat benut wordt, net als bij een gewone app.
Dat klinkt bijna zaligmakend, maar kleven er ook nadelen aan Progressive Web Apps? Veel organisaties hebben nog niet eens een AMP-compatible website en nu komt deze ontwikkeling alweer om de hoek kijken. Straks moet je website ook nog eens volledig conversational zijn.1. Maar voor het zover is, zal ik u eerst eens even uitleggen wat PWA’s zijn.
Progressive Web Apps zijn door de komst van HTML5, CSS3, vernieuwde JavaScript, betere browsers en krachtigere processoren sinds 2010 mogelijk. Het is een combinatie van diverse nieuwe technieken (vergelijkbaar met AMP). Voor de introductie van deze nieuwe technieken kon een browserervaring nooit opboksen tegen een native-app-ervaring. Nu dus wel.
Voor de komst van ‘echte’ PWA’s werd er al druk geëxperimenteerd met het combineren van technieken. Zo waren Hybride Apps bijvoorbeeld een voorloper van PWA’s: ze doen de native mobiele UX na. Dat betekent dat ze een App Store-download vereisen (en dus opslagruimte kosten). Ze runnen deels op een browser, maar hebben geen URL. Progressive Web Apps zijn daarom wezenlijk verschillend.
De term Progressive Web Apps werd in 2015 in het leven geroepen om apps te beschrijven die nieuwe features gebruiken die ondersteund worden door moderne browsers. Deze features zijn:
Progressief: ze werken voor iedere gebruiker ongeacht browserkeuze;
Responsive: ze passen/werken overal op;
Verbindingsonafhankelijk: offline en online, ook op slechte netwerken;
App-achtig: voelt als een app aan door design en navigatie;
Fresh: altijd up-to-date;
Veilig: want https;
Vindbaar met zoekmachines: herkenbaar als apps, zoekmachines kunnen ze vinden;
Re-engagable: opnieuw engageren met gebruiker makkelijker door pushnotificaties;
Installeerbaar: bewaren op homescreen;
Linkbaar: met URL; geen complexe installaties.
Door deze features doen PWA’s als een echte app aan. Ze werken dus offline, kunnen pushberichten sturen en staan op het homescreen. Net als een echte app. Voor de developers onder u: de PWA’s draaien in een secure container en zijn daarmee beschikbaar voor iedereen op het web.
Service workers
Service workers zijn de drijvende kracht achter Progressive Web Apps. Ze zorgen ervoor dat de apps offline werken door te fungeren als een soort proxy. Opdrachten als ‘fetch’ worden uitgevoerd (getriggerd) via een vooraf vastgesteld event zoals online gaan. Ze geven bijvoorbeeld pushnotificaties, updaten content op de achtergrond, cachen en nog veel meer. Op het hoogste niveau is een service worker een script dat op de achtergrond werkt. Onafhankelijk van de app.
Developers kunnen boilerplates (van tevoren gebouwde blokken code met een specifieke functie) gebruiken om de ontwikkeling te versnellen en optimale performance te leveren. Een mooi voorbeeld van een boilerplate is de offline modus.
Waarom een Progressive Web App laten bouwen?
Er zijn heel wat goede redenen om als ondernemer een Progressive Web App te overwegen:
Meer engagement dan een website: de PWA kan pushnotificaties versturen en content tonen, ongeacht de netwerkstatus;
Relatief makkelijk in development: sneller live tegen lagere kosten en makkelijker onderhoud (technische erfenis);
Maakt gebruik van een groot aanbod aan plug-ins en een grote community voor ondersteuning;
API hoeft niet backwards compatible te zijn. Alle gebruikers draaien immers op dezelfde versie;
Makkelijk voor de gebruiker. Zodra ze PWA hebben gevonden kunnen ze meteen aan de slag. Ze hoeven niet eerst naar de App Store of de Google Play Store;
Ze zijn mooi/goed genoeg om op het homescreen te staan;
In theorie werken alle bovenstaande punten conversieverhogend.
SDIM wil dit alles wel nuanceren: evalueer goed of een Progressive Web App past bij je doelgroep en doelen. Een PWA is niet altijd een goede keuze. Stel dat gebruikers ook offline toegang moeten hebben tot bepaalde informatie zoals tickets, dan kan een PWA de voorkeur boven enkel een website krijgen. Maar als je website al sterk op een app lijkt, dan zal de overstap naar een PWA de gebruikerservaring alleen maar beter maken.
Voorbeelden van Progressive Web Apps
Als je de onderstaande links opent in je Chrome browser krijg je alvast een beeld van de werking:
Wanneer krijgt een PWA de voorkeur boven een native app?
Wanneer een kritische functie niet in te bouwen is door issues met crossbrowsercompatibiliteit, dan kan alleen een echte app voorzien in een gelijkmatige gebruikerservaring voor alle gebruikers. Daarbuiten krijgt een PWA altijd de voorkeur boven een traditionele app. Een PWA is namelijk makkelijker om te ontwikkelen en te onderhouden. Het is nog te vroeg om te stellen dat het de auto ten opzichte van een paard-en-wagen is, maar het lijkt er sterk op dat het mobiele web deze kant opgaat.
Progressive Web Apps iOS
Op het moment van schrijven werken Progressive Web Apps nog niet op iOS. Daarnaast worden PWA’s nog niet geïndexeerd door zoekmachines (AMP-pagina’s wel!). De apps vereisen een directe link om gevonden te worden. Bovendien is het nog niet mogelijk om advertenties in een PWA te tonen, maar men verwacht dat deze functionaliteit er wel gaat komen. PWA’s werken wel op Android en Chrome 50, maar ze worden nog niet ondersteund door andere grote browsers. Oefenen met bouwen kan al wel: Google Codelab voor Progressive Web Apps.
Op het moment van schrijven werken Progressive Web Apps nog niet op iOS. Daarnaast worden PWA’s nog niet geïndexeerd door zoekmachines (AMP pagina’s wel!). De apps vereisen een directe link om gevonden te worden. Daarnaast is het nog onmogelijk om advertenties te tonen. Een functionaliteit die wel verwacht wordt te gaan komen.
Hoe nu verder?
SDIM wil je adviseren om deze blogpost vanmiddag nog door te sturen naar je developer. Stel daarna een Google Alerts in over dit onderwerp, blijf de blogomgeving van SDIM in de gaten houden en volg ons op social media voor updates. Verder hoef je nog even niets te doen. Heb je in de tussentijd vragen over Progressive Web Apps? Neem dan contact op met de specialisten van SDIM.
1: een conversational website is een website die een “gesprek” kan aangaan met een gebruiker die informatie zoekt via een digital assistant. Bijvoorbeeld Google Home of Facebook Jarvis. Houd ons blog in de gaten voor een update over dit onderwerp.
Bart Wagener is sinds 2010 werkzaam in online marketing. In diverse rollen heeft hij ervaring opgedaan als (SEO) copywriter, webdeveloper, social media analist en algemene online marketeer.
Reacties (0)