Zur Suche springen Zur Navigation springen Zum Hauptinhalt springen Zum Footer springen

Seit dem Update auf iOS 6 stehen in Apples mobilem Betriebssystem die sog. „Smart App Banners“ zur Verfügung. Mit Hilfe eines solchen Banners kann im mobilen Safari auf eine App im App Store hingewiesen werden, was die Downloads spürbar erhöhen kann. Neben dem App-Icon werden innerhalb des Smart Banners der Titel, der Preis und die Bewertungen der Anwendung angezeigt. Ein Button führt den Anwender zum AppStore. Wenn die App bereits installiert ist, kann über den Button die Anwendung gestartet werden.

Schulungen von kulturbanause

Intensive Trainings mit hohem Praxisbezug.

Smart App Banners unter iOS 6+ einbinden

Wenn ihr einen Smart App Banner in eure Website integrieren wollt, so reicht ein simpler meta-Tag im head der Seite.

<meta name="apple-itunes-app" content="app-id=HIER_DIE_ID, affiliate-data=HIER_DIE_AFFILIATE_ID, app-argument=HIER_DIE_URL">

Drei Angaben sollten angepasst werden:

app-id
Hier muss die individuelle ID der App eingetragen werden. Die ID erfahrt ihr u.a. über den iTunes Link Maker. In der URL zum iTunes Store steht die ID zwischen /id und ?mt
affiliate-data (optional)
Wenn Ihr am iTunes Affiliate Programm teilnehmt, sollte hier die Partner-ID eingetragen werden
app-argument (optional)
Hier kann eine URL übergeben werden, die innerhalb der App auf eine bestimmte Position verlinkt. Wenn der Anwender die App bereits installiert hat, kann über einen Button diese Adresse direkt erreicht werden.

Nachdem der meta-Tag einbunden wurde, seht ihr unter iOS einen Banner in folgendem Stil.

Smart-App-Banner am Beispiel der App Air Navigation
Smart-App-Banner am Beispiel der App Air Navigation

Debugging unter iOS

Wenn der Banner nicht angezeigt werden sollte, prüft zunächst einmal folgende Punkte:

  • Besucht ihr die Website über iOS? (iPhone, iPad, iPod)
  • Ist mindestens iOS in Version 6 installiert?
  • Besucht ihr die Website mit dem Gerät für das die App auch entwickelt wurde? iPad-Apps werden nur auf dem iPad angezeigt, iPhone-Apps nur auf dem iPhone
  • Benutzt ihr Safari? Unter Fremdbrowsern funktionieren die Smart App Banner nicht

Smart App Banner für Android und Web-Apps

Wenn ihr die Smart App Banner auch für Android-Apps im Play Store oder für Web-Apps einsetzen möchtet, könnt ihr auf jQuery-Plugins zurückgreifen. Das folgende Script simulieren die Banner in den o.g. Systemen. Allerdings ist der Banner dann nicht mit dem App Store synchronisiert und muss inhaltlich manuell gepflegt werden. Übrigens werden mit dem „jQuery Smart Banner“ auch iOS 4 und iOS 5 unterstützt.

Native Lösung unter Android?

Soweit mir bekannt ist existiert keine native Lösung unter Android. Sollte es doch eine Möglichkeit geben Smart Banner unter Android einzusetzen oder sollte eine solche Lösung in Zukunft angeboten werden, bitte ich euch um einen entsprechenden Hinweis in den Kommentaren.

Links / Quellen

Geschrieben von Jonas

thumb

Jonas ist Gründer der Webdesign Agentur kulturbanause® und des kulturbanause® Blogs. Er übernimmt Projektleitung, Grafik sowie Frontend- und WordPress-Development und hat zahlreiche Fachbücher und Video-Trainings veröffentlicht. Als Dozent leitet er Schulungen und Workshops. Am liebsten beschäftigt er sich mit Projekten und Themen, die ihn gleichermaßen konzeptionell als auch gestalterisch und technisch fordern.

Seminare mit Jonas Hellwig anzeigenJonas Hellwig bei Xing

Feedback & Ergänzungen – 5 Kommentare

  1. Jörn
    schrieb am 14.06.2021 um 08:41 Uhr:

    Hello zusammen, bin gerade auf der Suche nach einer Antwort zu diesem Thema: Wird bei der Verwendung des Smart-App-Banner verschiedene Informationen z.B. User-IP oder User-Agent an Apple gesendet. Müsste man sowas dem Nutzer kundtun, falls es so wäre. Habe aber bisher nix gefunden…

    Danke für die Hilfe

    Antworten
  2. Ka
    schrieb am 02.06.2015 um 10:39 Uhr:

    Gibt es eine Möglichkeit den Banner wieder angezeigt zu bekommen, nachdem man ihn weggeklickt hat?

    Antworten
    • Johannes
      schrieb am 09.01.2018 um 16:41 Uhr:

      Versuche, deine Browserdaten zu löschen, vielleicht funktioniert das.

      Antworten
  3. CHris
    schrieb am 18.04.2013 um 13:09 Uhr:

    Super! War schon auf der Suche danach :)
    Immer gutes Timing! :)

    Antworten
  4. Marcel
    schrieb am 18.04.2013 um 09:22 Uhr:

    Hallo,

    Danke für den Tipp, klappt super!

    Für Chrome unter iOS gibt es so etwas nicht?!

    Beim ReLoad der Seite oder Neustart von Safari wird der Banner nicht angezeigt … eigentlich ganz gut.

    Antworten

Kommentar zu dieser Seite

Wir freuen uns über Anregungen, Ergänzungen oder Hinweise zu Fehlern. Wir lesen jeden Eintrag, veröffentlichen aber nur, was den Inhalt sinnvoll ergänzt.

Website-Projekte mit kulturbanause

Wir wissen wovon wir reden. Wir realisieren komplette Projekte oder unterstützen punktuell in den Bereichen Design, Development, Strategy und Content.

Übersicht Kompetenzen →

Schulungen von kulturbanause

Wir bieten Seminare und Workshops zu den Themen Konzept, Design und Development. Immer up-to-date, praxisnah, kurzweilig und mit dem notwendigen Blick über den Tellerrand.

Übersicht Schulungsthemen →