Cuando los usuarios de Safari para iOS agregan apps web progresivas (PWAs) a sus pantallas principales, el ícono que aparece se denomina ícono táctil de Apple.
Para especificar qué ícono debe usar tu app, incluye una etiqueta <link rel="apple-touch-icon" href="/example.png"> en el <head> de tu página. Si tu página no tiene esta etiqueta de vínculo, iOS genera un ícono tomando una captura de pantalla del contenido de la página. En otras palabras, si le indicas a iOS que descargue un ícono, se obtendrá una experiencia del usuario más refinada.
Cómo falla la auditoría del ícono táctil de Apple de Lighthouse
Lighthouse marca las páginas sin una etiqueta <link rel="apple-touch-icon" href="/example.png"> en <head>:
Lighthouse no verifica si el ícono existe realmente o si tiene el tamaño correcto.
Cómo agregar un ícono táctil de Apple
Agrega <link rel="apple-touch-icon" href="/example.png"> al <head> de tu página:
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Falta la información que necesito","missingTheInformationINeed","thumb-down"],["Muy complicado o demasiados pasos","tooComplicatedTooManySteps","thumb-down"],["Desactualizado","outOfDate","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Problema con las muestras o los códigos","samplesCodeIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 2024-04-16 (UTC)"],[],[]]