Como crear un favicon para tu blog

Te explicamos cómo crear un favicon para tu blog, de modo rápido y sencillo, utilizando la aplicación web Favicon Generator, de ionos.es

Tabla de Contenidos

¿Qué es un favicon?

Un favicon es el icono pequeño que aparece en la pestaña del navegador cuando accedes a una web. Por ejemplo, este es el favicon de wikipedia.org

Cómo crear un favicon para tu web / wikipedia.org

El término «favicon» es un acrónimo de «favorite» (favorito) e «icon» (icono). En español significa «icono de favoritos», puesto que al guardar la página en favoritos, vemos este icono de la página. También figura en los marcadores en incluso como referencia visual para la identidad de una web. También se utiliza como icono de inicio si guardamos esa web en nuestro móvil, creando un acceso directo.

Un favicon suele reflejar el logo o parte del logo de una marca, o bien utilizar el anagrama o la inicial de esa marca. Por supuesto, también puede ser un símbolo que se asocie fácilmente a tu identidad, o un diseño actualizado que sirva para diferenciar tu blog incluso en los resultados de búsqueda.

¿Cómo crear un favicon para tu blog?

Puedes crear un favicon con cualquier programa de diseño, incluidas aplicaciones gratuitas como Canva o Pixrl, entre otras.

Simplemente tienes que preparar un diseño con tamaño de 16×16 píxeles y exportarlo con una extensión .ico

Hasta aquí todo bien pero, en la práctica, es interesante contar con diferentes tamaños de nuestro diseño, que podamos emplear no solo en la pestaña de la web sino también como logo en nuestro blog, símbolo de web app, o formatos intermedios para mostrar en resultados de búsqueda en función del navegador.

Y aquí es donde vamos a utilizar un asistente que además de ser gratuito, funciona muy bien: es Favicon Generator, y lo encontrarás como una de las utilidades que ofrece la web de IONOS.

página de inicio Favicon Generator de ionos.es

Para crear el favicon con Favicon Generator tienes 3 opciones:

  • Utilizar el editor
  • Emplear el generador de texto
  • Conversor de imagen a escala

Diseñar con el editor visual

Utilizar el editor, en un espacio de 16×16 píxeles en el que puedes dibujar y colorear lo que quieras. El editor cuenta con lapiz, borrador y selector personalizado de color, además de muestras de todas las tonalidades web. A la derecha tienes un espacio con la vista previa del favicon a tamaño real, para que puedas valorar el resultado mientras estás editando.

Editor Gráfico de IONOS Favicon Generator

Generador de Texto para crear un favicon

Utilizando el generador de texto, con el que puedes seleccionar dos letras, de la A a la Z, aplicándoles un color y especificando otro color para el fondo.

Generador de texto de IONOS Favicon Generator

Conversor de imagen a escala

La opción más sencilla, sin duda, consiste en utilizar algún diseño que ya tengas creado y que encaje bien en las proporciones cuadradas del favicon y los iconos de inicio. Puedes subir desde tu ordenador archivos de hasta 2 megas, y el formato recomendado es de 310×310 px.

Como crear un favicon para tu blog

Una vez has utilizado cualquiera de las 3 opciones, simplemente haz clic en >Crear favicons y después en >Descargar.

El fichero de descarga incluye hasta 20 iconos, incluidas versiones para Android, iOS y Windows.

Como crear un favicon para tu blog

También hay un fichero ‘Guía de uso’ que incluye código HTML para guardar todos los iconos en la web, aunque si utlizas WordPress, puedes obviar esto y subir directamente los formatos que necesites.

Información adicional y recursos para crear un favicon para tu blog

Esperamos que te haya resultado útil. Tienes más información en la web de IONOS, accediendo a su Favicon Generator.

Otros post interesantes sobre como crear un favicon:

__________

Esto es todo. Si quieres mejorar tus competencias digitales y aprender cómo funcionan las aplicaciones más utilizadas, visita nuestro blog. También contamos con un canal de YouTube en el que publicamos video tutoriales sobre el uso de aplicaciones interesantes.

Gracias por estar aquí. Esperamos verte pronto de nuevo y nos gustaría leer tus comentarios y conocer tu opinión sobre este post.

%%footer%%