Sie haben zweifellos von der kommenden Welle des mobilen Webs gehört. Das häufigste, was Sie wahrscheinlich gehört haben, ist, dass der mobile Webzugriff schnell zunimmt und etwa die Hälfte des gesamten Webverkehrs jetzt über Telefon oder Tablet erfolgt. EIN Februar 2018-Bericht vom Pew Research Center Beachten Sie, dass 95% aller Amerikaner ein Mobiltelefon besitzen, während der Anteil der Amerikaner mit Smartphones 77% beträgt.
Sie müssen nicht weit schauen, um die Auswirkungen von Mobilgeräten zu erkennen. Schau dir dein eigenes Verhalten und das deiner Familie an. Im Dezember 2016 comScore berichtete, dass der durchschnittliche Amerikaner über 17 zwei Stunden und 51 Minuten pro Tag am Telefon verbringt (Englais).
Statcounter.com stellt fest, dass der globale Webdatenverkehr mindestens ein Jahr lang hauptsächlich von Mobilgeräten stammt (51,95% im Februar 2018).
Während Sie vielleicht denken, dass Sie es sich nicht leisten können, eine native App zu entwickeln, die Ihre mobilen Benutzer auf ihren Handys speichern können, gibt es für jedes Unternehmen eine hervorragende Alternative: Progressive Webanwendungen. Vielleicht haben Sie schon von Progressive Web Applications (PWAs) gehört und davon, wie Menschen sie verwenden, um ihr Geschäft auszubauen. In diesem Artikel erfahren Sie etwas mehr über PWAs und warum Sie mehr über deren Verwendung im Jahr 2018 nachdenken sollten.
Einige Definitionen
Progressive Web Applications (PWAs) sind eine Sammlung von Webstandards, die ursprünglich von Google entwickelt wurden, um die Leistung von Websites auf Mobilgeräten zu verbessern. Daher funktionieren Websites eher wie dedizierte mobile Apps, die Sie im Apple App Store oder bei Google Play finden.
ein anderer Definition Entwickler für die indische Hotelkette Treebo: „PWAs sind Single-Page-Anwendungen, die schrittweise mit Funktionen erweitert werden, die ein immersiveres natives Erlebnis bieten. »
Mit PWAs auf Mobilgeräten können Ihre Leser und Kunden die Homepage Ihrer Website schnell laden und viele der gleichen Funktionen auf dem Mobilgerät verwenden, die eine native App verwenden würde. Ihre Site existiert möglicherweise außerhalb des Browsers, auch wenn das Gerät nicht mit dem Internet verbunden ist.
Andere Definitionen
Einige der wichtigsten technischen Teile einer PWA sind:
Dienstleistungen Arbeiter sind die Schlüsseltechnologie für PWAs. Diese ermöglichen es PWAs, außerhalb des Netzwerks zu arbeiten.
Manifestierte Dateien enthalten das Symbol und den Namen, der die App auf dem Gerät mit der verknüpft Website. Der Entwickler kann hier auch Designelemente hinzufügen, um Ihr Kundenerlebnis zu verbessern.
Push-Benachrichtigungen kommunizieren Sie mit Ihren Benutzern (mit ihrer Erlaubnis), damit sie zurückkommen.
Einige Gründe
Warum sollte Ihre Site eine PWA enthalten? Es ist ziemlich einfach.
Bessere Leistung - auch auf dem Desktop!
Sie wissen, dass Sie nur eine begrenzte Zeit haben, um einen zu gewinnen Besucher zum ersten Mal – sechs Sekunden Ladezeit, bevor ein potenzieller Kunde die nächste Website in den Suchergebnissen verlässt und besucht. Mobile Nutzer sind sogar noch ungeduldiger – die Hälfte Ihrer potenziellen Nutzer verlässt die Website, wenn das Laden einer Website länger als 3 Sekunden dauert!
Gute Nachricht: Die Änderungen, die Sie an der Erstellung einer fortschrittlichen Webanwendung vornehmen, beschleunigen Ihre Website!
Beispiel: Das indische Hotelunternehmen Treebo reduzierte seine Ladezeit für Mobilgeräte durch die Erstellung seiner PWA von sechs Sekunden auf 1,5 Sekunden. Die Seite wird jetzt in einer Sekunde auf den Desktop geladen! Ihr Tech-Team berichtete, dass sich das Suchranking der Website verbessert und die monatliche Conversion-Rate mehr als verdoppelt hat!
Offline-Kapazität
PWA muss dazu nicht im Internet sein. Ihre Benutzer können von ihrem Gerät oder Desktop aus auf alle Inhalte der App zugreifen.
Tatsächlich ist eines der schönsten Dinge an einer PWA, dass Ihr Kunde die Website auf der Homepage seines Geräts speichern und später zum Kauf Ihres Produkts oder zum Abrufen weiterer Informationen verwenden kann. .
Zum Beispiel CNET Tech heute bietet eine tägliche Zusammenfassung der technologiebezogenen Nachrichten, die das tägliche Brot der Website sind. Wenn Sie die Website mit Google Chrome auf einem Android-Gerät öffnen und zum unteren Bildschirmrand scrollen, wird Folgendes angezeigt:
Drücken Sie Zum Startbildschirm hinzufügen um die progressive Web-App Tech Today auf Ihr Gerät herunterzuladen. Tippen Sie auf das Symbol, um die 10 aktuellsten Storys zu laden. Wischen Sie nach links, um jede Geschichte zu lesen. Tippen Sie auf das CNET-Logo, um die CNET-Homepage in Ihrem Browser zu öffnen.
Remarque : In Firefox haben Websites mit PWA das Symbol "Zur Startseite hinzufügen" (ein Pluszeichen in einem winzigen Feld) direkt in der Adressleiste. Wenn die PWA bereits installiert ist, führt Sie das Android-Logo in der Adressleiste zur PWA.
Eine Sache, die Ihre Website nicht benötigt: Widgets zum Herunterladen unserer App belegen Speicherplatz auf Ihrer Seite (normalerweise mit den iTunes- und Android-Logos, die Benutzer ablenken). Wenn Chrome feststellt, dass ein Nutzer Ihre PWA-Site mehrmals pro Woche geöffnet hat, werden Sie aufgefordert, Ihre PWA hinzuzufügen. Updates erfolgen ebenfalls automatisch.
Keine Notwendigkeit für komplexe Programmiersprachen
Möglicherweise haben Sie darüber nachgedacht, eine native mobile App für Ihr Unternehmen zu erstellen, aber festgestellt, dass das Erstellen einer mobilen App etwas anderes ist als das Erstellen einer Website. Wenn Sie mit einer Webdesign-/Entwicklungsagentur zusammenarbeiten, um Ihre Website zu pflegen, verfügt diese nicht unbedingt über die Fähigkeiten, eine App für etablierte mobile Anbieter zu erstellen.
Damit Ihre Software im Apple App Store angezeigt wird, müssen sich Ihre Entwickler beim Apple Developer Network registrieren, das Apple Developer Tool (das nur auf Mac funktioniert) verwenden und eine Sprache von kennen Von Apple genehmigte Programmierung: Swift oder Objective C.
Das Programmieren für Android ist etwas einfacher (keine Entwicklergenehmigung erforderlich), aber die überwiegende Mehrheit der Android-Apps ist in Java geschrieben, was eine schwer zu erlernende Sprache sein kann.
Damit die App in Apple- oder Android-Online-Shops angezeigt werden kann, muss die fertige App von den Depotbanken des jeweiligen Stores genehmigt werden.
Im Gegensatz dazu werden progressive Web-Apps mit gängigen Web-Sprachen erstellt: HTML, CSS (Cascading Style Sheets) und JavaScript. Kurz gesagt, auch neue Webentwickler können hochwertige PWAs erstellen.
Insbesondere benötigen Sie nicht viel Computerausbildung, um eine PWA für Ihre WordPress-Site durchzuführen. Wenn Sie die Formatierung Ihrer Site bereits mithilfe eines untergeordneten Themas geändert haben, können Sie auch eine PWA-Datei erstellen. Wir werden Codierungsprobleme in einem anderen Artikel behandeln.
Steigern Sie die Unterstützung von Technologieriesen
Es dauert lange, bis Standards zu Standards werden. Google hat 2015 erstmals für PWAs geworben.
Chrome war lange Zeit der einzige Browser, der PWAs unterstützte, aber das wird sich bald ändern. In den letzten Monaten:
- Mozilla hat die PWA-Unterstützung in Firefox 58 hinzugefügt
- Apple hat kürzlich die Unterstützung von Webanwendungen für iOS angekündigt
- Microsoft wird PWA in der nächsten Version von Windows 10 unterstützen, die im Laufe dieses Jahres verfügbar sein wird (2018).
Microsoft geht weiter als andere Anbieter von Betriebssystemen und hat angekündigt, dass "hochwertige" PWAs bald auf Handys und Desktops in den Windows 10 App Store integriert werden.
WordPress und PWAs
WordPress unterstützt das Erstellen progressiver Web-Apps in der Basis-App noch nicht vollständig. Das Jetpack-Team hat sich verpflichtet, im kommenden Jahr PWA-Funktionen hinzuzufügen. Dies wird durch die Javascript-Kennzeichnung von WordPress unterstützt.
Jetpack "Führt PWA-Funktionen schrittweise ein, sobald sie bereit sind", sagt der Entwickler Dan Walmsley in einem Artikel über den WordPress VIP Blog . Entwickler können Manifest-Dateien mithilfe des Manifest-Moduls von Jetpack seit Version 5.6.0 hinzufügen. Sie haben das progressive Laden von Bildern eingeführt, wodurch das Laden von Websites auch dann beschleunigt wird, wenn viele Bilder darauf sind. Die Seite. Weitere Funktionen werden in diesem Jahr folgen.
Einige Plugins versuchen, PWA-Funktionen hinzuzufügen, wurden jedoch nicht stark übernommen.
- Das WordPress-Optimierungstool bietet ein funktionierendes und offenkundiges Tool.
- Super Progressive Web Apps generiert unter anderem ein Manifest und eine Schaltfläche Hinzufügen zum Startbildschirm.
- Das WordPress Mobile Pack fügt auch PWA-Funktionen hinzu
Wie werden Sie die PWA nutzen?
In diesem Tutorial haben Sie ein wenig über Progressive Web Apps gelernt und erfahren, warum Sie eine hinzufügen sollten Website Ihres Unternehmens:
- Die wachsende Welle des mobilen Geräteverkehrs
- Bessere Leistung für Ihre Website - mobil und Desktop
- Verfügbarkeit auch dann, wenn das Gerät offline ist
- Verwendet Standard-Webfunktionen: HTML, CSS und Javascript. Billiger zu bauen
- Verbesserte Unterstützung für Browser und Betriebssysteme
Vielleicht möchten Sie jetzt wissen, wie man eine PWA in WordPress macht? Oder zeigen Sie Ihren Entwicklern, wie es geht? Dies wird Gegenstand eines weiteren Tutorials sein.
