Etiquetas META y bloqueo en la compatibilidad con versiones futuras

Nota: Esta información es preliminar y está sujeta a cambios.

La compatibilidad de documentos es una preocupación importante para los desarrolladores web. Windows Internet Explorer 8 presenta los modos de compatibilidad de documentos que permiten a los desarrolladores web indicar al explorador que represente sus páginas de la misma forma que en versiones anteriores, lo que permite que el desarrollador elija cuándo realizar la actualización.

En este documento se describen los modos de compatibilidad admitidos por Windows Internet Explorer 8 y se explica cómo se pueden implementar por página o por sitio mediante el uso de encabezados personalizados. Al implementar el modo de compatibilidad adecuado, un sitio puede garantizar compatibilidad con Windows Internet Explorer 8 y posterior.

Diferentes modos de compatibilidad

Windows Internet Explorer 8 admite muchos modos de compatibilidad que habilitan diferentes características admitidas y afectan al modo en que se representa el contenido. Por ejemplo,

el modo IE5 representa el contenido como si se mostrara mediante el modo No estándar de Internet Explorer 7, que es muy similar al modo en que Windows Internet Explorer 5 mostraba el contenido.

El modo IE7 representa el contenido como si se mostrara mediante el modo Estándar de Internet Explorer 7, independientemente de si la página contiene una directiva <!DOCTYPE>.

El modo EmulateIE7 indica a Windows Internet Explorer que use la directiva <!DOCTYPE> para determinar el modo de representar el contenido. Las directivas del modo Estándar se muestran en el modo Estándar de Windows Internet Explorer 7 y la directivas del modo No estándar se muestran en el modo IE5. A diferencia del modo IE7, el modo EmulateIE7 respeta la directiva <!DOCTYPE>. Para muchos sitios web, se trata del modo de compatibilidad preferido.

El modo IE8 proporciona la máxima compatibilidad disponible en los estándares del sector, incluida la especificación de hojas de estilo en cascada de nivel 2.1 de W3C y la API de selectores de W3C, así como compatibilidad limitada con la especificación de hojas de estilo en cascada de nivel 3 de W3C (borrador de trabajo).

El modo Edge indica a Windows Internet Explorer que muestre el contenido en máximo nivel disponible, lo que realmente rompe del paradigma de “bloqueo”. Con Windows Internet Explorer 8, equivale al modo IE8. Si una versión futura (hipotética) de Windows Internet Explorer admitiera un modo de compatibilidad mayor, las páginas establecidas en el modo Edge aparecerían en el máximo modo admitido por dicha versión; no obstante, esas mismas páginas seguirían apareciendo en modo IE8 cuando se mostraran con Windows Internet Explorer 8. Se recomienda que los desarrolladores limiten el uso del modo Edge a las páginas de prueba y a otras páginas que no sean de producción debido a los posibles resultados inesperados de representar el contenido de página en versiones futuras de Windows Internet Explorer.

Especificar los modos de compatibilidad por página

Para especificar un modo de documento para sus páginas web, use el elemento META para incluir un encabezado X-UA-Compatible http-equiv en la página web. El siguiente ejemplo especifica el modo de compatibilidad EmulateIE7.

<html>
   <head>
   <!-- Mimic Internet Explorer 7 -->
      <title>My Web Page</title>
      <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
   </head>
   <body>
      <p>Content goes here.</p>
   </body>
</html>

El atributo content específica el modo de la página; por ejemplo, para imitar el comportamiento de Windows Internet Explorer 7, especifique IE=EmulateIE7. Del mismo modo, especifique IE=5, IE=7 o IE=8 para seleccionar uno de estos modos de compatibilidad. También puede especificar IE=edge para indicar a Windows Internet Explorer 8 que use el máximo modo disponible.

El encabezado X-UA-compatible no distingue entre mayúsculas y minúsculas; no obstante, debe aparecer en el encabezado de la página web (la sección HEAD) antes que todos los demás elementos, excepto el elemento TITLE y otros elementos META.

