Quando os usuários do Safari para iOS adicionam apps da Web progressivos (PWAs, na sigla em inglês) às
telas iniciais, o ícone que aparece é chamado de ícone do Apple Touch.
É possível especificar qual ícone o app vai usar incluindo uma
tag <link rel="apple-touch-icon" href="/example.png"> no <head> da
página. Se a página não tiver essa tag de link, o iOS vai gerar um ícone fazendo uma captura de tela do
conteúdo da página. Em outras palavras, instruir o iOS a fazer o download de um ícone resulta em uma experiência
mais refinada para o usuário.
Como a auditoria de ícone de toque da Apple no Lighthouse falha
O Lighthouse
sinaliza páginas sem uma tag <link rel="apple-touch-icon" href="/example.png">
no <head>:
O Lighthouse não verifica se o ícone realmente existe ou se ele tem
o tamanho correto.
Como adicionar um ícone do Apple touch
Adicione <link rel="apple-touch-icon" href="/example.png"> ao <head> da sua página:
[[["Fácil de entender","easyToUnderstand","thumb-up"],["Meu problema foi resolvido","solvedMyProblem","thumb-up"],["Outro","otherUp","thumb-up"]],[["Não contém as informações de que eu preciso","missingTheInformationINeed","thumb-down"],["Muito complicado / etapas demais","tooComplicatedTooManySteps","thumb-down"],["Desatualizado","outOfDate","thumb-down"],["Problema na tradução","translationIssue","thumb-down"],["Problema com as amostras / o código","samplesCodeIssue","thumb-down"],["Outro","otherDown","thumb-down"]],["Última atualização 2024-04-16 UTC."],[],[]]