Richtlinien für Web-Apps und HTML-Inhalte

Präsentieren Sie Ihre Inhalte auf eindrucksvolle Weise, die Kunden und Interessenten begeistert. Durch die Entwicklung interaktiver HTML5-Web-Apps für Showpad können Sie Vertriebsmitarbeitende und deren Interessenten effektiv durch ansprechende Präsentationen führen. Damit Ihre HTML5-Inhalte optimal in Showpad funktionieren, befolgen Sie diese wichtigen Richtlinien.

Wichtigste Vorteile

• Individuell angepasste HTML-Web-Apps, die auf spezifische Verkaufsszenarien zugeschnitten sind
• Begeistern Sie Kunden und Interessenten mit interaktiven Inhalten
• Plattformübergreifende Kompatibilität, um nahtlos auf verschiedenen Geräten und Plattformen zu arbeiten
• Offline-Zugriff, wenn alle notwendigen Ressourcen in der App enthalten sind,

Sie benötigen dies, um erfolgreich zu sein

Der schnelle Weg zur Faszination

1. Verwenden Sie HTML5 mit JavaScript und CSS; serverseitige Sprachen (z. B. .NET, PHP oder Ruby) werden nicht unterstützt.
2. Stellen Sie plattformübergreifende Kompatibilität sicher, indem Sie ein responsives Design verwenden.
3. Für die Offline-Nutzung fügen Sie alle benötigten Ressourcen in die ZIP ein.
4. Vermeiden Sie die Verwendung von iFrames und bevorzugen Sie stattdessen HTTPS-Links.
5. Vermeiden Sie Leerzeichen in Datei- und Ordnernamen.
6. Beachten Sie die Speicherbegrenzungen von Mobilgeräten
7. Befolgen Sie die W3C-Best Practices für die Entwicklung von Web-Apps
8. Komprimieren Sie die App-Dateien in eine ZIP file mit `index.html` im Stammverzeichnis.
9. Laden Sie Ihre .zip-Datei in Ihre Showpad Library hoch

Dinge, die Sie beachten sollten

• Allgemeine Hinweise
• In Showpad hochladen
• Offline-Nutzung
• Statistische Daten
• Plattformübergreifende Kompatibilität
• Showpad Navigation & JS-Funktionen
• Lokaler Speicher
• Verknüpfung
• Bewährte Methoden

Allgemeine Hinweise

Es ist wichtig zu wissen, dass Showpad nur HTML5-Web-Apps unterstützt, die JavaScript, CSS, HTML, Bilder und ähnliche Technologien verwenden. Dynamische Programmiersprachen wie Ruby, PHP und .NET sind nicht kompatibel, da sie serverseitige Verarbeitung erfordern.

Außerdem wird Flash aufgrund seiner veralteten Technologie nicht vollständig unterstützt, was zu Anzeigeproblemen führen kann.

So bereiten Sie Ihre Web App für das Hochladen auf Showpad vor:

1. Stellen Sie sicher, dass die Haupt-HTML-Datei "index.html" heißt und sich im Stammverzeichnis befindet. Beachten Sie, dass das Vorschaubild weiß ist, wenn die index.html-Datei leer ist. Um dies zu vermeiden, fügen Sie ein Ladebildschirm-Bild ein, das in den ersten Millisekunden sichtbar ist.
2. Kompremieren Sie alle Dateien der App in eine ZIP file. Stellen Sie sicher, dass Sie alle notwendigen Dateien (JavaScript, CSS, Bilder) einschließen, damit die App reibungslos funktioniert, auch offline.
3. Wenn Sie bereit sind, laden Sie die .zip-Datei in Ihre Showpad Library hoch. Lesen Sie hier mehr darüber, wie das funktioniert.

Sobald die .zip-Datei in Showpad hochgeladen wurde, entpacken wir die Datei, erstellen ein Vorschaubild und machen sie einsatzbereit.

Sie können Web-Apps in Showpad auch ohne Internetverbindung ausführen, solange das ZIP-Archiv alle notwendigen Ressourcen enthält.

• Showpad – Entwickler können die Nutzung von Showpad über die trackEvent-Funktion des SDKs nachverfolgen.
• Google – Allgemeine Informationen finden Sie auf der Entwicklerseite von Google.
  • Google Analytics - Um die Nutzung von HTML5-Apps in der Showpad Web App zu verfolgen, können Sie Google Analytics für detaillierte Einblicke integrieren. Stellen Sie sicher, dass alle Inhalte über HTTPS angefordert werden, da die Verwendung von HTTP-Skripten das Laden der App in den meisten Browsern verhindern kann.
    Um Google Analytics in HTML5-Apps sowohl für die Web App als auch für mobile Apps zu aktivieren, gehen Sie wie folgt vor:
    

    // 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.

  • JavaScript-Tagging – Sie können auch den gtag.js-Dienst von Google verwenden.

Showpad unterstützt den Zugriff über iOS, Android, Webbrowser und Windows, weshalb ein responsives Design unerlässlich ist, um die Kompatibilität auf verschiedenen Bildschirmgrößen sicherzustellen.

• Die Standard-Webbrowser, Safari und Chrome, werden auf iOS und Android verwendet, während die Showpad Web-Plattform mit Edge, Chrome, Safari und Firefox kompatibel ist.
• Die Windows Desktop-App enthält ein WebView2-Steuerelement, sodass die Ausführung von HTML-Inhalten in der Windows-App mit der Erfahrung in Webbrowsern übereinstimmt. Es gibt keine Unterschiede zwischen der App und dem Browser bei der Darstellung von HTML-Inhalten.

• Navigation – Auf iOS befindet sich oben links eine Schaltfläche, mit der Nutzer auf die Showpad-Navigation zugreifen und die Web App verlassen können. Um Konflikte zu vermeiden, sollte dieser Bereich innerhalb der Web App frei von interaktiven Elementen oder Aktionsschaltflächen gehalten werden.
• JS-Funktionen – Dieser Artikel bietet einen vollständigen Überblick über die JavaScript-Funktionen, die wir für HTML-Inhalte anbieten.

Sie können den lokalen Speicher nutzen, um den Zustand einer Web App zu bewahren. So können Ihre Nutzer die App verlassen und später zurückkehren, ohne ihren vorherigen Zustand zu verlieren. Dazu gehört das Speichern von Details wie einem ausgefüllten Formular, der gewählten Sprache und anderen Einstellungen.

• Assets – Verwenden Sie das Tag für Asset-Links in der Showpad Web App. Beachten Sie, dass Asset-Links das „showpad://“-Protokoll verwenden (z. B. showpad://file/{assetSlug}).
• Hyperlinking – Verwenden Sie unbedingt die -Tag-Methode für Hyperlinks in der Showpad Web App. Hyperlinks werden ausschließlich über das HTTPS-Protokoll geladen.
  Siehe außerdem den Abschnitt "Statistische Daten" bezüglich JavaScript-Quellen, wenn Sie auf externe Seiten verlinken.
• Interne Links – Beim Erstellen Ihrer HTML5-Datei sollten Sie beachten, dass Sie für interne Links keine iFrames verwenden können, da diese auf dem iPad nicht funktionieren.
  
  

Hinweis: Standardmäßig haben Angular-Apps ein in der index.html. Sie sollten dies in ändern, um sicherzustellen, dass Ihre Dateien korrekt geladen werden.