Crear y Utilizar Favicon

Favicon (del ingles ‘Favorites Icon‘) es una pequeña imagen asociada con un sitio web, esta imagen o icono se muestra en los navegadores junto a la dirección de un sitio web y que sirve para identificar de forma visual un determinado sitio web.

favicon.gif

Crear un Favicon
Un favicon es un archivo con extensión .ico el cual es diferente al formato gif o bmp. Entonces el icono debe tener las siguientes características: dimensión de 16×16 pixels, 16 colores y estar en formato ICO.

Existe una infinidad de herramientas con las cuales puedes crear tus favicon entre las cuales podemos destacar:

  • Microangelo, completo set de herramientas para crear y editar favicon.
  • Icon Forge, otro editor sencillo de iconos.
  • KIconEdit, el editor de iconos de KDE.

También existen servicios online en donde puedes crear tu icono sin necesidad de tener un software instalado, entre las cuales podemos listar:

Insertar un Favicon
Una vez que tenemos el favicon para nuestro sitio web el siguiente paso es insertarlo, para ello es necesario una línea de código en el header de nuestro HTML.

<link rel="shortcut icon" href="http://tuweb.com/favicon.ico" />

Como pueden ver con unos pocos pasos pueden personalizar su web añadiéndole un elemento visual que ayudará a sus visitantes a identificarlos rápidamente.

Comentarios Total 21 comentarios

Luis Enrique
Publicado: 15/01/2008 2:25 am

buen dato man para hacer mi icono, pero ese icono es reconocido recien en internet explorer 7.0

spideep
Publicado: 15/01/2008 2:22 pm

también puedes crearlo desde photoshop, con mejor calidad en mi opinión, descargando el plugin de aquí

http://www.telegraphics.com.au/sw/dl.php3?file=ICOFormat-1.6f9-win.zip

Ale
Publicado: 16/01/2008 7:44 pm

¿Lo que dice Luis Enrique es cierto? Es decir… sé que esto se hace desde hace años, pero quizás este código en particular es el que solo funciona con Internet Explorer 7.0.

Bueno, quisiera saber eso. ¡Gracias!

jacknnel gomez
Publicado: 21/01/2008 6:15 pm

bueno yo digo q pueden enviar y descargar informacion mejor de la q hay

Recuweb
Publicado: 16/05/2008 7:26 pm

Aqui teneis otro generador online gratuito

http://herramientas.recuweb.com/favicon/

Espero que os sirva

Blog Icons: Plugin para Favicons » unijimpe
Publicado: 24/09/2008 12:02 am

[…] hemos comentado acerca de los favicons en Crear y Utilizar Favicon, pero este plugin además de administrar el favicon tradicional te permite configurar el icono a […]

Online Favicon Generator » unijimpe
Publicado: 15/02/2009 5:47 pm

[…] Favicon Generator es una excelente y practica herramienta que nos permitirá crear fácilmente los archivos favicon que identifican a nuestros webs y de los cuales hemos comentado en Crear y Utilizar Favicon. […]

Jonny
Publicado: 16/04/2009 5:43 pm

hola,

alguien me puede decir como se inserta el codigo en un WordPress?
Gracias

unijimpe
Publicado: 16/04/2009 10:29 pm

Jonny, debes editar el archivo header.php de tu template y debes incluir el código:

<link rel=»shortcut icon» href=»http://tuweb.com/favicon.ico» />

Este código lo puedes incluir antes del tag </head>

Jonny
Publicado: 17/04/2009 2:11 am

hola,

nada no sale no comprendo xd
aqui te paso el link de mi header pero en .txt dime a donde lo pongo porfas
http://sattechnik24.de/header.txt
gracias.

Vero
Publicado: 23/04/2009 12:59 pm

Hola, es muy interesante tu pagina, excelentes post

Saludos =)

Kennyomar
Publicado: 06/06/2009 11:10 am

Hay un programa que se llama Greenfish Icon Editor Pro, es excelente para crear iconos a partir de imagenes con alta calidad de 1 a 32bits

jr
Publicado: 01/08/2009 5:40 am

gracias, una informacion muy completa

yoli
Publicado: 16/11/2009 4:09 pm

como añadir un favicon en mi direccion web, si utilizo un programa de webside maker que es en flash y no me deja usar HTML?¿?

Sorry…contestar!!

jaime
Publicado: 29/12/2009 8:21 am

yo he provado y no me funciona!

Mitternahct
Publicado: 10/01/2010 12:33 am

Hola, me parece un gran aporte pero quisiera saber si es posible que el favicon sea una imagen gif, es decir un gif que yo seleccione de mi pc, no una animación de una imagen estática o de texto que se mueva.
Gracias y espeor respuestas ^^.

sergi
Publicado: 21/04/2010 7:12 am

Buena información , aquií lo puedes generar online
http://networktools.es/webtool/favicon/index.php
saludos.

Guille
Publicado: 11/06/2010 9:30 pm

Tengo un pagina en cdmon y no puedo poner el favicon y nose porque….

DLG Trading Room
Publicado: 19/09/2010 10:20 pm

Genial.

Me anduvo perfecto.

Probe el de la pagina http://www.html-kit.com/favicon/

y me genero un favicon animado.

Gracias por el dato.

Jimmy | Best European Cruises
Publicado: 21/02/2011 10:25 am

Joya. que bueno que esta esto. Hice un favicon animado y andubo perfecto.

Gracias por la informacion.

Un abrazo.

Jimmy

Marcelino - opciones binarias
Publicado: 01/05/2011 12:53 am

muy buena la información brindada, a mi personalmente me funciono en forma correcta, digo porque vi comentarios que no habia funcionado.

 

Comentar

En este blog los comentarios están moderados, serán mostrados cuando el administrador los apruebe. Por favor, evita comentarios ofensivos u obscenos por que no serán aprobados.
Si deseas publicar código fuente debes hacerlo entre las etiquedas <code> y </code>, además debes reemplazar los carácteres < por &lt; y > por &gt;.

(Requerido)

(Requerido, no será publicado)

(Requerido)

(Tags aceptados: <a> <em> <strong> <code> <ul> <li>)