Wanneer iOS Safari-gebruikers Progressive Web Apps (PWA's) aan hun startschermen toevoegen, wordt het pictogram dat verschijnt het Apple Touch-pictogram genoemd. U kunt opgeven welk pictogram uw app moet gebruiken door een <link rel="apple-touch-icon" href="/example.png"> tag op te nemen in de <head> van uw pagina. Als uw pagina deze linktag niet heeft, genereert iOS een pictogram door een screenshot te maken van de pagina-inhoud. Met andere woorden: het instrueren van iOS om een pictogram te downloaden resulteert in een meer gepolijste gebruikerservaring.
Hoe de Lighthouse Apple-aanraakpictogramcontrole mislukt
Lighthouse markeert pagina's zonder een <link rel="apple-touch-icon" href="/example.png"> tag in de <head> :
Lighthouse controleert niet of het pictogram daadwerkelijk bestaat en of het pictogram de juiste grootte heeft.
Hoe u een Apple Touch-pictogram kunt toevoegen
Voeg <link rel="apple-touch-icon" href="/example.png"> toe aan de <head> van uw pagina:
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Translation issue","translationIssue","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-04-16 UTC."],[],[]]