Ultimamente en los logs de mi servidor venía encontrando errores 404 (página no encontrada) en dos archivos:
apple-touch-icon.png y apple-touch-icon-precomposed.png
Pero ¿quién los pide y qué son?
Pues son archivos solicitados por el navegador del Iphone (Safari), si los encuentra los utiliza en el menú típico del Iphone y consiste en una imagen en formato «.png».
¿Cómo creo mi propio Apple Touch Icon?
Muy fácil, con cualquier editor de imágenes (Photoshop o Gimp) creas un nueva imagen de 57 x 57 px y le añades los elementos que definan a tu página (el logo, colores corporativos, etc…) y lo guadas como «apple-touch-icon.png«. Tan sólo queda subirlo a la raiz de tu web, al ladito del index. No hay que preocuparse por redondear las esquinas de la imagen o darle el efecto típico de los botones del Iphone, el propio teléfono lo hace al mostrarlo en el menú.
![]()
¿Y si quiero darle mi propio efecto?
Igual que en el paso anterior solo que al guardarlo has de hacerlo como «apple-touch-icon-precomposed.png«, de esta manera el Iphone mostará el icono tal cual sin modificarlo ni darle efectos. También puedes poner otro nombre al archivo o guardarlo en otro directorio, para ello añade esta línea de código en el «<head>» de tu página.
<link rel="apple-touch-icon" href="/icono-para-iphone.png"/>
Deja una respuesta