apple-mobile-web-app-capable & iOS-Web-App-Meta-Tags
apple-mobile-web-app-capable ist ein Meta-Tag, das iOS anweist, deine Website im Vollbild ohne Safaris Chrome zu starten, wenn sie vom Home-Bildschirm geöffnet wird. Es arbeitet mit apple-mobile-web-app-status-bar-style zusammen, um die Statusleiste einzufärben, und mit apple-mobile-web-app-title, um den Namen zu setzen. Modernes iOS liest zunehmend stattdessen den Anzeigemodus des Manifests, aber diese Tags bleiben der zuverlässige Weg auf Safari.
Eine Home-Bildschirm-Verknüpfung wie eine App verhalten lassen
Mit apple-mobile-web-app-capable auf yes startet eine vom iOS-Home-Bildschirm geöffnete Website im Vollbild, eigenständig, ohne Safari-Toolbar. apple-mobile-web-app-status-bar-style steuert dann die Statusleiste (default, black oder black-translucent), und apple-mobile-web-app-title setzt die Beschriftung unter dem Icon.
Diese greifen nur, wenn die Website vom Home-Bildschirm gestartet wird. In einem normalen Safari-Tab tun sie nichts.
Die iOS-Web-App-Meta-Tags
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="My App" />FAQ zu iOS-Web-App-Meta
Was tut apple-mobile-web-app-capable?
Es lässt eine Website im Vollbild ohne Safaris Chrome starten, wenn sie vom iOS-Home-Bildschirm geöffnet wird. In einem normalen Browser-Tab hat es keine Wirkung.
Was macht black-translucent mit der Statusleiste?
Es lässt deine Seite hinter die Statusleiste zeichnen, die dann in Weiß über deinem Inhalt schwebt. Du musst selbst oben Abstand hinzufügen, sonst überlappt die Statusleiste deinen Header.
Brauche ich diese Tags mit einem Manifest noch?
Zunehmend weniger. "display": "standalone" im Manifest übernimmt den Vollbildstart. Behalte die apple-Tags für älteres iOS und feinere Statusleisten-Steuerung.