mobile phone, smartphone, app

04 | Apps

Vom Telefon zum smarten Alleskönner

„App“ ist die Kurzform für „Application Software“, also Anwendungsprogramm. Apps haben unterschiedliche Funktionen und erweitern damit den Anwendungsbereich und den Funktionsumfang von Smartphones, Tablets und anderen Endgeräten. Es gibt einzelne spezialisierte Apps für Nachrichten und für Soziale Medien, für Kommunikation wie Chats und E-Mails, für Navigation und für Spiele, etc. Anders als Systemfunktionen zielen Apps auf eine bestimmte Zielgruppe ab und passen die Funktion des Endgeräts auf die Erwartung der User an. Dabei entscheiden die Nutzerinnen und Nutzer individuell darüber, welche Apps sie für welche Zwecke nutzen möchten. Jedes Smartphone hat also andere Funktionen! 

Apps gibt es grundsätzlich nicht nur für Smartphones oder andere mobile Endgeräte, sondern auch für andere elektronische Geräte. Wir verstehen unter „App“ aber die kleinen Helferlein auf den Smartphones, seit sich der Begriff mit dem Apple App Store als Gattungsbegriff festgesetzt hat. Die Begriffe „Mobile App“ oder „mobile Applikation“ wären die korrekteren Bezeichnungen. Eine gute kurze Einführung und Begriffserklärung gibt es im Magazin von Mobile Apps. 

There’s an App for that – Sesame Street

Was ist eine Native App?

Native Apps werden speziell für das Betriebssystem des jeweiligen Endgerätes entwickelt – in der Regel Android und iOS.
So können die Applikationen nahtlos auf die Hardware des Devices zugreifen: Kamera, Standort, Mikrofon, NFC, Gyroskop, etc.)
Die Benutzeroberfläche reagiert dadurch schnell und flüssig auf Benutzereingaben. Das Nutzererlebnis ist optimal.
Eine Native App kann im Store geladen werden und wird auf dem Device installiert. Sie funktioniert auch ohne Internetverbindung.
Native App eignen sich für komplexe Projekte mit aufwändiger Benutzeroberfläche und vollem Zugriff auf die Hardware.

Was ist eine Mobile Website?

Mobile Websites können von jedem Browser auf allen Geräten angezeigt werden. Sie sind in HTML5 erstellt und auf einem Server gespeichert. Sie nutzen oft schlanken Code und können Aufgaben ausführen. Mobile Websites funktionieren nur mit Internetverbindung. Sie dürfen aus Sicherheitsgründen nicht vollständig auf die Gerätehardware zugreifen. Im Gegensatz zur Native App wird eine Mobile Website nicht heruntergeladen und auf dem Gerät installiert, sondern ist über den Browser erreichbar und wird als digitales Lesezeichen gespeichert.

Was ist eine Responsive Website?

Responsive Design stellt eine Website auf diversen Geräten jeweils sinnvoll dar – im Hoch- oder Querformat, mit viel Platz oder wenig. Dabei passt der Browser die Website an die Gegebenheiten an. Damit er dies kann, muss die Website „modular“ aufgebaut sein. Responsive Websites sind „normale“ Websites. Das vereinfacht ihre Programmierung und Pflege sowie ihre Nutzung. Sie haben allerdings keinen oder nur sehr begrenzten Zugriff auf Hardwarekomponenten wie die Kamera oder diverse Sensoren. Responsive Websites benötigen eine stabile Internetverbindung. Ohne sie sind sie unbenutzbar, sie werden nicht synchronisiert.

Was ist eine Web-App?

Eine Web-App ist eine Anwendung, die in einem Browser ausgeführt wird. Outlook.com oder Ebay.com sind Beispiele für Web Apps. Eine Web-App kann man über einen Webbrowser aufrufen und bestimmte Aufgaben darin ausführen. Von welchem Endgerät aus die Userinnen und User die Web-App öffnen – ob vom Smartphone, vom Tablet, vom Desktop-PC – spielt keine Rolle. Mit einer Web-App ist es möglich, E-Mails zu lesen und zu senden oder bei einer Auktion mitbieten – also einige Funktionen mehr, als nur Bilder anzusehen und Texte zu lesen wie bei einer Standardwebsite.

Was ist eine Hybride App?

