Lav en Progressive Web App med WordPress

En Progressive Web App (PWA) er en hjemmeside designet til at fungere som en app. I denne artikel forklarer vi, hvordan du kan skabe en Progressive Web App med din WordPress-hjemmeside på få minutter.  

Hvad er en Progressive Web App? (PWA) 

En progressiv web app, ofte forkortet til PWA, er en hjemmeside, der er skabt til at se ud og opføre sig som en app. Den kan vises som et app-ikon på brugeres smartphones, tablets og computere. En PWA kan også fungere offline, sende notifikationer til brugere og køre på alle moderne platforme. 

Opret en PWA

Du kan omdanne enhver hjemmeside til en Progressive Web App. Det er som regel ingen sag for en webudvikler, og det er faktisk også ganske enkelt, selvom du ikke ved noget om webudvikling. Følg med videre nedenfor, så viser vi dig, hvordan du skaber din egen PWA med WordPress. 

Lav en Progressive Web App med WordPress

For at oprette en Progressive Web App i WordPress kræves der et plugin. Vi har prøvet flere plugins og valgt vores favorit, men du kan selvfølgelig selv finde andre plugins ved at søge på “PWA” i WordPress. 

Sådan opretter du en PWA med WordPress: 

1. Log ind på WordPress 

2. Hold markøren over Plugins i venstre menu, og klik på Tilføj nyt plugin 

3. Søg efter PWA 

4. Installer Super Progressive Web Apps 

5. Klik på Aktivér 

Så enkelt er det! Din hjemmeside er nu en Progressive Web App! Hvis du besøger din hjemmeside på en telefon eller computer, vil browseren spørge, om du vil installere siden som en app. 

Du kan tilpasse din PWA i indstillingerne for Super Progressive Web Apps, som findes i venstre værktøjslinje. Her kan du ændre logoet på din app, redigere beskrivelsen og navnet, justere baggrundsfarven på indlæsningsskærmen og meget mere. Der er også yderligere tilpasningsmuligheder, som aktiverer PWA til flersprogede hjemmesider, og hurtig oprettelse af versioner af appen til Google Play Store. Disse funktioner indebærer dog et ekstra gebyr og er en del af PRO-versionen af pluginnet. 

Husk, at alle plugins, du installerer på din WordPress-hjemmeside, skal opdateres jævnligt for at sikre optimal sikkerhed. Vi anbefaler derfor, at du aktiverer automatiske opdateringer. Risikoen ved automatiske opdateringer er, at en opdatering kan ændre din hjemmeside på en måde, du ikke har tænkt dig. Med Managed WordPress fra one.com overvåges alle automatiske opdateringer for at sikre, at din hjemmeside altid fungerer perfekt. Vi udfører et visuelt tjek af din hjemmeside før og efter hver automatisk opdatering for at sikre, at ingen opdateringer skaber problemer på din side.

Andre metoder

Det er muligt at oprette en Progressive Web App til enhver hjemmeside. Vi gennemgår ikke alle dele af processen i denne artikel, men kort fortalt skal du gøre to ting for at oprette en PWA: 

1. Opret et Web App Manifest, der indeholder din hjemmesides navn, app-ikon, farve og visningsformat. 

2. Opret en Service Worker, som fungerer som broen mellem brugerens enhed og din hjemmeside. Det er Service Worker, der forvandler din hjemmeside til en PWA.  

Hvis du vil lære mere og komme i gang med at lave en Progressive Web App, kan du læse en omfattende guide på web.dev. 

Fordelene ved en WPA

Mange af verdens mest populære online-tjenester bruger Progressive Web App-teknologi. Listen af eksempler inkluderer bl.a. Spotify, Facebook, Tinder, Google, X, Uber og Starbucks. Der er flere gode grunde til at oprette en WPA. Her er nogle af de vigtigste fordele ved at oprette en Progressive Web App: 

En WPA opleves som en mobil-app 

Den største fordel ved en Progressive Web App er, at den giver en hjemmeside den samme brugeroplevelse som en mobil-app. En app er hurtig, den kan sende notifikationer, fungerer offline og kan bo sammen med andre mobil-apps på dine brugeres enheder. Her er nogle af de vigtigste fordele ved at have en hjemmeside, der fungerer som en app

App-ikon på startskærmen

Når du har oprettet en PWA, kan nye besøgende på din hjemmeside downloade den som en app. Efter installationen, tilføjes appen til brugerens enhed. Derefter kan den vises på startskærmen på en iPhone- og Android-telefon og tilføjes til docken på en Mac, samt til proceslinjen på en Windows-computer. 

Dit app-ikon kan fungere som en reklamesøjle for din hjemmeside. Da Alibaba lavede en Progressive Web App til deres webshop, oplevede de, at besøgende der tilføjede appen til deres startskærm, vendte tilbage fire gange så ofte som andre besøgende. Noget så simpelt som et app-ikon kan således medvirke til, at mange af dine brugere bliver loyale besøgende eller tilbagevendende kunder.  

Brugere, der har en computer fra en organisation, såsom en virksomhed eller skole, har ofte mulighed for at installere en PWA, selv når installation af andre apps ikke tillades af enheden. Det betyder, at du med en Progressive Web App kan nå ud til en målgruppe, som almindelige apps har sværere ved at nå

App i separat vindue

En almindelig hjemmeside vises i en browser-fane. Fordi en Progressive Web App fungerer som en app, får den sit eget vindue på en computer. Brugeren vil desuden opleve den som en helt almindelig app. Brugere kan lukke deres browser, uden at lukke en Progressive Web App. De kan også skifte mellem apps, uden at opleve nogen forskel på en almindelig app og en Progressive Web App. 

Vises i Apple App Store og Google Play Store

