Web-apps und HTML-Inhaltsrichtlinien

Sie können Ihre Inhalte auf fantastische Weise präsentieren, um Kunden und Interessenten wirklich zu beeindrucken. Durch die Erstellung interaktiver HTML5-Web-apps für Showpad können Sie Ihre Vertriebsmitarbeiter und ihre potenziellen Kunden auf interaktive Weise anleiten. Für die optimale Nutzung dieser HTML5-Inhalte in Showpad sollten Sie die folgenden Richtlinien befolgen.

Sehen Sie sich ein Beispiel an

Hauptvorteile

• Erstellen Sie maßgeschneiderte HTML-Webapps, die Ihren Verkaufsanforderungen entsprechen.
• Beeindrucken Sie Kunden und Interessenten
• Erstellen Sie interaktive Tutorials und Gespräche
• Es funktioniert plattformübergreifend
• Verwenden Sie die App offline, wenn alle Ressourcen im Archiv verfügbar sind

Sie benötigen dies, um erfolgreich zu sein

• HTML5-Kenntnisse
• Inhalt zur Verwendung in Ihrer benutzerdefinierten Web-app
• Kenntnisse in der Verwendung von Javascript, CSS, Speicher und Bildbearbeitung
• Entwicklungstools, wie XCode (iOS), um die Speichernutzung Ihrer HTML-app zu überprüfen

Der schnelle Weg zur Faszination

• Es wird nur HTML5 mit Javascript, CSS und Bildern unterstützt
• Dynamische Programmiersprachen wie Ruby, PHP undNET werden nicht unterstützt
• Flash wird nicht auf allen Plattformen vollständig unterstützt und sollte vermieden werden
• Vermeiden Sie Leerzeichen in Datei- und Ordnernamen.
• Komprimieren Sie alle von der Web-app verwendeten Dateien in einer ZIP-Datei
• Legen Sie die index.html in den Stammordner der ZIP-Datei
• Verwenden Sie keine iFrames in Ihrer Anwendung
• Laden Sie Ihre HTML. zip-Datei in Ihre Showpad-Bibliothek hoch
• Wir empfehlen die Verwendung von HTTPS in allen Hyperlinks
• Berücksichtigen Sie immer die Speichergrenzen von mobilen Geräten
• Siehe W3C Best Practices für die Entwicklung von Web-apps

Sehen Sie sich dies Schritt für Schritt an

Allgemeines

Es werden nur HTML5-Web-apps (mit Javascript, CSS, HTML, Bildern, ...) unterstützt. Dynamische Programmiersprachen wie Ruby, PHP, NET usw. erfordern eine spezielle Serversoftware und können nicht in der Showpad-app ausgeführt werden.
Flash wird nicht vollständig unterstützt, da es sich um eine ältere Technologie handelt, was dazu führen kann, dass die Seiten nicht wie erwartet angezeigt werden.

Um Ihre Web-app für Showpad vorzubereiten, komprimieren Sie alle Dateien der App in eine .ZIP-Datei und stellen Sie sicher, dass sich eine index.html-Datei im Stammverzeichnis befindet. Die „Haupt“-HTML-Datei sollte also „index.html“ heißen. Showpad entpackt die ZIP-Datei und verarbeitet die Web-app, um ein Vorschaubild zu erstellen und es für unsere Appsbereitzustellen. Die Miniaturansicht ist weiß, wenn die Datei index.html leer ist. Sie können dieses Problem lösen, indem Sie ein Bild in das HTML-Content-Paket aufnehmen, das die ersten paar Millisekunden sichtbar ist, wie ein Ladebildschirm, und dann für den eigentlichen Inhalt umgeschaltet wird. Wir raten Ihnen, alle von der App verwendeten Dateien (Javascript, CSS, Bilder, ... ) in die .ZIP-Datei einzuschließen, damit die App auch bei bestehender Internetverbindung ordnungsgemäß ausgeführt werden kann.

Wenn Sie fertig sind, laden Sie Ihre HTML-.ZIP-Datei in Ihre Showpad-Bibliothek hoch! Lesen Sie hier mehr darüber, wie das geht.

Es ist möglich, Web-apps innerhalb von Showpad auszuführen, auch wenn keine Internetverbindung besteht. Die Voraussetzung dafür ist, dass alle Ressourcen im Zip-Archiv vorhanden sind.

Um nützliche Statistiken über die Nutzung von HTML5-Apps in der Showpad-Web-app zu sehen, können Sie Google Analytics verwenden, um Ihnen leistungsstarke Einblicke zu geben. HTML-Inhalte werden über HTTPS angefordert. Achten Sie also darauf, dass Sie nicht HTTP als Quellskript verwenden, da die App sonst in den meisten Browsern nicht korrekt geladen wird.