Especificar los modos de compatibilidad por sitio

Se puede especificar un modo de documento para el sitio web con la definición de un encabezado de respuesta HTTP personalizado para el sitio mediante el servidor web. Un encabezado de respuesta HTTP es la información que un servidor web adjunta al archivo que envía a su explorador en respuesta a la solicitud HTTP y que normalmente contiene información como la fecha, el tamaño y el tipo del archivo que se envía.

Los siguientes documentos describen los pasos necesarios para configurar el servidor web con el fin de que adjunte un encabezado de respuesta HTTP personalizado a todas las páginas web. Esto provocará que Windows Internet Explorer 8 use un modo de compatibilidad de documentos específico, como EmulateIE7.

Si especifica un modo de compatibilidad de documentos predeterminado mediante el servidor web, puede invalidar dicha configuración si especifica otro modo de compatibilidad de documentos en una página web concreta. El modo especificado en la página web tiene prioridad sobre el modo especificado por el servidor.

Determinar el modo de compatibilidad de documentos con un script

Para determinar el modo de compatibilidad de documentos de una página web con Windows Internet Explorer 8, use la propiedad documentMode del objeto document. Por ejemplo, el escribir lo siguiente en la barra de dirección de Windows Internet Explorer 8 se muestra el modo de documento para la página web actual.

javascript:alert(document.documentMode);

La propiedad documentMode devuelve un valor numérico, que corresponde al modo de compatibilidad de documentos de la página. Por ejemplo, si una página ha elegido admitir el modo IE8, documentMode vuelve el valor 8.

Nota: la propiedad compatMode presentada en Windows Internet Explorer 6 se ha descartado en favor de la propiedad documentMode presentada en Windows Internet Explorer 8. Las aplicaciones que actualmente se basan en el modo compatMode seguirán funcionando en Windows Internet Explorer 8; no obstante, se deben actualizar para usar documentMode.

Si desea usar JavaScript para determinar el modo de compatibilidad de un documento, incluya código que admita las versiones anteriores de Windows Internet Explorer, tal como se muestra en el siguiente ejemplo.

engine = null;
if (window.navigator.appName == "Microsoft Internet Explorer")
{
   // This is an IE browser. What mode is the engine in?
   if (document.documentMode) // IE8
      engine = document.documentMode;
   else // IE 5-7
   {
      engine = 5; // Assume quirks mode unless proven otherwise
      if (document.compatMode)
      {
         if (document.compatMode == "CSS1Compat")
            engine = 7; // standards mode
      }
   }
   // the engine variable now contains the document compatibility mode.
}

El objeto document que se usa aquí representa el documento en una determinada ventana de explorador y se puede usar para examinar, modificar o agregar contenido a un documento HTML y para procesar eventos dentro de dicho documento.

Determinar el modo de compatibilidad de documentos con comentarios adicionales

Si sólo se dirige a Windows Internet Explorer, el siguiente ejemplo de código ilustra cómo se usan los comentarios condicionales para dirigirse a versiones actuales o anteriores.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">
<html>
   <head>
      <title>Test Page</title>
      <meta http-equiv="X-UA-Compatible" content="IE=8"/>
      <!--[if gte IE 8]>
      <style type="text/css">
      body {
       color: #0000ff;
       background-color: #000000;
      }
      </style>
      <![endif]-->
      <!--[if lt IE 8]>
      <style type="text/css">
      body {
       color: #000000;
       background-color: #ffffff;
      }
      </style>
      <![endif]-->
   </head>
   <body>
      <h1>
      <!--[if gte IE 8]>
      Chapter 1.
      <![endif]-->
      First Chapter
      </h1>
      <h1>
      <!--[if gte IE 8]>
      Chapter 2.
      <![endif]-->
      Second Chapter
      </h1>
      Text any version will see.
   </body>
</html>

Para obtener más información acerca de versiones y modos de Windows Internet Explorer, consulte Definir la compatibilidad de documentos.