Progressive Web Apps: Ist PWA die Zukunft des Webdesigns? [2025]

Einführung

In einer Welt, in der zwei Drittel der Bevölkerung über mobile Geräte miteinander verbunden sind, ist eine starke mobile Präsenz ein Muss für jeden, der wahrgenommen werden möchte. Die Millionen-Dollar-Frage lautet, wie man Mobil- und Desktop-Nutzer gleichermaßen ansprechen kann, ohne sowohl eine mobile App (iOS und Android) als auch eine responsive Website zu entwickeln und zu pflegen.

In den letzten Jahren sind viele Webentwickler davon überzeugt, dass Progressive Web Apps (PWAs) sind die beste Antwort, und dieser Artikel untersucht, ob sie wirklich die Zukunft des Webdesigns sind.

Was sind Progressive Web Apps?

Der Begriff „Progressive Web Apps“ wurde 2015 geprägt, also im Grunde vor einem Jahrhundert, wenn es um Webentwicklung geht, aber es herrscht immer noch einige Verwirrung über ihre Anatomie. Im Wesentlichen handelt es sich bei PWAs um App-ähnliche Websites, die mithilfe von Webtechnologien das Beste aus Web- und nativen Umgebungen kombinieren. Sie bestehen aus drei Hauptkomponenten:

• Webseite: Im Kern sind alle PWAs mehr oder weniger normale Websites, die mit HTML, CSS und JavaScript geschrieben wurden. Da PWAs ausschließlich auf JavaScript angewiesen sind, um Interaktivität zu ermöglichen, muss keine Entwicklungsumgebung installiert werden, um sie zu erstellen, und alle modernen Webbrowser unterstützen sie bereits.
• Web-Manifest: PWAs enthalten eine JSON-Datei, die den Webbrowser und das Gerät darüber informiert, dass es sich um eine PWA und nicht um eine normale Website handelt. Die JSON-Datei enthält unter anderem den Namen der PWA, ihr Symbol, eine Beschreibung und Informationen darüber, welchen Zugriff sie benötigt, damit das Gerät ordnungsgemäß funktioniert.
• Servicemitarbeiter: Um die technische Grundlage für Funktionen zu schaffen, die traditionell nur mit nativen mobilen Apps in Verbindung gebracht werden, wie Push-Benachrichtigungen, umfangreiche Offline-Erlebnisse und regelmäßige Hintergrundsynchronisierungen, verwenden PWAs ein JavaScript-Skript, das unabhängig von der Website selbst im Hintergrund ausgeführt wird.

„PWAs sind eine natürliche Weiterentwicklung der Art und Weise, wie wir Software verteilen und konsumieren“, so die Webentwickler von Google und Microsoft in Progressive Web Apps: Die Zukunft des mobilen Webs. „Da sie auf Webtechnologien basieren, sind sie unabhängig von Betriebssystem oder Entwicklungsumgebung.“

Ist PWA die Zukunft des responsiven Webdesigns?

Seit fast zwei Jahrzehnten (die erste dokumentierte Website mit responsivem Design wurde etwa 2002 von Audi veröffentlicht) halten sich Webentwickler an den Ansatz des responsiven Webdesigns, um Websites auf Geräten mit großen und kleinen Bildschirmen gleichermaßen gut anzuzeigen, ohne dass eine mobilspezifische Version derselben Website gepflegt werden muss.

Das Problem mit responsivem Webdesign ist, dass es nicht weit genug geht, um die Erwartungen der Benutzer zu erfüllen, die von einer Vielzahl von Geräten mit unterschiedlichen Fenster- oder Bildschirmgrößen kommen. Aus diesem Grund fragen sich viele Webdesigner jetzt: „Ist PWA die Zukunft des responsiven Webdesigns?“

Insbesondere verwendet responsives Webdesign keine progressiven Verbesserungen, um native Funktionen bereitzustellen, wenn sie auf einem beliebigen Gerät angezeigt werden. Progressive Web-Apps lösen dieses Problem durch ihren Einsatz von Servicemitarbeitern, die neben der Reaktionsfähigkeit eine ganze Reihe grundlegender Designüberlegungen erstellen, die alle Webentwickler und Designer berücksichtigen sollten:

