Diseño Web

Favicon

31 mayo, 2012

Podemos empezar dando una definición de favicon. Lo mas facil es buscar, y en wikipedia encontraras:

Un favicon, del inglés favorites icon (icono de favoritos), también conocido como icono de página, es una pequeña imagen asociada con una página o sitio web en particular. Los navegadores gráficos suelen mostrar el favicon de la página visitada, si ésta lo posee, en la barra de direcciones y en el encabezado de la pestaña correspondiente. Asimismo los utilizan para identificar más fácilmente las páginas, presentándolos junto a sus respectivos títulos, en las listas de marcadores o favoritos, en los historiales de páginas visitadas y de navegación reciente, y toda vez que deban hacer referencia a ellas.

La forma original de definir un favicon era poniendo un archivo llamado favicon.ico en el directorio raíz del servidor web, el cual era mostrado automáticamente en los favoritos de Internet Explorer. Después, sin embargo, se creó un sistema más flexible, usando HTML para indicar la localización de un icono para cada página servida, el cual es identificado añadiendo dos elementos link en la sección <head> del documento como se detalla abajo. De esta manera, cualquier imagen de un tamaño apropiado (16×16 pixels o más) puede ser usada, y aunque todavía muchos usan el formato .ICO, otros navegadores ahora también soportan los formatos de imagen animada GIF y PNG.

Ejemplo del favicon de TutorialMonsters

[highlight]<link rel=”shortcut icon” href=”http://www.tutorialmonsters.com/wp-content/uploads/2012/01/favicon-monstruo.gif”/>[/highlight]

Utilizamos una imagen gif para conseguir la animación del icono, si te fijas veras como parpadea (como es una animación no se ve en todos los navegadores, una pena, prueba con firefox).

Crear online un favicon

Para crear un favicon, lo puedes hacer online, existen multitud de webs que pueden hacer un favicon desde una imagen que tengas, por ejemplo:

Poco mas se puede decir del favicon. Simplemente, es cuestión de imagen

También podría gustarte

Sin Comentarios

Dejar un Comentario