Cómo agregar un Favicon a su sitio
Estado de este documento
borrador en desarrollo; puede cambiar radicalmente en cualquier momento.
un favicon es una imagen gráfica (icono) asociada a una página web y/o sitio web en particular. Muchos agentes de usuario recientes (como navegadores gráficos y nuevos lectores) los muestran como un recordatorio visual de la identidad del Sitio Web en la barra de direcciones o en pestañas. La wikipedia incluye un artículo sobrefavicons .,
para agregar un favicon a su sitio web, necesitará tanto una imagen como un método para especificar que la imagen se va a usar como un favicon. Este documento explica el método preferido por W3C para especificar elfavicon. Hay otro método común que se ilustra a continuación, con una explicación de por qué ese método es inconsistente con algunos principios de la arquitectura Web. Ambos métodos solo se aplican a HTML yxhtml, una de las limitaciones comentadas a continuación.
este documento no analiza en detalle cómo crear una faviconimage., Sin embargo, el formato para la imagen que ha elegido debe ser 16x16pixels o 32×32 pixels, utilizando colores de 8 bits o 24 bits. El formato de la imagen debe ser PNG (estándar aW3C), GIF o GIF.
Método 1 (preferido): uso de un valor de atributo rel definido en un perfil
el primer enfoque para especificar un favicon es usar el rel
valor de atributo «icon» y definir lo que significa el valor a través de un perfil; los perfiles se discuten con más detalle a continuación. En este HTML 4.,01 ejemplo, el favicon identificado a través del URI como un favicon:
la versión XHTML 1.0 es muy similar:
Método 2 (desaconsejado): poner el favicon en un URI predefinido
un segundo método para especificar un favicon se basa en el uso de un URI definido para identificar la imagen: «/favicon», que es relativo a la raíz del servidor. Este método funciona porque algunos navegadores han sido programados para buscar favicons usando ese URI., Este enfoque es coherente con algunos principios de la arquitectura Web y está siendo discutido por el grupo de Arquitectura Técnica(TAG) del W3C como su problema siteData-36.To resuma el problema: la arquitectura web autoriza a los administradores de sitios a administrar su espacio URI (para un nombre de dominio dado) a medida que lo vean. Las convenciones que no representan un acuerdo de la comunidad y que reducen las opciones disponibles para un administrador del sitio no escalan y pueden provocar conflictos (ya que no hay una lista bien conocida de estos Uri definidos)., Una consideración práctica ilustra el problema:muchos usuarios tienen sitios web a pesar de que no tienen su propio nombre de dominio. Estos usuarios no pueden especificar favicons usando el segundo método si no pueden escribir en la raíz del servidor. Sin embargo, pueden usar el método uno para especificar un favicon ya que es más flexible y no impide que el administrador del sitio use UN SOLO favicon en un solo lugar del sitio.
hay algunas otras invasiones bien conocidas en el espacio URI, incluyendo los » robots.txt » y la ubicación de una política de privacidad P3P., El grupo de Arquitectura Técnica está explorando alternativas que no afecten al espacio URI sin licencia.
uso de perfiles para definir términos como»icono»
en términos generales, un perfil es una definición de conjunto de términos. Idealmente, un perfil incluye información legible por máquina e información legible por humanos. En HTML 4.01 y XHTML 1.0, algunos atributos como el atributo rel
no tienen un conjunto predefinido de valores. En su lugar, el autor puede proporcionar valores de acuerdo a la necesidad, y luego utilizar un perfil para explicar lo que significan los valores., En nuestro caso, hemos recomendado que los autores usen el valor «icon» y un perfil que explique que «cuando decimos icon, queremos decir «este es un favicon.»»
en el método 1 anterior, usamos el atributo rel
con el elemento linkelement y elegimos un perfil con el atributo profile
en el elemento HEAD.
definimos un perfil que puede usar libremente para sus propios sitios.,
limitaciones
hay varias limitaciones a los enfoques descritos anteriormente,incluido el método preferido (por lo que la etiqueta continúa funcionando en la pregunta):
- Los enfoques solo funcionan en HTML o XHTML
- El enfoque preferido asocia un favicon con un documento HTML,no una colección de documentos (es decir, un sitio)
- el perfil propuesto para definir el valor «icon» no es un estándar reconocido, lo que significa que pueden ser cuestiones de interoperabilidad en la práctica.
- no hay estándar (al menos definido por HTML 4.,01) para perfiles legibles por máquina que permitirían a un navegador saber «esto significa que una imagen es un favicon.»Por lo tanto, abrowser tiene que ser programado de antemano para reconocer este valor particular de
rel
. Para obtener más información sobre el uso de perfiles en HTML y XHTML, consulte GRDDL.
FAVICON-WIKIPEDIA Favicon, Wikipedia, disponible en http://en.wikipedia.org/wiki/Favicon. GRDDL Gleaning Resource Descriptions from Dialects of Languages, D. Hazaël-Massieux, D. Connolly, Editors, W3C Team Submission, 16 May 2005, http://www.w3.org/TeamSubmission/2005/SUBM-grddl-20050516/ ., Latest version available at http://www.w3.org/TeamSubmission/grddl/ . HTML401 HTML 4.01 Specification, D. Raggett, A. Le Hors, I. Jacobs, Editors, W3C Recommendation, 24 December 1999, http://www.w3.org/TR/1999/REC-html401-19991224 . Latest version available at http://www.w3.org/TR/html401 . SITEDATA-36 Web site metadata improving on robots.txt, w3c/p3p and favicon etc., TAG, Available at http://www.w3.org/2001/tag/issues.html#siteData-36 . XHTML1 XHTML™ 1.0 The Extensible HyperText Markup Language (Second Edition), S. Pemberton, Editor, W3C Recommendation, 1 August 2002, http://www.w3.org/TR/2002/REC-xhtml1-20020801 ., Última versión disponible en http://www.w3.org/TR/xhtml1.
agradecimientos
Los siguientes participantes del grupo de interés de QA y el personal del W3C han contribuido significativamente al contenido de este documento:Dominique Hazaël-Massieux (W3C), Chris Lilley (W3C), andOlivier Théreaux (W3C).