Damit Google Analytics in HTML5-apps sowohl auf der Web-app als auch auf unseren Handy-apps funktioniert, müssen Sie Folgendes tun:

// Erstellen Sie den Tracker
ga(„erstellen“, „UA-ABCDE123465-1“, „auto“);

// Lassen Sie den Tracker das Protokoll nicht überprüfen.
ga(„einstellen“, „checkProtocolTask“, null);

// Lassen Sie den Tracker den Speicher nicht überprüfen.
ga(„einstellen“, „checkStorageTask“, null);

// Lassen Sie den Tracker den Verlauf nicht überprüfen.
ga(„einstellen“, „historyImportTask“, null);
ga(„senden“, „Seitenansicht“, „/über“);

Hinweis: Ändern Sie die UA ID mit der Immobiliennummer Ihres Unternehmens.

Sie können auch den Dienst gtag.js von Google verwenden. Wenn Sie mehr darüber erfahren möchten, finden Sie die Informationen hier:

• So verwenden Sie den globalen Website-Tag (gtag.js)
• Wie man von analytics.js zu gtag.js wechselt.

Allgemeine Informationen finden Sie auf der Entwicklerseite von Google.

• Auf Showpad können Sie über iOS, Android, Browser und Windows (8.1+) zugreifen. Das bedeutet, dass die Web-app für verschiedene Bildschirmgrößen geeignet sein sollte. Daher ist es eine gute Idee, ein reaktionsfähiges Design zu verwenden. Die verwendeten Technologien sollten zu diesen Geräten passen. Auf iOS/Android verwenden wir das Standard-Webkit (Safari/Chrome). Showpad Web unterstützt Edge, Chrome, Safari und Firefox. Für spezielle Windows-Richtlinien klicken Sie bitte hier.
• Das domänenübergreifende Laden von Javascript kann Probleme verursachen. Abhilfe prüfen.

Unter iOS gibt es oben links ein Symbol, mit dem Sie die Showpad-Navigation zum Verlassen der Web-app aktivieren können. Das bedeutet, dass dieser Platz für diese Schaltfläche reserviert werden sollte, und nicht für Aktionsobjekte der Web-app selbst.
In diesem Artikel finden Sie den vollständigen Bericht über die js-Funktionen, die wir für HTML-Inhalte anbieten.

Wenn Sie Ihre HTML5-Datei entwickeln, sollten Sie daran denken, dass Sie iFrames nicht für interne Links verwenden können, da diese auf iPad nicht funktionieren werden.

• Webview-Element.
  Bei der Erstellung von HTML-Inhalten, auch bekannt als Web-apps, die in der Showpad-Windows-app verwendet werden, sollten Sie Folgendes beachten: Die Windows Store-app verwendet das Webview-Element (https://msdn.microsoft.com/en-us/library/windows/apps/dn301831.aspx), um die HTML-app anzuzeigen.
  Unter Windows 10können einige JS-Funktionen blockiert sein! Überprüfen Sie Ihre Protokolle, um sicherzustellen, dass sie genügend Berechtigungen haben, um ausgeführt zu werden.
  
  Die vollständige App wird zunächst auf das Gerät heruntergeladen und dann mit dem Protokoll ms-local-stream von der Festplatte geladen, so dass alle URIs mit ms-local-stream:// beginnen. Wenn Sie Angular verwenden, müssen Sie sicherstellen, dass Angular dieses Protokoll in seinem Compile-Provider als sicheres Protokoll behandelt. Wenn Sie dies nicht tun, wird Angular diese URIs als unsicher behandeln und ihnen das Präfix „unsicher:“ voranstellen, was dazu führt, dass das Webview-Element nicht in der Lage ist, das angeforderte Element zu laden.
• Touch-Events
  In diesem Blog finden Sie weitere Informationen darüber, was Sie bei Touch-Ereignissen für Metro Mode unter Windows beachten müssen.

Für die Verwendung in der Showpad Web-app verwenden Sie bitte die  Tag-Methode für Asset-Links.

Für die Verwendung in der Showpad Web-app verwenden Sie bitte die  Tag-Methode für Hyperlinks.
Denken Sie auch daran, dass Showpad Inhalte über das https-Protokoll lädt und dass Hyperlinks ebenfalls über https geladen werden müssen.
Denken Sie auch an Abschnitt 2 über die Skript-Quelle, wenn Sie auf externe Seiten verlinken.