Tecnología

Inicio

Cómo crear un favicon para su página web

Cómo crear un favicon para su página web


Un favicon aparece en la barra de direcciones del navegador. Por ejemplo, el favicon eHow es la letra O con una marca de verificación que se ve en el logo del sitio. Muchos sitios utilizan estos iconos de favoritos para ayudar a identificar y marca de su sitio. Aquí voy a revisar los pasos para crear un favicon para su propio sitio web.

Instrucciones

1 Usted puede crear su propio icono usando una imagen de su elección. Muchas imágenes no escalan con claridad y transparencia, por lo que elegir una imagen que es simple y clara y se reducirá de tamaño claramente.

2 Abre la imagen en cualquier herramienta de edición de fotos que tiene. GIMP, Photoshop, Fireworks o Paint Pro Mostrar todos hacen lo que necesita (ver Consejos a continuación si usted no tiene ninguna de este software está disponible).

3 Recortar la imagen para contener sólo el material que desea que aparezca en el favicon, a continuación, reducir el tamaño de 16 por 16 píxeles. La resolución de la imagen debe ser de 72 o 96 ppp.

4 Guardar la nueva imagen. Se pueden guardar como un archivo JPEG, GIF o PNG. Cargar la imagen a su sitio web.

5

La manera adecuada de enlazar con el icono depende de la versión de HTML que está utilizando en su sitio web. Para enlazar hacia el icono con HTML 4.01, inserte el código que aparece en la imagen en el encabezado del documento. Por supuesto, usted debe usar su propia información, como el nombre de la imagen y el servidor.

6

Si su página web utiliza XHTML 1.0, utilice código similar a lo que se ve en esta imagen. Una vez más, personalizar la información para adaptarse a su servidor y la imagen nombre en particular.

7

Esta opción usando el atributo rel = "icono de acceso directo" para el enlace funcionará en XHTML. Ver el código de la imagen. El icono debe llamarse "favicon.ico" y el icono debe ser almacenado en el nivel superior de la página web (no en todas las subcarpetas) para este enlace para trabajar.

8 Se puede utilizar un vínculo absoluto a la imagen como se muestra en el ejemplo de HTML 4.01, o un vínculo relativo, como se muestra en el ejemplo 1.0 XHTML. Utilice el método normal de enlace con una imagen, relativa o absoluta, ya sea HTML 4.01 o XHTML.

9 Sube a la página con el nuevo código en la cabecera del documento y vuelva a cargar la página para poner a prueba para asegurarse de que su nuevo favicon aparece en la barra de direcciones del navegador.

Consejos y advertencias

  • Una herramienta basada en la web en Dynamic Drive llama el generador de favicon le ayudará a crear la imagen si no tiene el software para hacerlo usted mismo.
  • Una aplicación de Adobe AIR va a crear iconos para usted. Debe ser descargado e instalado en su ordenador, pero es gratis. También tendría que descargar e instalar el tiempo de ejecución de Adobe AIR, sino que también es gratis.