¿Qué es un favicon?

Un favicon (acrónimo de favorites icon) es una imagen (icono favorito) que se asocia a una página web y que es utilizada por algunos navegadores de Internet, mostrándola en la barra de direcciones, en la lista de marcadores favoritos y en la pestaña del navegador donde se abre dicha página.

Hace tan solo unos días que coloqué un favicon en mi web, con las iniciales de mi nombre y apellido (CP):

Si quieres colocar un favicon en tu web es tan sencillo como colocar una imagen (favicon.ico) en el raiz de tu web. Por ejemplo, yo la he puesto en:

http://www.carlospes.com/favicon.ico

Y, ahora, la pregunta es: ¿cómo creo una imagen llamada favicon.ico? Si buscas en Internet, encontrarás varios programas que te permiten hacerlo. Ahora bien, si quieres crear tu favicon en unos pocos segundos, también existen sitios en Internet que te permiten convertir una imagen que ya tengas creada con otra extensión (.bmp, .jpg, etc.) a la extensión (.ico). Por ejemplo, yo lo he hecho en:

http://www.chami.com/html-kit/services/favicon/

La página está en inglés, pero, sólo hay que pasarle la imagen que quieras convertir en tu favicon donde pone "Source image" y pinchar en el botón "Generate FavIcon.ico".

Para más información, también podéis consultar:

http://es.wikipedia.org/wiki/Favicon
¡Espero que os sea de utilidad!

Comentarios

  1. Hay una forma más fácil, sin utilizar ningún programa.

    Pones como favicon la imagen en un formato habitual (png, jpg, gif) en tu página web e indicas su ruta con la etiqueta link entre las etiquetas de cabecera head.
    Veamos un ejemplo con una imagen en formato png:

    <link rel="icon" type="image/png" href="/imagnees/mifavicon.png" />

    Dependiendo del formato, el atributo “type” cambiará:

    * Formato png: image/png
    * Formato gif: image/gif
    * Formato jpeg (extension jpg o jpeg): image/jpeg

    Si tienes un favicon que no respeta los estándares, el atributo “rel” también cambia:

    <link rel="shortcut icon" type="image/x-icon" href="/images/icon1.ico" />

    ResponderEliminar

Publicar un comentario