como poner una imagen para q aparezca en las pestañas del navegador

Observo que en muchas paginas webs, cuando pones su direccion en la barra de direcciones o linkeas directamente, bien en el explorer, firefox u opera....etc aparece una pequeña imagen en la pestaña del explorador


Me podría decir alguien como se hace y cual es el formato y tamaño de icono....?


En espera de respuestas

Hola:

Eso se llama favicon, que en el fondo es el icono para que se destaque en los favoritos (favorite - favorito - icon = favicon).

El formato de la imagen puede ser PNG, ICO, GIF o JPG, aunque dependerá del navegador. En cuanto al tamaño, este debe ser mayor a 16 x 16 pixeles.

Luego de tener tu favicon, debes incluir esto dentro del head:

<link rel="shortcut icon" href="ruta_hacia_el_archivo" type="image/extensión" />

donde extensión será el tipo de archivo que utilizaste. Por ejemplo, si tu favicon se llama favicon.png, entonces el <link /> quedaría así:

<link rel="shortcut icon" href="favicon.png" type="image/png" />

Como dije anteriormente, el tipo (type) dependerá del navegador, pues no todos los navegadores soportan los mismos tipos.

En Wikipedia hay más información.

Saludos.

skaparate escribió:Hola:

Eso se llama favicon, que en el fondo es el icono para que se destaque en los favoritos (favorite - favorito - icon = favicon).

El formato de la imagen puede ser PNG, ICO, GIF o JPG, aunque dependerá del navegador. En cuanto al tamaño, este debe ser mayor a 16 x 16 pixeles.

Luego de tener tu favicon, debes incluir esto dentro del head:

<link rel="shortcut icon" href="ruta_hacia_el_archivo" type="image/extensión" />

donde extensión será el tipo de archivo que utilizaste. Por ejemplo, si tu favicon se llama favicon.png, entonces el <link /> quedaría así:

<link rel="shortcut icon" href="favicon.png" type="image/png" />

Como dije anteriormente, el tipo (type) dependerá del navegador, pues no todos los navegadores soportan los mismos tipos.

En Wikipedia hay más información.

Saludos.

Gracias amigo!! ya lo coloqué!!! muy completa tu explicación!