logo

Web App erstellen – Übersicht für Anfänger

Web Apps erfreuen sich immer größer werdender Beliebtheit auf dem App-Markt und viele Unternehmen lassen Ihre Apps nicht mehr Nativ entwickeln, sondern als Webanwendung. Diese werden im Browser ausgeführt, entsprechen aber optisch einer Nativen App, sodass auf den ersten Blick kein Unterschied auffällt. Was genau eine Web App ist und welche Vorteile diese mit sich bringt, erfahren Sie in diesem Artikel.

Ein Überblick zum Thema Web App Erstellung:

  1. Was ist eine Web App?
  2. Das bietet Ihnen eine Web App – Vor und Nachteile
  3. Technologien von Webanwendungen
  4. Unterschied zu einer „normalen Website“
  5. Fazit – Lohnt sich die Entwicklung einer Web App?

Was ist eine Web App?

Eine Web App oder auch Webanwendung ist eine Applikation, welche vollständig im Browser ausgeführt wird. Hierbei ist egal welcher Browser verwendet wird, ein Nutzer kann die App in Google Chrome, Safari oder Mozilla Firefox verwenden. Dadurch sind Web Apps plattformübergreifend und können von jedem Smartphone, Tablet oder Computer benutzt werden – einzige Voraussetzung ist ein beliebiger Browser. Ähnlich wie Websites basieren Web Apps auf den üblichen Technologien des Internets und werden in Programmiersprachen wie HTML5, JavaScript und CSS geschrieben. Dadurch müssen Web Apps auch nur einmal programmiert werden und können auf sämtlichen Endgeräten dargestellt werden. Grundlegend sind Web Apps also eigentlich wie gewöhnliche Websites, werden aber auf dem Smartphone und Tablet so angezeigt und bedient wie Native Apps. Denn durch Ausblenden der Adressleiste, der Vor- und Zurück-Buttons und des Browser-Menüs, wirkt eine Web App optisch wie eine Native App. Aufgrund der browserbasierten Entwicklung, ist es nicht notwendig eine Web App auf das Endgerät herunterzuladen und dort zu installieren. Die Web Anwendung wird über einen Server gehostet, was auch bedeutet das man mit diesem verbunden sein muss. Im Klartext bedeutet dies, dass der Nutzer der Web App eine beständige Internetverbindung benötigt, um die App mit all ihren Funktionen nutzen zu können. Ein weiteres Merkmal einer Web App, ist die Auffindbarkeit dieser in den Suchmaschinen Ergebnissen (SERPS), dafür können diese aber nicht auf den App-Plattformen wie dem Google Play Store oder dem Apple App Store gefunden werden.

Neben der Erstellung einer App als Web App gibt es noch andere Entwicklungsarten. Erfahren Sie mehr zur „Nativen und Hybriden Entwicklung“ in unserem Ratgeber.

Das bietet Ihnen eine Web App – Vor und Nachteile

Vorteile

  • Plattfromunabhängig: Wie bereits erwähnt können Web Apps auf jeder Art von Endgerät genutzt werden, solange diese über einen Browser verfügen. Dies hat den großen Vorteil, dass Webapplikationen nur einmal programmiert werden müssen und dann auf sämtlichen Geräten funktionieren. Dadurch wird enorm an Entwicklungsaufwand gespart.
  • Zugänglichkeit: Web Apps können einfach über Suchmaschinen gefunden werden, wodurch auch organisch generierte Nutzer die Anwendung verwenden. Native Apps müssen im App Store gefunden und installiert werden, was auch die einzige Quelle für neue User ist.
  • Installation: Um Web Apps nutzen zu können, müssen diese nicht auf dem Smartphone oder Tablet installiert werden. Die Barriere des Downloads und der Installation entfallen. Obwohl die Anwendung nicht auf dem mobilen Endgerät installiert wird, ist es trotzdem möglich ein App-Icon dem Startbildschirm hinzuzufügen.
  • Kompatibilität: Alle Nutzer greifen auf die gleiche Anwendungsfunktion zu, wodurch es zu keinen Kompatibilitätsproblemen der unterschiedlichen Versionen (Android, iOS) kommen kann.
  • Wartung: Es ist sehr einfach Updates für Web Apps zu veröffentlichen. Diese können quasi sofort online gebracht werden und müssen nicht erst von App Stores genehmigt und veröffentlicht werden. Ein weiterer Vorteil ist, dass die Updates für nur eine Anwendungsversion gemacht werden muss und nicht wie bei der Nativen Entwicklung für iOS und Android. Dies ermöglicht auch die schnelle Reaktion auf eventuelle Sicherheitslücken in Echtzeit und spart Geld.
  • Verbreitung: Eine Web App kann von einem Nutzer einfach per URL an andere geteilt werden. Diese können dann, wie bereits erwähnt, direkt ohne Installation auf die Web Anwendung zugreifen.
  • Monetarisierung: Web Apps sind immer gratis nutzbar, da es sich um eine reguläre Website handelt. Es ist aber möglich durch Werbebanner und Werbevideos Geld mit einer Web App zu verdienen.
  • Kosten: Die Programmierung einer Web App ist mit durchschnittlich etwa 6.500€ deutlich günstigere als eine Native Entwicklung, welche bei einer ähnlichen App rund 11.000€ kosten würde. Dies liegt vor allem daran, dass eine Web App nur einmal programmiert werden muss und dann auf allen Geräten verfügbar ist. Aufgrund der Zeitersparnisse fällt die gesamte Entwicklung günstiger aus.
  • Programmierung: Web-Entwickler können mit eine Web App mit den gewohnten Programmen entwickeln. Des Weiteren wird für die Programmierung kein Apple iMac oder MacBook benötigt, wie es bei der Nativen Entwicklung der Fall ist.

