Du har utan tvekan hört talas om den kommande vågen på mobilnätet. Det vanligaste du säkert har hört är att mobilnätåtkomst ökar snabbt och ungefär hälften av all webbtrafik går nu via telefon eller surfplatta. A Februari 2018-rapport från Pew Research Center Observera att 95% av alla amerikaner äger en mobiltelefon, medan andelen amerikaner med smartphones är 77%.

Du behöver inte leta långt för att se effekten av mobilen. Titta på ditt eget och din familjs beteende. I december 2016 comScore rapporterade att den genomsnittliga amerikanen över 17 tillbringade två timmar och 51 minuter om dagen på sin telefon (Englais).

Statcounter.com konstaterar att den globala webbtrafiken främst kommer från mobila enheter i minst ett år (51,95% i februari 2018).

Även om du kanske tror att du inte har råd att utveckla en inbyggd app för dina mobilanvändare att lagra på sina telefoner, finns det ett fantastiskt alternativ tillgängligt för alla företag: Progressiva webbapplikationer. Du kanske har hört talas om Progressive Web Applications (PWA) och hur människor använder dem för att växa sina affärer. I den här artikeln kommer du att lära dig lite mer om PWA och varför du bör tänka mer på deras användning 2018.

Några definitioner

Progressive Web Applications (PWA) är en samling webbstandarder som ursprungligen utvecklats av Google för att förbättra webbplatsens prestanda på mobila enheter. Därför fungerar webbplatser mer som dedikerade mobilappar som du hittar i Apple App Store eller Google Play.

annan definition utvecklare för den indiska hotellkedjan Treebo: "PWA är ensidiga applikationer som förbättras stegvis med funktioner som ger en mer uppslukande inbyggd upplevelse. »

Genom att skära ner det lite låter PWA på mobila enheter dina läsare och kunder snabbt ladda webbplatsens hemsida och använda många av samma funktioner på den mobila enheten som en inbyggd app skulle använda. Din webbplats kan finnas utanför webbläsaren, även om enheten inte är ansluten till Internet.

Andra definitioner

Några av de viktigaste tekniska delarna av en PWA inkluderar:

Tjänster Arbetare är den viktigaste tekniken förknippad med PWA. Dessa gör det möjligt för PWA att fungera utanför nätverket.

Manifesta filer innehålla ikonen och namnet som länkar appen på enheten till webbplats. Utvecklaren kan också lägga till designelement här för att förbättra din kundupplevelse.

Tryck meddelanden kommunicera med dina användare (med deras tillstånd), så de kommer tillbaka.

Några anledningar

Så varför ska din webbplats innehålla en PWA? Det är ganska enkelt.

Bättre prestanda - även på skrivbordet!

Du vet att du har en begränsad tid att vinna en besökaren för första gången – sex sekunders laddning innan en potentiell kund lämnar och besöker nästa sida i sökresultaten. Mobilanvändare är ännu mer otåliga – hälften av dina potentiella användare kommer att lämna om en sida tar mer än 3 sekunder att ladda!

Goda nyheter: ändringarna du gör för att skapa en progressiv webbapplikation påskyndar din webbplats!

Exempel: Det indiska hotellföretaget Treebo reducerade sin mobila laddningstid från sex sekunder till 1,5 sekunder genom att skapa sin PWA. Webbplatsen laddas nu på skrivbordet på en sekund! Deras tekniska team rapporterade att webbplatsens sökrankning har förbättrats och den månatliga omvandlingsfrekvensen har mer än fördubblats!

Offline kapacitet

PWA behöver inte vara på Internet för att göra det. Dina användare kan komma åt allt appens innehåll från sin enhet eller skrivbord.

Faktum är att en av de trevligaste sakerna med en PWA är att din kund kan spara webbplatsen på enhetens hemsida och använda den senare för att köpa din produkt eller få mer information. .

Till exempel, CNET Tech idag erbjuder en daglig sammanfattning av de teknologirelaterade nyheterna som är det dagliga brödet på webbplatsen. Om du öppnar webbplatsen med Google Chrome på en Android-enhet och bläddrar ner till botten av skärmen ser du detta:

Lägg till en PWA på en mobil hemskärm. Ingen applikationsbutik krävs!
Lägg till en PWA på en mobil startskärm. Ingen appbutik krävs!

Press Lägg till på hemskärmen för att ladda ner Tech Today progressiva webbapp till din enhet. Tryck på ikonen för att ladda de 10 senaste aktuella berättelserna. Svep åt vänster för att läsa varje historia. Tryck på CNET-logotypen för att öppna CNET-hemsidan i din webbläsare.

Remarque : På Firefox har webbplatser med PWA en ikon "Lägg till på hemsidan" (ett plustecken i en liten ruta) direkt i adressfältet. Om PWA redan är installerat tar Android-logotypen i adressfältet dig till PWA.

En sak som din webbplats inte behöver: "Ladda ner vår app" -widgets tar plats på din sida (vanligtvis med iTunes- och Android-logotyper som distraherar användare). Om Chrome märker att en användare har öppnat din PWA-webbplats flera gånger i veckan uppmanas du att lägga till din PWA. Uppdateringar är också automatiska.

Inget behov av komplicerade programmeringsspråk

Du kanske har funderat på att bygga en inbyggd mobilapp för ditt företag, men upptäckt att det är ett annat djur att bygga en mobilapp än att bygga en webbplats. Om du arbetar med en webbdesign-/utvecklingsbyrå för att underhålla din webbplats, har de inte nödvändigtvis kompetensen att bygga en app för vanliga mobilleverantörer.

För att din programvara ska visas i Apple App Store måste dina utvecklare registrera sig i Apple Developer Network, använda Apple Developer Tool (som endast fungerar på Mac) och kunna ett språk för Apple-godkänd programmering: Swift eller Object C.

Programmering för Android är lite enklare (inget utvecklargodkännande krävs), men de allra flesta Android-appar är skrivna i Java, vilket kan vara ett svårt språk att lära sig.

För att appen ska visas i Apple- eller Android-onlinebutiker måste den färdiga appen erhålla godkännande från vårdnadshavarna i respektive butik.

Däremot byggs progressiva webbappar med populära webbspråk: HTML, CSS (Cascading Style Sheets) och JavaScript. Kort sagt, även nybörjare webbutvecklare kan bygga högkvalitativa PWA.

Specifikt behöver du inte mycket datorutbildning för att göra en PWA för din WordPress-webbplats. Om du redan har ändrat formateringen av din webbplats med hjälp av ett underordnat tema kan du också skapa en PWA-fil. Vi behandlar kodningsfrågor i en annan artikel.

Öka stödet från teknikjättar

Standarder tar lång tid att bli standarder. Google marknadsförde först PWA under 2015.

Under lång tid var Chrome den enda webbläsaren som stödde PWA, men det är på väg att ändras. De senaste månaderna:

  • Mozilla har lagt till PWA-stöd i Firefox 58
  • Apple meddelade nyligen stöd för webbapplikationer i iOS
  • Microsoft kommer att stödja PWA i nästa version av Windows 10, som kommer att finnas tillgänglig senare i år (2018).

Går längre än andra leverantörer av operativsystem, har Microsoft sagt att "högkvalitativa" PWA kommer snart att integreras i Windows 10-appbutiken på mobiler och stationära datorer.

WordPress och PWAs

WordPress stöder ännu inte helt byggandet av progressiva webbappar i basappen. Jetpack-teamet har åtagit sig att lägga till PWA-funktionalitet under det kommande året. Detta underlättas av Javascript-ification av WordPress.

Jetpack "introducerar gradvis PWA-funktioner så snart de är klara", säger utvecklare Dan Walmsley i en artikel på WordPress VIP-bloggen . Utvecklare kan lägga till manifestfiler med Jetpacks manifestmodul sedan version 5.6.0, och de har infört progressiv bildladdning, vilket gör att webbplatsen laddas snabbare även när det finns många bilder på den. sidan. Fler funktioner kommer i år.

Några plugins försöker lägga till PWA-funktionalitet, men har inte antagits kraftigt.

  • WordPress-optimeringsverktyget ger ett fungerande och manifestverktyg.
  • Super Progressive Web Apps genererar ett manifest och en Lägg till-knapp på startskärmen, bland andra funktioner.
  • WordPress Mobile Pack lägger också till PWA-funktioner

Hur ska du använda PWA?

I den här handledningen lärde du dig lite om progressiva webbappar och varför ska du lägga till en på webbplats av ditt företag:

  • Den växande vågen av mobilenhetstrafik
  • Bättre prestanda för din webbplats - mobil och stationär
  • Tillgänglighet även när enheten är offline
  • Använder vanliga webbfunktioner: HTML, CSS och Javascript. Billigare att bygga
  • Ökat stöd för webbläsare och operativsystem

Kanske vill du nu veta hur man gör en PWA på WordPress? Eller visa dina utvecklare hur man gör det? Detta kommer att bli föremål för en annan handledning.