Cómo instalar un icono de tu blog tipo app en el móvil

Hola! ¿qué tal va todo? estoy encantada de que Jessica me haya dado la oportunidad de escribir en su blog, para compartir contigo una manera sencilla de crear un icono de tu blog en la pantalla del móvil.

Cada vez estamos más digitalizados: ya somos 22,2 millones de españoles los que accedemos diariamente a la red y según el último informe de La Sociedad de la Información en España, el móvil ha conseguido superar al ordenador a la hora de acceder a Internet. Concretamente, un 88,3% de usuarios prefieren consumir los contenidos desde su smarthphone, frente al 78,2% que lo hace desde el PC.

La verdad es que no es de extrañar, que debido al acelerado ritmo de vida que llevamos (la mayoría) nos decantemos por el dispositivo que nos facilita acceso prácticamente desde cualquier lugar, aunque yo te confieso que sigo prefiriendo la comodidad y la experiencia de navegación que te da la pantalla y el teclado, pero hay que adaptarse a los tiempos ¡no queda otra!

Así que, con este panorama es importante que la navegación de nuestros lectores sea lo más confortable posible para que no tengan problemas en repetir la visita una y otra vez.

¿Y cómo? pues para empezar adaptando nuestro blog o web a vista móvil y ya de paso, si los sorprendes contándoles cómo crear un acceso directo a tu blog en su pantalla de inicio, pues mejor que mejor, porque te tendrán a un clic. Si no conocías este truco, vas a alucinar con lo fácil que es.

Vamos al lío!

Cómo incluir un acceso directo de mi blog en el móvil

 Dirígete a la página o blog que quieras añadir, a través del buscador.

 Una vez la tengas en pantalla, pulsa en las opciones de vista y selecciona «Añadir a pantalla de inicio»

Y ya lo tienes, así de sencillo! Pero espera un momentín, no corras que ya te veo con el dedito buscando las opciones, para poner tu blog con acceso directo y tengo que contarte otro truquillo para que te salga super profesional y puedas presumir de él. Si no has podido esperar y ya lo has hecho, seguramente te habrá aparecido un icono impersonal con la inicial de tu blog, que no se parece en nada a tu logotipo.

Pero podemos escoger cómo queremos que aparezca ese icono, para que se identifique al 100% con nuestra marca, así que allá vamos. Si quieres verlo en vídeo, porque te resulta más sencillo aquí lo tienes con minitutorial incluido, para hacerlo tanto en Pixlr.Editor como en Photoshop. Y si prefieres leerlo, bajo el vídeo te lo cuento con detalle:

 Diseña el icono que quieres que aparezca en un tamaño de 100x100px. Si ya tienes logo, lo único que tendrás que hacer es guardar la imagen redimensionada a ese tamaño. Puedes usar cualquier programa de edición, aunque si te interesa que se guarde con fondo transparente, lo mejor es usar Pixlr.Editor o Photoshop.

 Una vez que has diseñado tu icono, si tu blog está en Blogger, tendrás que subirlo a un alojador de imágenes para extraer la dirección de tu imagen. Para esto, yo uso Tinypic, pero puedes escoger el mismo editor de Blogger, lo que te resulte más sencillo.

 Ahora toca instalar un pequeño código en plantilla o un plugin (según la plataforma que tengas) para que cualquiera que añada tu blog a su pantalla de inicio, visualice el icono que has creado para la ocasión. Hay 2 formas de hacerlo, según si eres de Blogger o de WordPress.

Personalizar un icono tipo app para Blogger

 Dirígete a Plantilla>Editar HTML (recuerda hacer previamente una copia de seguridad)

 Haz clic con el ratón dentro de la plantilla y presiona Ctrl+F para que te salga la caja de búsqueda. Pega </head> y pulsa intro.

 Justo encima, añade este código:

<link rel=»apple-touch-icon-precomposed» href=DIRECCIÓN DE TU IMAGEN» />

 Sustituye la frase DIRECCIÓN DE TU IMAGEN por la dirección de tu icono (respeta las comillas) y guarda los cambios. A partir de ahora, cada vez que alguien guarde tu blog, como acceso directo en su móvil, aparecerá tu flamante icono.

Personalizar un icono tipo app para WordPress

 Instala el plugin All in one favicon

 Cuando lo tengas instalado y activado, dirígete a Ajustes, abre el plugin y sube el icono en la configuración de portada y en la parte de atrás como ves en la imagen:

 Guarda los cambios y listo!

¿Ya lo tienes? pues ahora es el momento de que se lo cuentes al mundo para que te tengan 100% accesible en su móvil. No esperes más para gritarlo a los cuatro vientos:

[piopialo vcboxed=»1″]Ya puedes tener acceso directo a mi blog desde tu móvil. Es súper fácil, ¡descubre cómo, aquí![/piopialo]

¿Te ha gustado? me encantaría que me contaras que te ha parecido ¿conocías ya este truco? ¿qué editor usas para tus presentaciones? ¿has añadido algún blog favorito a tu pantalla móvil? (aparte del tuyo, claro está) 

Que tengas un gran día!