• Umgang mit Veränderungen: Der progressive Aspekt von PWAs bedeutet, dass bei nachfolgenden Besuchen (oder sogar in Echtzeit) mehr Funktionen verfügbar werden können. Die Benutzer sollten mithilfe von Statusbenachrichtigungen und anderen Mitteln ordnungsgemäß über alle Änderungen informiert werden.
• Push-Benachrichtigungen: Ein Hauptmerkmal von PWAs sind Push-Benachrichtigungen. Die Fähigkeit von Push-Benachrichtigungen, die Nutzerinteraktion zu erhöhen, ist derzeit gut dokumentiert, aber Push-Benachrichtigungen können Nutzer auch wegdrängen, wenn sie nicht richtig behandelt werden.
• Verschiedene Staaten: PWAs sollten unter Berücksichtigung verschiedener Zustände konzipiert werden und sowohl offline als auch online funktionieren. Zu den anderen Zuständen gehören Netzwerkprobleme, Inhalte, die noch geladen werden oder Inhalte, die nur teilweise geladen werden.
• Wahrgenommene Leistung: Vor allem in Schwellenländern wie Indien, wo die meisten Menschen von Low-End-Geräten aus auf das Internet zugreifen, ist es wichtig, mithilfe von Ladebildschirmen und Übergangsanimationen die Nutzer darüber zu informieren, dass sie Fortschritte machen, und so die wahrgenommene Leistung zu verbessern.
• Barrierefreiheit: Es versteht sich von selbst, dass PWAs den Web Content Accessibility Guidelines (WCAG) 2.0 folgen sollten, die definieren, wie Webinhalte für Menschen mit Behinderungen zugänglicher gemacht werden können.

Vorteile in Hülle und Fülle

Viele große Unternehmen, darunter Twitter und Alibaba, kennen bereits die Antwort auf die Frage: „Ist PWA die Zukunft des Webdesigns?“ Sie nutzen PWAs in ihren digitalen Strategien und profitieren Sie von vielen Vorteilen dieses nächsten Kapitels des Webdesigns.

Die Twitter Lite Progressive Web App ermöglichte es dem Social-Media-Giganten, die Anzahl der Seiten pro Sitzung um 65 Prozent zu erhöhen, die Anzahl der gesendeten Tweets um 75 Prozent zu erhöhen und die Absprungrate um 20 Prozent zu senken, indem ein schnelleres, zuverlässigeres und ansprechenderes mobiles Weberlebnis geboten wurde.

„Twitter Lite ist jetzt die schnellste, kostengünstigste und zuverlässigste Art, Twitter zu nutzen“, sagt Nicolas Gallagher, der technische Leiter von Twitter Lite. „Die Web-App kann mit der Leistung unserer nativen Apps mithalten, benötigt aber im Vergleich zu Twitter für Android weniger als 3% des Gerätespeichers.

AliExpress, der Online-Einzelhandelsdienst von Alibaba, berichtete, dass die pro Sitzung verbrachte Zeit nach der Veröffentlichung seiner PWA in allen Browsern um durchschnittlich 74% gestiegen ist. Die Nutzer besuchen jetzt doppelt so viele Seiten pro Sitzung. Das Gleiche geschah, als Alibaba eine PWA für seine B2B-Handelsplattform veröffentlichte, was Folgendes zeigt Die Vorteile von PWAs sind nicht durch die Marktbranche begrenzt.

Fazit

Progressive Web Apps scheinen die Zukunft des Webdesigns zu sein und ermöglichen Entwickler von Web-Apps um Benutzererlebnisse zu schaffen, die die Reichweite des Webs und die Funktionalität nativer Apps haben. Wie bei jeder neuen Technologie haben sie ihre eigenen grundlegenden Designüberlegungen, aber ihre zahlreichen Vorteile machen sie zu einer lohnenden Investition.

Ressourcen

• https://developers.google.com/web/showcase/2017/twitter
• https://developers.google.com/web/showcase/2016/alibaba
• https://developers.google.com/web/showcase/2016/wapo