naar Kennisbank

Hoe handig is een website die zich gedraagt als app?

Blog
19 maart 2019
Graphic One Graphic Two

Je opent hem als app via het startscherm van je telefoon, ontvangt push-berichten, kunt hem zowel online als offline gebruiken én je kunt hem optimaliseren voor zoekmachines. Een Progressive Web App (PWA) biedt het beste uit de twee werelden van websites en apps; een geavanceerde website die functioneert als een app. Geen gloednieuwe techniek, wel eentje waarvan nog niet iedereen weet dat het bestaat of wat ermee kan. In dit artikel vertel ik je meer over:

De voordelen van een Progressive Web App (PWA)

Een PWA is zoals gezegd een website die zich gedraagt als een mobiele app. De grootste voordelen:

  1. Icoontje op het startscherm
    Een PWA start je vanaf je browser (zoals je een website bezoekt) maar net als bij mobiele apps kun je een icoontje installeren op het startscherm van je telefoon (via een pop-up die daarom vraagt). Maar, je hoeft er niet speciaal voor naar een App Store om hem te downloaden. Hij kan ook nog eens push-berichten tonen en heeft toegang tot je telefoon voor gebruik van GPS, microfoon en camera. 
  2. Gebruik zonder internetverbinding mogelijk
    Doordat er een database aan een PWA gekoppeld is, kun je bestanden tijdelijk opslaan op je telefoon, zodat je de app ook kunt gebruiken als je geen internetverbinding hebt. Zodra er weer verbinding is zal de data direct verzonden worden.
  3. Progressief
    PWA's zijn niet afhankelijk van een besturingssysteem (zoals Android of iOS) of browser, maar werken voor iedere gebruiker. Je hoeft hem dus niet platform specifiek te laten ontwikkelen en te updaten (zoals bij een Native App wel het geval is), dit scheelt veel ontwikkeltijd.
  4. Bespaart opslagruimte op de telefoon
    Je hoeft een Progressive Web App niet te downloaden vanuit een App- of Play Store. Je bespaart zo data en opslagruimte op je telefoon en zorgt dat de PWA altijd up-to-date is. Daarbij behoud je de snelheid van een Native App en kun je hem qua design volledig geschikt maken voor mobiel gebruik. 
  5. SEO & CMS mogelijkheden
    Doordat een PWA ook stiekem een website is, biedt het ook de optimalisatiemogelijkheden, waardoor je in Google beter gevonden wordt. Verder kun je hem gewoon onderhouden via een CMS-systeem, je kunt URL's delen  én er kunnen koppelingen gemaakt worden met interne- en externe systemen.


Ok, één nadeel:

Google en Microsoft ondersteunen de technologie achter Progressive Web Apps, maar Apple loopt nog wat achter met als resultaat dat PWA's nog niet optimaal op iOS werken.

PWA: de techniek in het kort

Om een website weer te kunnen geven als app wordt gebruikt gemaakt van een 'application shell architecture', een combinatie van HTML, CSS en Javascript die de interface vormt. De 'motor' van de PWA is de service worker. Deze laadt en cached de content, zodat je deze ook kunt laden als je geen internetverbinding hebt. Op het moment dat er weer internetverbinding is, zorgt de service worker ervoor dat nieuwe data op de achtergrond gesynchroniseerd wordt. 

Ook heeft de service worker toegang tot de hardware van je smartphone, zodat je functionaliteiten als camera, locatie of push-notificaties kunt gebruiken.

Voor welke toepassingen is een PWA geschikt?

Je kunt Progressive Web Apps inzetten voor toepassingen waarmee je offline wilt kunnen werken en/of de functies van een smartphone wilt gebruiken, maar... tegelijkertijd ook de mogelijkheden van een CMS en SEO wilt benutten. Een PWA wordt veelal toegepast voor:

  • Nieuws- en mediaplatformen zoals NOS, Twitter of Reddit
  • Platformen met real-time data, zoals track & trace, het weer of openbaar vervoer
  • Websites die veel veranderen qua content, lay-out en functionaliteit

We hebben inmiddels ervaring met de realisatie van verschillende Progressive Web Apps. Ben je benieuwd of een PWA iets is voor jouw business? Neem vrijblijvend contact met mij op. Ik denk graag met je mee!

Een artikel door:
Jeffrey
Projectmanager