PWA – Progressive Web Apps

PWA er en forkortelse for Progressive Web Apps. PWA’en viser websitet som en app. Det vil sige at dit website virker lynhurtig og fungerer også offline.Når en bruger besøger en websitet vil et script kaldet ‘Service Worker’ indlæses. ‘Service Workeren’ går ind og gør at websitet kan benytte de samme funktioner som en app. Dvs. at websitet kan gøre brug af nogle af de funktioner, som findes på enheden og via diverse API kald, gør brug af funktioner fra andre applikationerne på enheden.

Føles som en native app

PWA føles fuldstændig som en native app. Dette skyldes at PWA ligesom native apps, kan gøre brug af enhedens funktioner og styrker. PWA kan samarbejde med andre apps på enheden via API kald, hvorfor det giver et utal af muligheder for at udvikle sin PWA.
Et eksempel kunne være Google Pay, hvor man lynhurtig kan lade sine kunder købe direkte via Google Pay. De slipper derfor for at indtaste betalingsinformationer ind, som kan være en forhindring for et køb.

Få dine kunder til at komme igen og igen

PWA minder på mange måder om native apps, som man tilmed også kan downloades via App Store og Google Play. Det smarte ved PWA er dog at man kan pushe download-funktionen til sine brugere, så de nemt kan installere apllikationen når websitet besøges. Tilføjer en kunde PWA’en til startskærmen på sin enhed, skabes et tilhørsforhold til appen og websitet. En kunde har derfor større tilbøjelighed for at komme tilbage til websitet og foretage et køb en anden gang.

Via push notifikationer, kan PWA’en gøre sin brugere opmærksom på tilbud fra hjemmesiden, det er derfor muligt hele tiden at nå sine kunder, også selvom de ikke nødvendigvis er på nettet for at finde tilbud.

Retainment af sine kunde er en stor faktor i forhold til PWA’s.

Virker upåklageligt offline og på ustabilt internet

Et script som bliver kaldt Service Worker opdaterer websitet når enheden har internet. Mister brugeren sin internetforbindelse imens der eksempelvis foretages et køb på en webshop, vil Service Workeren gemme købsanmodningen i sin database og foretage købet når internetforbindelse igen er etableret. På denne måde vil brugeren ikke opdage at have mistet sin internetforbindelse eller have problemer med sit køb. Dette gør PWA utrolig stabilt, eftersom man ikke mister salg i sin webshop pga. af dårlige internetforbindelser. Det giver også brugerne en positivt oplevelse af websitet, hvilket vil få dem til at vende tilbage til websitet.

Folk downloader ikke apps fra hvilket som helst website

Det er slut med de dage, hvor folk fylder deres smartphones med applikationer fra ethvert site. For hvert skridt en bruger skal tage for at installere en applikation falder antallet af gennemførte downloads med ca. 20%. En PWA reducerer antallet af skridt, man som bruger skal tage for at installere appen. Med et enkelt tryk på “Tilføj til startskærm” er app’en installeret og klar til brug. Der er derfor en langt større succesrate for at få brugere til at installere sin applikation når det er en PWA.

Hvorfor bør man overveje PWA?

Tilgængelighed: Det er ingen nyhed at antallet af mobile brugere på internettet er stærkt stigende. Allerede i 2017 var 63% af trafikken til websites fra mobile enheder. Vi befinder os i en verden, hvor man er på internettet på samme tid som vi er på farten. Det skal være nemt, hurtigt og trygt for brugerne at besøge og navigere på ens website for at få success. Dette gør PWA ekstrem relevant for alle med et website.

Anskaffelse: Det er meget nemmere for brugerne at anskaffe sig en PWA i forhold til en native app. PWA er tilgængelig til download, så snart at brugeren besøger websitet, hvor native apps skal downloades fra app store eller Google Play. Det kræver altså at brugeren ved, hvad han søger efter, hvilket gør det noget svære at få brugeren til at hente appen, i forhold til at smide en notifikation til brugeren når han besøger websitet.

Konverteringer: De fri tøjler til at lave UX ved checkout selv ved dårlig forbindelse, gør at PWA resulterer i et højere antal gennemførte konverteringer. Ved at benytte diverse API’s fra andre apps kan man eksempelvis lave one-click checkouts, så kunderne ikke skal igennem et unødvendigt antal forms for at kunne købe.

PWA og SEO

PWA bliver af Google set som JavaScript sites. Google har gennem historien haft sine udfordringer med JavaScript, men bliver bedre til at crawle og indeksere JavaScript indhold dag for dag. Når man har med PWA og JavaScript sites at gøre er der dog helt unikke udfordringer som man bliver nødt til at have for øje når PWA udvikles, så man ikke står med en PWA som ikke kan crawles optimalt.

URL struktur

En URL fungere ligesom en adresse for indholdet på en hjemmeside. Det er vigtigt at Google har en tydelige URL at gå efter, ellers kan der opstå problemer med at indeksere den i søgeresultaterne. Mange JavaScript sites og PWA benytter hash-fragments (#) i sine URL’er. Disse hash-fragments er ikke nogle Google indekserer, hvilket vil sige at hvis du har dynamisk indhold som skifter på baggrund af et hash-fragment, vil dette ikke blive crawlet og indekseret.

Undgå derfor at benytte hash-fragments, og gå i stedet med en traditionel ren URL uden fragmenter og webparameter, så sikrer man sig at Google kan læse og forstå sine URL’er.

Desktop brugere

Redirect dine desktop bruger til desktop versionen / non-PWA website. PWA er til for dine mobile besøgende. PWA fungerer, pt ikke optimalt for desktop brugere, eftersom applikationerne benytter features fra mobile-enheder og tablets. Hvis du ikke har en desktop/non-PWA website bør du blot sikre dig at der ikke er nødvendige features fra mobilversionen, som fejler på desktop.

Duplikeret indhold og canonical tag

Har man en PWA og et non-PWA site, kan man hurtigt komme ud for duplikeret indhold. Ved hjælp af et canonical tag til non-PWA websitet, kommer man dog nemt dette til livs. Canonical tagget videregiver værdien fra PWA til det normale website, så evt. links og autoritet som bliver generet indtil PWA bliver sendt videre til non-PWA websitet.

Ovenstående elementer er specifikke i forhold til PWA, skal et website performe godt i søgeresultaterne er hele SEO kammen ind over.

Ønsker du at vide mere om Google evne til at læse og indeksere så læs om JavaScript-frameworks og Google her.

The Sweetspot: PWA & AMP

Ved at benytte både PWA og AMP på site website, får man det bedste fra begge verdener og fjerne ulemperne ved begge. Dette gør det til det ultimative UX setup for dit website.

Opsummering

Med PWA kan du tilbyde dine besøgende en oplevelse af at være i en app, når de besøger dit webiste. Du kan nemt tilbyde dine kunder at downloade din web app.
PWA’en fungerer lynhurtig og offline, hvilket giver alle dine brugere, selv dem med dårlig internetforbindelse, en upåklagelig hastighed og brugeroplevelse. Brug API’er fra andre apps til skabe et problemfrit købsflow for dine besøgende. PWA får dine kunder til at komme igen og igen, da de kan tilgå din webshop direkte fra deres startskærm på mobilen.

 

Skriv et svar

Din e-mailadresse vil ikke blive publiceret. Krævede felter er markeret med *