Eine hybride App kombiniert native und Web-Apps – “hybrid” eben. Sie wird wie eine native App installiert und ist dabei eine Web-App, die auf dem Smartphone ausgeführt wird. Hybride Apps werden in HTML und CSS wie Webseiten programmiert. Dadurch funktionieren sie auf verschiedenen Plattformen – ganz wie Webseiten auch. Sie haben die gleichen Fähigkeit wie native Apps, sich an verschiedene Geräte wie ein Tablet, Smartphone usw. anzupassen. Die Inhalte werden vom Browser des Smartphones dargestellt. Das Browser-Fenster wird dabei verborgen; die Hybride App sieht damit aus, als wäre sie eine Native App. Sie kann wie eine Native App auch auf den Homescreen gepinnt werden. Die Hybride App ist die Vorstufe der Progressive Web App.

Was ist Progressive Enhancement?

Progressive Enhancement („Fortschreitende Verbesserung“) ist eine Design-Philosophie für das Web. Dabei sollen so viele Nutzerinnen und Nutzer wie möglich die grundlegenden Inhalte und Funktionen einer Website erhalten. Die Webseiten, die dieser Design-Philosophie unterliegen, werden  grundsätzlich mit jedem Browser und jeder Internetverbindung bestmöglich dargestellt und erreicht.

Die Webseite wird dabei in verschiedenen Schichten entwickelt. Nutzer älterer oder mobiler Systeme erhalten die Basisfunktionen. Nutzer mit neueren Browsern und höheren Übertragungsraten erhalten eine verbesserte Version mit zusätzlichen Effekten. Das ist wie mit einem älteren Smartphone, das kein LTE kann. Man kann trotzdem damit surfen – statt in 4G eben in 3G. Die Grundfunktionalität ist weiterhin vorhanden… 

Was ist eine Progressive Web App?

Die Kombination aus (mobiler) Web-App und Progressive Enhancement ist die Progressive Web App. Sie ist eine logische Weiterentwicklung sowohl von responsiven Webseiten als auch von nativen Apps und verbindet beide Funktionalitäten miteinander. Der Begriff wurde 2015 von Google Chrome-Technikern eingeführt. Letztlich bedeutet er: „Web App, die die neueste Browsertechnologie unterstützt”. Damit sind Progressive Web Apps (PWAs) eine Entwicklung, die sich Steve Jobs schon 2007 für das erste iPhone gewünscht hatte: Apps, die letztlich so funktionieren, als wären sie einfache Websites. „Progressive“ bedeutet dabei, dass die Apps sich stetig mit dem aktuellen Stand der technischen Entwicklung weiterentwickeln.

„Es ist sehr unwahrscheinlich, dass Progressive Web Apps ein vorübergehender Trend sein werden. Sie haben das Potenzial, die mobile Landschaft grundlegend zu verändern, umso wichtiger ist es für E-Commerce-Händler, der Zeit voraus zu sein. Die Investition in eine fortschrittliche Web-App-Entwicklung bedeutet mehr Umsatz bei weniger Kosten und positioniert frühe Adaptoren als Innovatoren.“

Auf einem Desktop-PC oder Notebook verhalten sich PWAs wie eine gewöhnliche Webanwendung. Auf einem Smartphone oder Tablet auf werden PWAs aber zu einer Webanwendung, die eine native App zu sein scheint. Sie kann dann auf native Gerätefunktionen zugreifen und die Kamera, das Mikrofon und die GPS-Daten des Samrtphones nutzen und Push-Benachrichtigungen auf den Home-Screen schicken.

Geschwindigkeit

PWAs sind oft deutlich schneller als viele native Apps. Für die Geschwindigkeit sorgt unter anderem ein kleines Tool im Hintergrund jeder PWA – der Service Worker. Dieser macht Inhalte auch offline verfügbar, was die schnellen Ladezeiten ermöglicht! Zusätzlich speichert der Browser Layoutelemente, die sich wiederholen, im Cache ab – das senkt die Downloadzeiten. Die Ladegeschwindigkeit ist ein kritischer Faktor. Benötigt eine Seite länger als drei Sekunden, um zu laden, verliert sie deutlich User; diese verlieren die Geduld und springen ab. Das belegt auch eine Google-Studie; ihr zufolge steigen die Absprungraten auf langsamen Webseiten um bis zu 123 %!

Google-Studie

Ladegeschwindigkeit ist ein wichtiger Rankingfaktor bei Google. 

Wie viel schneller PWAs sind, zeigt das folgende Video.

Responsive Darstellung

Im Vordergrund aller PWAs steht immer die Benutzerfreundlichkeit. Daher sind PWAs grundsätzlich responsiv und passen sich der Bildschirmgröße des jeweiligen Endgeräts automatisch an. PWAs werden im Fullscreen angezeigt, es gibt keinen sichtbaren Browserrahmen. So sehen PWAs immer wie native Apps aus. Auf allen Endgeräten sind PWAs so stets maßgeschneidert.

App auf den Homescreen

Gibt es etwas Neues? Hat sich etwas geändert? Gibt es einen dringenden Alert? In Native Apps sind Push-Benachrichtigungen elementarer Bestandteil. Eine Leiste am oberen Bildschirmrand informiert dabei über Neuigkeiten und „pusht“ andere aktuelle Informationen. Der Service Worker der PWAs kann das auch – mit PWAs erhalten Userinnen und User Updates direkt auf den Homescreen. Die PWA selbst kann ganz einfach über „Add-to-Homescreen“auf den Startbildschirm gepinnt werden. So ist die PWA nicht mehr von einer nativen App zu unterscheiden.

Welche Anforderungen muss eine PWA erfüllen?

  • Progressiv: Die PWA muss für alle auf allen Browsern funktionieren.
  • Responsiv: Die PWA muss sich an jeden Bildschirm anpassen.
  • Offline: Die PWA muss auch offline funktionieren (teilweise).
  • App-ähnlich: Die PWA muss sich wie eine App „anfühlen“.
  • Aktuell: Die PWA muss immer auf dem neuesten Stand sein.
  • Sicher: Die PWA muss (!) HTTPS für erhöhte Sicherheit verwenden.
  • Auffindbar: Die PWA wird von Suchmaschinen gefunden.
  • Kundenbindung: Erneute Verwendung durch Push-Nachrichten.
  • Installierbar: PWAs können auf den Startscreen gepinnt werden.
  • Verlinkbar: PWAs lassen sich via URL teilen und verbreiten.

Was sind die Vor- und Nachteile?

Vorteile von PWASNachteile von PWAs
Programmierung weniger aufwendig und kostenintensiv bei ähnlich guter Performance wie native Apps.Planungshorizont: PWA-Format befindet sich immer noch in der Entwicklung.
Gleichzeitig Webauftritt und plattformunabhängige App, die unverbindlich ausprobiert werden kann.Kompatibilität: Nicht alle Browser unterstützen PWAs im vollen Umfang.
PWAs sind sofort verfügbar und müssen nicht installiert werden, sie benötigen kaum Speicherplatz und nur wenige Ressourcen..App Drawer: Keine klassische Integration im App Drawer des Geräts möglich.
PWAs können auf native Funktionen zugreifen: Geolokalisierung, Kamera, Push-Nachrichten, Mikrofon, Lage und Bewegung des Geräts.Funktionsumfang dennoch eingeschränkt: Kein Zugriff auf Kontakte, Kalender, Bluetooth, NFC. PWAs werden wohl nie auf alle Funktionen des Smartphones zugreifen können.
PWAs benötigen keinen App-Store und kein „Öko-System“.Apple zögert: iOS-Geräte unterstützen die Technik (noch) nicht umfassend.
PWAs sind ein offener, von Google unterstützter Standard.Markterfolg: Es ist ungewiss, ob sich PWAs langfristig durchsetzen werden.
Vor- und Nachteile von PWAs

Wann lohnt sich eine PWA?

Kostenlos: Mit der Nutzung der App wird kein Geld verdient.
Schneller Zugriff: Die Nutzer möchten die Inhalte schnell lesen.
Vertriebskanal: Die Inhalte werden auf dem Blog aktualisiert.
Internetzugang: Die Nutzer haben kein Breitband-Internet.
Suchmaschine: Die App soll über Google gefunden werden.
Direktansprache: Die App kann Push-Nachrichten senden.
Schnelle Updates ohne den Review-Prozess eines App Stores.
Android: Apple sperrt sich (noch) ein wenig gegen PWAs.

https://developers.google.com/web/showcase/

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht.

you're currently offline

Scroll to Top