apple-mobile-web-app-capable e Meta Tags de Web App do iOS
apple-mobile-web-app-capable é uma meta tag que diz ao iOS para lançar o seu site em tela cheia, sem a interface do Safari, quando ele é aberto a partir da tela inicial. Ela funciona em conjunto com apple-mobile-web-app-status-bar-style para colorir a barra de status e apple-mobile-web-app-title para definir o nome. O iOS moderno cada vez mais lê o modo de exibição do manifest, mas essas tags continuam sendo a rota confiável no Safari.
Fazer um atalho de tela inicial se comportar como um app
Com apple-mobile-web-app-capable definido como yes, um site aberto a partir da tela inicial do iOS é lançado em tela cheia, standalone, sem a barra de ferramentas do Safari. apple-mobile-web-app-status-bar-style então controla a barra de status (default, black ou black-translucent), e apple-mobile-web-app-title define o rótulo sob o ícone.
Elas só entram em vigor quando o site é lançado a partir da tela inicial. Em uma aba normal do Safari, não fazem nada.
As meta tags de web app do iOS
<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" />Perguntas frequentes sobre meta de web app do iOS
O que apple-mobile-web-app-capable faz?
Faz um site ser lançado em tela cheia, sem a interface do Safari, quando aberto a partir da tela inicial do iOS. Não tem efeito em uma aba normal do navegador.
O que black-translucent faz na barra de status?
Permite que a sua página desenhe por trás da barra de status, que então flutua sobre o seu conteúdo em branco. Você precisa adicionar um espaçamento superior por conta própria, ou a barra de status vai se sobrepor ao seu cabeçalho.
Ainda preciso dessas tags com um manifest?
Cada vez menos. "display": "standalone" no manifest cuida do lançamento em tela cheia. Mantenha as tags apple- para o iOS mais antigo e um controle mais fino da barra de status.