Nachteile

  • Funktionen: Die Nachteile einer browserbasierten Web App liegen eindeutig im Funktionsumfang. So ist es zwar möglich Push-Benachrichtigungen, GPS und Kamera und Mikrofon des mobilen Endgerätes zu verwenden, im Gegensatz zu Nativen Apps sind das aber relativ wenig Funktionen. Diese können auf weitere Hardware des Smartphones oder Tablets zugreifen wie zum Beispiel Gerätevibration, Sensoren, Bildschirmausrichtung oder den Kompass zugreifen. Außerdem können Web Apps nicht auf Daten des Endgeräts zugreifen und somit keine Kontakt- und Kalenderdaten oder Bilder abrufen. Zudem kann die App nicht im Vollbildmodus gestartet werden, da dieser Modus vom Browser nicht unterstützt wird.
  • Performance: Dadurch das Web Anwendungen im Browser laufen, sind diese performance-technisch beschränkt. Sehr aufwendige Funktionen, für die viel Arbeitsspeicher benötigt wird, können in einer Web App nicht integriert werden. Vor allem für Spiele Apps sind Web Anwendungen aufgrund der hohen Ansprüche nicht geeignet.
  • Online-Zugriff: Für den Zugriff auf eine Web App benötigt der User eine stabile und stetige Verbindung zum Internet. Vor allem in Deutschland gibt es in den ländlichen Regionen häufig noch große Lücken im Mobilfunknetz, weswegen häufig eine Offline-Nutzung von den Usern gewünscht ist. Ein gutes Beispiel dafür ist die Netflix App in der Serienfolgen und Filme heruntergeladen werden können und somit auch offline verfügbar sind.
  • Optimierung: Web Apps können nicht wie Native Apps auf bestimmte Endgeräte optimiert werden. Deswegen ist die User Experience bei Web Apps häufig geringer, mit einem responsiven Webdesign kann diesem Nachteil aber mittlerweile gut entgegengewirkt werden.

Sie wollen sich auch über die anderen Entwicklungsarten informieren und von dessen Vor- und Nachteilen erfahren? Dann lesen Sie unseren Leitartikel zum Thema „Native App Entwickeln“

Team creating Web App
Programmierung einer Web App
Fertige Web App am Laptop

Technologien von Webanwendungen

Web Apps werden in den Programmiersprachen HTML5, CSS3 und JavaScript erstellt. Genauer gesagt wird HTML5 für die Struktur und den Inhalt der Web App verwendet, CSS3 für das Design und JavaScript für die Interaktion mit der Hardware des mobilen Endgerätes, wie GPS, Kamera oder Mikrofon. Um die Interaktion zwischen einem Nutzer und dem Server zu ermöglichen wird zudem noch eine Scriptsprache benötigt, in den meisten Fällen wird hierfür PHP verwendet. Zusätzlich wird zum Programmieren von Web Apps ein Framework zur Cross-Plattform-Entwicklung benötigt, die beliebtesten Frameworks dafür sind Apache Cordova, Django oder Electron.

HTML5 ist die Abkürzung von Hypertext Makeup Language, die fünf steht für die Version. HTML5 ist die neuste Version und wurde offiziell im Oktober 2014 von dem World Wide Web Consortium (W3C) veröffentlicht. Seitdem gilt der Nachfolger von HTML4 als neue Kernsprache des Webs und der Browser. Mittlerweile basieren die meisten Websites im Internet auf HTML5, mit der Zeit werden veraltete Websites auf die neue Computersprache umgestellt. HTML5 wird zum Verknüpfen von Inhalten digitaler Dokumente verwendet, weswegen es so bedeutend für die Struktur einer Web App ist. In Kombination mit JavaScript ist es die einzige Möglichkeit eine App nur einmal für alle Betriebssysteme programmieren zu können. CSS3 (Cascading Style Sheets) ist die dritte wichtige Komponente für die Entwicklung einer Web App und ist neben HTML5 und JavaScript eine Kernsprache des World Wide Webs. CSS3 wurde ebenfalls von W3C veröffentlicht und gilt als „living standard“, also eine Software, welche ständig weiterentwickelt wird. Die Programmiersprache ist eine sogenannte Stylesheet-Sprache, welche für die Trennung von Daten und deren Darstellung zuständig ist. In CSS3 wird ein sogenanntes Stylesheet erstellt, welches dem auslesenden Programm, bei einer Web App der Browser, sagt, wie Daten formatiert und angezeigt werden sollen. Mit CSS3 werden sozusagen Regeln für das Design der Web App erstellt.

