Como crear un icono de tu sitio web para iPhone e iPod Touch

¿Quién no conoce esos hermosos iconos que popularizo tanto el iPhone como el iPod Touch? Lo que muchos no saben es que se puede crear de forma muy simple un botón de nuestro blog o sitio web, para que las personas, que así lo desean, puedan colocarlo de forma automática en su iPhone e iPod Touch y utilizarlo como un acceso directo.

Si no tienes ni un iPhone ni un iPod no te preocupes, no es necesario para hacer este pequeño tutorial, y el resultado será como se ve a continuación en donde se encuentran los iconos de Kabytes y el de Touching Apps.

iconos iphone web

¿Queda lindo verdad? Para el que no lo conoce esto aparece cuando las personas desean añadir nuestro sitio web a la página de inicio del iPhone e iPod Touch.

Bueno, empecemos.

Crear el icono

1. Para esto nos valemos de cualquier editor de imágenes, la imagen debería ser de100px x 100px en 72 dpi. Es conveniente que los colores estén seteados en RGB.

2. Guardamos la imagen preferentemente en formato PNG que es el que presenta mejor relación peso/calidad, además de ser el recomendado por Apple.

diseno icono

Aclaración importante: No es necesario que nuestro icono tenga la forma del clásico icono de Apple, es decir con puntas redondeadas, podemos hacer una imagen cuadrada y casi de forma mágica el dispositivo le dará la forma y brillo necesario para que no quede fuera de lugar junto a otros iconos.

Subir el icono

3. Ahora basta con subir el archivo con nombre: apple-touch-icon.png todo en minúsculas y exactamente como está escrito. Debemos subirlo al directorio raíz de nuestro servidor, es decir donde encontramos por ejemplo en el caso de tratarse de un blog deWordPress el archivo index.php y wp-config.php entre otros.

Como crear un icono de tu sitio web para iPhone e iPod Touch

, , , ,
Entrada anterior
Archy + Google Docs
Entrada siguiente
Activar inspector de código en Safari

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Rellena este campo
Rellena este campo
Por favor, introduce una dirección de correo electrónico válida.
Necesita estar de acuerdo con los términos para continuar

Menú