Når du har oprettet en Progressive Web App, kan du tilføje den som en app til Google Play Store og Apple App Store. Dette medvirker til, at din app opleves som professionel og opdages af mange nye brugere. En stor fordel ved tilstedeværelse i populære app-butikker er, at du giver dine brugere friheden til at downloade din hjemmeside som en app. Desuden vil mange brugere føle sig mere trygge, når de downloader din PWA fra deres foretrukne app-butik.  

Én app til alle platforme 

Når du opretter en Progressive Web App åbner du en portal til din hjemmeside. Denne portal er bygget efter en standard, der er kompatibel med alle moderne platforme. På samme måde som du kan oprette en hjemmeside, der fungerer på alle enheder, kan du oprette en Progressive Web App, der virker for alle. Du kan opdatere indholdet i apps på alle enheder, blot ved at ændre din hjemmeside. Opdateringerne sendes automatisk til alle brugere — de behøver ikke engang at opdatere appen. 

Indlæses hurtigt

Første gang en besøgende downloader en PWA, gemmes appen på enheden. Det betyder, at den kan indlæses hurtigt, næste gang den åbnes. Det kan i mange tilfælde indebære, at en Progressive Web App indlæses hurtigere end en hjemmeside. Det samme gælder for hvert klik i appen. For hver ny side, der åbnes, kan enheden, ved hjælp af lokale resurser, gøre indlæsningstiderne kortere. 

Offlinetilstand

En Progressive Web App kan oprettes til at være tilgængelig offline. Det betyder, at de vigtigste funktioner altid er tilgængelige, og at de kan indlæses hurtigt, selv når brugerens internetforbindelse er langsom. Det betyder også, at din bruger altid kan stole på de vigtigste funktioner i din app. Du kan fx have en funktion, der viser event-bookinger. Fordi din WPA fungerer i offline tilstand, vil brugeren kunne se bookingerne, selvom internetforbindelsen er langsom, der hvor eventet finder sted. 

Send notifikationer

Med en Progressive Web App kan du også sende meddelelser til dine brugere. Du kan fx holde dem opdateret om nyheder i din app, eller sende personlige beskeder til dem. Notifikationer kan gøre det mere attraktivt at bruge ​​din app og skabe større engagement. 

Billigere end at udvikle en almindelig app

Det er meget billigere at lave en Progressive Web App end at lave almindelige apps til iOS og Android. Hvis du allerede har en god hjemmeside, vil det ikke koste dig ret meget at lave en Progressive Web App. Selvom du har store ambitioner med din app og ønsker at skabe en app med mange funktioner, kan det være en god idé at overveje en Progressive Web App som en billigere løsning 

Øget trafik og konvertering

Mange store techvirksomheder bruger Progressive Web App-teknologi. Det er der en god grund til. En god brugeroplevelse skaber nemlig gunstige forudsætninger for mere trafik og bedre konverteringer. Alibaba har rapporteret en stigning på 76 procent i konvertering takket være deres WPA. Softwarevirksomheden Corel oplevede en stigning på 31 procent i antallet af tilbagevendende brugere efter lanceringen af deres WPA.  

Ulemper ved Progressive Web Apps

Naturligvis er der, som med så meget andet, også ulemper ved at lave en Progressive Web App, især sammenlignet med mere traditionelle apps skabt til iOS og Android. 

Fungerer ikke på ældre enheder

Progressive Web Apps er en relativt ny teknologi. Derfor er muligheden for at bruge dem ikke tilgængelig på alle enheder. For Apple iOS har der været support siden iOS 14. Det betyder, at iPhones fra 2014 eller tidligere ikke understøtter PWA. Det samme gælder med Windows, hvor support mangler i Windows 8 og tidligere versioner af Windows. Mange enheder, der ikke er kompatible, er således mere end ti år gamle. Det er derfor vigtigt at have i baghovedet, at en Progressive Web App ikke virker for alle brugere.  

Begrænset funktionalitet

Sammenlignet med en almindelig app, har en PWA ofte en mere begrænset funktionalitet. Der kan fx være begrænsninger, der forhindrer en PWA i at fungerer med stemmeassistenter. Nogle operativsystemer har også fastsat relativt lave grænser for, hvor meget en Progressive Web App må fylde på en telefon, almindeligvis 50 MB. Dette kan gøre det besværligt at omdanne meget store hjemmesider til Progressive Web Apps . 

Langsommere end almindelige apps

Fordi en Progressive Web App dybest set er en hjemmeside forklædt som en app, er den ikke bygget på samme måde som en almindelig app. En konsekvens af det er, at en Progressive Web App ofte reagerer langsommere på klik end en almindelig app. Selvom en PWA ofte kan være betydeligt hurtigere end en hjemmeside, vil en almindelig app alligevel altid være hurtigere end en PWA. 

Skal jeg lave en WPA?

Har du en hjemmeside, som dine besøgende gerne vil bruge som app? Er din hjemmeside lavet med WordPress? Så kan du oprette en PWA i dag! Det er nemt og kan give både dig og dine besøgende store fordele. En Progressive Web App kan øge trafikken til din hjemmeside, booste dine konverteringer, og lade dig kommunikere effektivt med dine besøgende og kunder. 

Hvis du ikke har en WordPress hjemmeside, vil en PWA stadig have værdi, men det kan være sværere at få den til at fungere godt. Du kan finde mere information online, men vær opmærksom på, at det kan kræve, at du søger hjælp hos en webudvikler. 

Vi håber, at denne artikel har gjort dig klogere på Progressive Web Apps, og hjulpet dig med at komme i gang med at oprette din egen WPA.  

Hvis du ikke allerede har en WordPress-side, kan du oprette en lige her.