Cambiar el Favicon de Nuestra Web o Blog.

[Yaque]

Como Cambiar el Favicon de Nuestra Web o Blog, o Como Poder Crearlo.

El Favicon es una palabra compuesta, que se deriva de las palabras en ingles de "Favorite Icon" (Icono de Favoritos). Este Icono es la imagen que distintiva de la web o blog, que aparece a la par o mejor dicho en la barra de dirrecciones del navegador.


Asi mismo los desarrolladores lo utilizan para identificar y promocionar la web o blog que estan desarrollando. El Favicon es muy facil de hacer, hay muchas herramientas para poderlo hacer. Acontinuacion les mostrare como crear su propio Favicon.

Se puede usar cualquier imagen de tamaño de 16x16 pixels y que sea de los siguientes formatos PNG, ICO, JPG, que son los mas comunes de usar, nosotros usares el formato PNG y usaremos la herramienta llamada Picnik, esta es una gran herramienta para editar imagenes y es muy sensilla de usar.

Estos son los pasos:

Primero que nada buscaremos una imagen que nos guste para nuestro favicon.

En Segundo lugar damos click en el siguiente enlace de Picnik y procederemos a editar nuestra imagen para poderla usar al tamaño que queremos y necesitamos que es de 16x16.

1.- Ahi damos click en la parte de abajo de la pagina donde dice Español.



2.- Luego vamos a la esquina superior derecha y damos click en Empieza a editar con Picnik » (aqui tarda un poco en cargar pero no mucho).


3.- De ahi nos mostrara una nueva pagina, donde vamos a cargar la imagen que anteriormente escogimos, para ello pinchamos en Cargar una foto, ahi solo buscamos nustra imagen y le damos abrir.


4.- Despues que le dimos en cargar una foto nos abrira el editor de imagenes. Estando en el editor de imagenes pincharemos en Recortar si lo que queremos es recortar una imagen que es mucho mas grande de lo que queremos que se vea en el favicon, hay que recordar que el favicon solo es el icono de nustra web o blog nada mas, por ende no debe de ser una imagen demasiado grande.


Pero lo que nosotros queremos es solamente cambiar el tamaño de nustra imagen asi que le daremos click en Cambiar tamaño, lo que sigue es dejarlo de 16x16 pixels, eso lo haremos a continuacion, primero deseleccionamos la casilla que dice Mantener proporciones, luego damos los valores de 16x16 en la casilla que dice Nuevas dimenciones, luego le damos aceptar, esto lo podemos apreciar en las siguientes imagenes:


Ahora ya tenemos nustra imagen en el tamaño que queremos, solo nos falta dejarla en el formato que queremos y guardarla en nuestra PC.


5.- Ahora pasaremos a guardar la imagen asi que damos click en Guardar, ahi seleccionamos el formato que queremos el cual es PNG y le damos guardar.


En Tercer lugar buscamos en nustra plantilla en el editor de Html la palabra </body> e insertamos el siguiente codigo arriva de </body>.

<link href='http://lh6.ggpht.com/_Rk6TCDmyuqc/TG...28/ABC%202.png' rel='icon' type='image/png'/> <link href='http://lh6.ggpht.com/_Rk6TCDmyuqc/TG...28/ABC%202.png' rel='icon' type='image/png'/>

Solo nos toca modificar este codigo la parte que esta en Negrita, vamos a cambiar esa dirreccion por la url donde tenemos alojada nustra imagen. Se me olvidava decirles que hay que alojar nustra imagen en un servidor web para alojar imagenes, algunos de estos servidores donde podemos alojar imagenes son Picasa Web Albums , Tinypic.

Espero que les haya gustado este pequeño tutorial para crear su propio Favicon.

[wolfito]

Gracias por el tuto,lo unico que puedo agregar es que en el explorer no se puede visualizar el favicon,pero SI en el mozilla asi que podria decir que si me resulto

Aunque me hubiera gustado que si se pudiera ver en el explorer,en fin quizas sea un problema del explorer que no me deja apreciar mi favicon por ese navegador ¬¬



Saludos