Für viele Entwickler ist die Programmierung mit HTML5 ein Vorteil, da HTML5 eine relativ einfache und weit verbreitete Programmiersprache ist und somit Entwickler mit HTML5 meist viel Erfahrung haben. Sollten Sie also bereits selbst Erfahrung im Programmieren mit HTML5 haben und eine eigene Website oder ähnliches erstellt haben, finden Sie sich auch sicher schnell in die Entwicklung einer Web App rein. Falls Sie Ihre Web App doch lieber von einem professionellen Entwicklerteam erstellen lassen wollen, können Sie sich in unserem Ratgeber über die „Vorteile einer Agentur“ informieren.

Unterschied zu einer „normalen Website“

Häufig ist nicht ganz klar, wo genau der Unterschied zwischen einer „normalen“ Website und einer Web App liegen. Diese Verwirrung ist auch berechtigt, da zwischen Web Apps und konventionellen Websites keine genaue Grenze gezogen werden kann, der Übergang ist eher fließend. Denn sowohl Websites als auch Web Apps werden im Browser betrachtet und bedient. Zudem wird für beide Anwendungen eine bestehende Internetverbindung benötigt. Web Apps haben lediglich die Besonderheit bestimmte Bedienelemente des Browsers auszublenden, wodurch Web Apps wie Native Apps wirken. Das ist auch der große Unterschied: Web Apps haben eine bessere User Experience und einen offeneren Look. Das Feeling von Web Applikationen ist ein anderes und könnte man diese noch offline nutzen, wären Webanwendungen kaum noch von Nativen Apps zu unterscheiden.

Der wichtigste Unterschied zwischen einer Web App und einer „normalen Website“ ist, dass Web Apps einen bestimmten Service bzw. bestimmte Funktionen für den Nutzer bietet. Interaktion zwischen User und Web App ist hierbei entscheidend. So spricht man eher von einer Webanwendung, wenn die Nutzer sich einen Account anlegen können, als von einer Website. Bekannte Webanwendungen sind Google, Facebook und verschiedene Online Shops wie Amazon oder eBay. Diese großen Unternehmen verfügen auch über Native Anwendungen, lassen sich aber auch als Web App im Browser benutzen. Eine Homepage hingegen bietet hingegen meistens nur Informationen, Bilder und enthält viel Text.

Fazit – Lohnt sich die Entwicklung einer Web App?

Web Apps haben viele Vorteile, müssen aber bei der Performance und dem Funktionsumfang einbüßen. So ist es sicherlich von Vorteilen eine Web App zu erstellen, wenn Ihr Budget gering ist und Sie eine einfache Wartung der App mit nur einem Code haben wollen. Monetarisierung einer Web App wird durch Werbebanner oder Werbevideos ermöglicht. Da Web Apps in jedem Fall kostenlos sind, entfällt aber die Vermarktung als Paid-App. Web Apps werden in den Kernsprachen des Webs, HTML5 JavaScript und CSS3, verfasst. Dies ist für viele Web-Entwickler von Vorteil, da diese bereits viel Erfahrung mit diesen Programmiersprachen haben. Das zeigt auch, dass der Unterschied zwischen einer herkömmlichen Website und einer Web App gar nicht so groß ist. Beide werden in denselben Sprachen verfasst, lediglich die Darstellung und die Funktionen unterscheiden sich. So können Webanwendungen die Browserleisten und -buttons ausblenden, wodurch der Look eher einer Nativen App entspricht als einer Website. Die Frage zu beantworten, ob sich eine Umsetzung Ihres Projektes als Web App lohnt, ist so einfach nicht zu sagen. Die richtige Entwicklungsart für eine Applikation hängt von vielen Faktoren ab, wie Funktionen, Budget oder Performance. Schildern Sie den Experten vom itPortal24 Ihr App-Projekt und wir finden für Sie die richtige Entwicklungsart und die dazu passenden Entwicklerteams oder App-Agenturen.


...

Jonas Herzer

Ihr persönlicher Berater rund um das Thema App-Entwicklung. Ich berate Sie gerne kostenfrei und unverbindlich.

+49 30 308 09245
j.herzer@itportal24.de

Welches Betriebssystem wird Ihre App unterstützen?

Das könnte Sie auch interessieren: