pwa eg

01 Progressive Web App (PWA)

Eine Progressive Web App (PWA) ist eine Website, die zahlreiche Merkmale besitzt, die bislang nativen Apps vorbehalten waren. Sie kann daher auch als Symbiose aus einer responsiven Webseite und einer App beschrieben werden.

Progressive Web Apps können wie eine Webseite mit HTML5, CSS3 und JavaScript erstellt werden. Sie verhalten sich aber wie eine App, uns lassen sich genau wie eine App bedienen. Sie sind nach dem Installieren auch OFFLINE nutzbar!

Progressiv (logisch) – Die Apps müssen für jeden Benutzer funktionieren, unabhängig vom verwendeten Browser.
Responsiv – Sie müssen auf jeden Bildschirm passen: Desktop, Smartphone oder Tablet.
Offline-Funktionen – Es muss möglich sein, sie offline zu öffnen.
App-ähnlich – Sie müssen sich wie eine App anfühlen, was Interaktion und Navigation betrifft.
Aktuell – Sie müssen immer auf dem neuesten Stand sein (ohne manuelle Updates).
Sicher – Sie müssen HTTPS für erhöhte Sicherheit verwenden.
Installierbar – Benutzer sollten Apps, die sie besonders nützlich finden, auf ihrem Startbildschirm "behalten" können, ohne einen App Store aufsuchen zu müssen.
Verlinkbar – Sie müssen sich via URL leicht verbreiten lassen.

Kamera

Bitte Kamera auswählen!

Beim Iphone Kammera Zugriff gererell erlauben. Dann zusätzlich oben Links auf "AA", "Webseiten Einstellung" Zugriff auf Kamera für diese Webseite erlauben anwählen.

Beispiel: Website Settings for nytimes.com

OpenStreetMap

Karte von Gau-Weinheim, fest eingestellte Koordinaten.

Lat:49.84586

Lon:8.04887

openstreetmap.org lat:49.84586 lon=8.04887 zoom=15

nominatim.openstreetmap.org/reverse lat:49.84586 lon=8.04887 zoom=15

OpenStreetMap.org ist ein im Jahre 2004 gegründetes internationales Projekt mit dem Ziel, eine freie Weltkarte zu erschaffen. Dafür sammeln wir weltweit Daten über Straßen, Eisenbahnen, Flüsse, Wälder, Häuser und vieles mehr.

OpenStreetMap

Karte, Position ermittelt über die Client IP Adresse.

Ipv4

Ipv6

lon

lat

dist

Audio

Hier ein Audio File !

Favicon 32x32.png

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis sequi earum expedita perspiciatis necessitatibus, harum. Dolorem culpa vero mollitia voluptatum, doloremque, tempore magnam, sunt nemo voluptatem dolores quas minima voluptate!

Video

Hier ein Video vom VG Weinfest 2003 !

Five Text Items below!

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis sequi earum expedita perspiciatis necessitatibus, harum. Dolorem culpa vero mollitia voluptatum, doloremque, tempore magnam, sunt nemo voluptatem dolores quas minima voluptate!

Safari-Mac-BL-512.svg

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis sequi earum expedita perspiciatis necessitatibus, harum. Dolorem culpa vero mollitia voluptatum, doloremque, tempore magnam, sunt nemo voluptatem dolores quas minima voluptate!

MS-icon-270x270.png

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis sequi earum expedita perspiciatis necessitatibus, harum. Dolorem culpa vero mollitia voluptatum, doloremque, tempore magnam, sunt nemo voluptatem dolores quas minima voluptate!