Agregar Favicon En Nuestra Web

Un Favicon es un icono asociado a una  página web. Los navegadores web muestran este icono en la la barra de direcciones, igualmente al  lado del nombre de la página web en la lista de favoritos y en los títulos de las páginas. Los Favicon son de un tamaño 16×16, y de extensión .ico en […]

Ultimos Articulos

shadow
shadow

Un Favicon es un icono asociado a una  página web. Los navegadores web muestran este icono en la la barra de direcciones, igualmente al  lado del nombre de la página web en la lista de favoritos y en los títulos de las páginas. Los Favicon son de un tamaño 16×16, y de extensión .ico en esta ocasion les explicare como podemos agregar dicho favicon en nuestra web.

Primero vamos a esta pagina: http://www.html-kit.com/favicon/

En esa pagina es donde cargaremos nuetra imagen previamente creada, y nos dara el respectivo archivo favicon.

Simplemente vamos a el imput file en donde esta el ovalo azul en la imagen anterior, seleccionamos nuestra imagen a usar, y luego presionamos en el boton generate favicon al dar clic en el comezara el proceso de crear el favicon, una vez creado, nos quedara la pagina de la siguiente forma:

nos muestra el resultado el cual esta encerrado en el ovalo azul en la imagen anterior, damos clic en dowload favicon package, para descargar el favicon, el cual se descarga de tipo .rar, luego de descargado lo descomprimimos y dos dara 3 archivos, los cuales son dos imagenes uno con extension .ico y otro .gif, el .ico se ubicara al lado del titulo de la pagina en la pestaña, y el .gif se ubicara la lado de la barra de direcciones, adicionalmente agregan un archivo .txt donde explica el codigo a poner dentro de cabezera de cada pagina, al momento de tener las dos imagenes, las ubicamos donde queremas y ponemos el siguiente codigo:

<link href=”favicon.ico” rel=”shortcut icon” />

<link href=”animated_favicon1.gif” rel=”icon” type=”image/gif” />

La Primera Etiqueta Link llama a la imagen.ico y la ubica al lado del titulo de la pagina en la pestaña como ya se habia dicho.

La Segunda etiqueta link llama a la imagen .gif y la ubica al lado dela barra de direcciones como tambien ya se habia dicho.

En los valore href van la ubicacion donde se puso cada imagen.

y listo ya nos queda nuestra web con un favicon, como el que se muestra en mi web.

Eso es todo por este articulo, espero les sea util, y como siempre espero sus comentarios


 

1 Estrella2 Estrellas3 Estrellas4 Estrellas5 Estrellas (Sin evaluar)
Loading...
 
 

Autor

Oscar Gomez

Programador web, Gamer y amante de las nuevas tecnologías, autodidacta web, y seguro acerca de que el titulo no hace al maestro.

Publicidad

shadow

Articulos relacionados

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

 

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.plugin cookies

ACEPTAR