Lo hice y lo entendí

El blog de Vicente Navarro
27 ene

Internet Explorer 8 y el nuevo “super-duper standards mode”

No me dedico profesionalmente al diseño de páginas web, pero he creado varias con resultados bastante razonables (aunque sea yo el que lo diga). Sin que pueda decir que soy un experto en HTML, CSS, JavaScript o DHTML, son tecnologías que no me resultan desconocidas y, en realidad, es un mundillo que me gusta bastante, aunque reconozco que es necesario dedicarle mucho tiempo para no quedarte obsoleto y seguir controlando las tecnologías web punteras. También he de reconocer que se me da mucho mejor la parte de escribir código y hacer la infraestructura de la página que la parte de pensar en colores, editar imágenes y decidir el aspecto final.

Tras haber usado durante algún tiempo Netscape 3 y 4 (Internet Explorer no lo usaba casi nadie por aquel entonces), mi primer contacto serio con el mundillo del diseño web fue en 1997. En 1997, año en el que salió el Internet Explorer 4 (aunque no se popularizó hasta que el Windows 98, que lo llevaba integrado, se extendió), recuerdo que era muy fácil hacer una página web que se viera bien en Netscape y en Internet Explorer. La última moda era diseñar las páginas con frames y muchas tablas para definir el diseño de la página. El CSS aún no lo usaba nadie, pero ya comenzaba a tener soporte parcial en los navegadores.

Luego vino la época en la que las páginas requerían “navegadores versión 4 o superior”. Los navegadores 3 dejaron de utilizarse completamente y, como leemos en browser wars, era frecuente que las páginas tuvieran un logo de “best viewed in Netscape” o “best viewed in Internet Explorer”, y ahí comenzó el problema de que era difícil conseguir que una página se viera bien en todos los navegadores.

La pesadilla fue a más para los desarrolladores de páginas web, no a menos. Siguieron apareciendo diferentes versiones de Internet Explorer y había aparecido Mozilla, un proyecto de código abierto subvencionado en gran medida por Netscape que trajo una reescritura desde cero de su navegador y fue la base de Netscape 6. Así que sobre el 2003 tenías que conseguir que una misma página se viera bien en Internet Explorer 4, 5, 5.5 y 6 y también en Netscape 4 y en Mozilla 1.X y Netscape 6/7. De verdad, algo realmente desagradable. Si no querías dejarte ningún navegador fuera, sólo para tener la infraestructura necesaria para probar con todos los Internet Explorer, necesitabas tener varios PCs. Aún tengo por ahí varias imágenes de VMWare con cada uno de los Internet Explorer 4, 5 y 5.5. Buscando cómo solucionar tantos problemas, encontré la X Library (LGPL) de Cross-Browser.com, que la verdad es que me evitó muchísimos problemas.

Uno de los problemas más graves que tenía Internet Explorer en sus versiones 4 y 5 era el famoso Internet Explorer box model bug, consistente en que para Internet Explorer las propiedades width y height incluían el ancho o alto del padding, como vemos en la siguiente imagen (de la Wikipedia):

IE Box Model Bug

Internet Explorer 6 solucionó el bug, permitiendo que los desarrolladores de páginas web eligieran a través del !DOCTYPE si querían que Internet Explorer funcionara en quirks mode (simulando los defectos de las versiones anteriores) o en standards mode (se supone que cumpliendo con los estándares HTML 4.0 y XHTML 1.0). Microsoft nos explicó cómo hacerlo en CSS Enhancements in Internet Explorer 6.

Windows XP traía Internet Explorer 6 por defecto, y Windows 2000 y Windows 98 se podían actualizar con Windows Update fácilmente para instalar el Internet Explorer 6, de modo que en los últimos años, el panorama del desarrollo de páginas web había mejorado bastante. Sólo había que hacer una página que cumpliera con los estándares (Firefox, Mozilla, Konqueror, Opera) y otra para Internet Explorer 6.

¿Otra para Internet Explorer 6? ¿No habíamos quedado que tiene un standards mode? Sí, pero incluso en ese método que supuestamente cumple los estándares, su grado de cumplimiento de los mismos es bajísimo (Web browser standards support summary) y, encima, tiene una gran cantidad de bugs que hacen que incluso lo que se supone que soporta no lo soporte bien: Explorer Exposed!, Bugs in MSIE 6.

Tras Internet Explorer 6, el desarrollo de Internet Explorer se paralizó completamente por varios años y no se corrigió ningún bug que no fuera un riesgo de seguridad. ¿Para qué invertir dinero en un navegador web si Netscape ya no era ningún peligro? Pero curiosamente, con el notable ascenso de la cuota de mercado de Firefox le vieron las orejas al lobo y retomaron el desarrollo de Internet Explorer.

La ausencia de nuevas versiones de Internet Explorer entre 2001 y 2006 causó que los desarrolladores de páginas web tuvieran que elegir entre: O hacer páginas sólo IE6 ignorando el resto de navegadores, o hacer una página llena de selectores y diferenciadores de navegador que en realidad son casi dos páginas, una estándar y otra con los hacks específicos para Internet Explorer 6. Al menos ya sólo eran dos navegadores en los que probar: Internet Explorer 6 y cualquier otro navegador que cumpliera los estándares, pero aún quedando lejos de la situación ideal de crear una página que cumpla los estándares y se vea bien en cualquier navegador.

Durante el desarrollo de Internet Explorer 7, los ingenieros de Microsoft nos anunciaron en el blog de IE que iban a solucionar la mayoría de bugs conocidos de CSS: Details on our CSS changes for IE7, What’s New for CSS in Beta 2 Preview? y que iban a soportar algunas cosas más de la especificación de CSS 2.1. Y la verdad es que en IE7, muchas páginas diseñadas de forma estándar, sin hacks para IE6, se ven mucho mejor. Sería muy deseable que el Internet Explorer 7 se extendiera lo suficiente como para borrar la aberración del Internet Explorer 6 de la faz de la tierra y ya estuviéramos a un pequeñísimo paso de la tan deseada situación de escribir código estándar que se viera bien en todos los navegadores. Sin embargo, no perdamos de vista que Internet Explorer 7 también tiene muchos bugs: Bugs in MSIE 7.

Microsoft está trabajando ahora en el Internet Explorer 8, y ya nos van contando en el blog de IE cosas sobre la nueva versión. En una entrada de la semana pasada (Compatibility and IE8), los desarrolladores se quejaban amargamente de que muchos desarrolladores de páginas web estaban estado usado el standards mode en IE6 para hacer una página web razonablemente compatible con los estándares y evitando los bugs con hacks específicos. Claro, con la llegada de Internet Explorer 7, versión en la que muchos problemas del standards mode están resueltos, resulta que páginas que se veían bien en Internet Explorer 6 y otros navegadores ajustados a los estándares, ya no se ven bien en Internet Explorer 7 por culpa de los hack. Es casi cómico, porque se trata de páginas que se hubieran visto bien si hubieran usado el mismo código que se le muestra a Firefox o a Konqueror, ya que el IE7 se comporta mucho mejor (Cascading Style Sheet Compatibility in Internet Explorer 7), pero como se detectaba IE y se le servía un código a medida para IE6, se veían mal. Así que a Microsoft le llovieron criticas por “haber roto la web”:

In short, there was an expectation that even under standards mode, IE would keep working the same way. Because sites expected IE6 behavior, the DOCTYPE switch failed to protect compatibility in the real world when we changed behavior under standards mode to become more compliant. We realized that “Don’t Break the Web” should really be translated to “Don’t change what developers expect IE to do for current pages that are already deployed.” (Of course, for content that is developed to a later standard that isn’t deployed yet, you can expect different things.)

Claro, claro, los desarrolladores de páginas web han sido muy malos creando páginas a medida para IE6 en standards mode en vez de usar ese modo para páginas estándar de verdad y dejar el quirks mode para hacer páginas IE-only. Qué malos que han sido los desarrolladores que no han esperado desde 2001 a que sacáramos el Internet Explorer 7 para que sus páginas estándar se vieran bien.

En fin, el caso es con Internet Explorer 7 se dejaron muchas cosas en el tintero en materia de cumplimiento de estándares, así que para Internet Explorer 8 planean introducir un muy bienvenido modo super-duper estándar, que cumpla con todos los estándares habidos y por haber. Pero esta vez no quieren que les pase como con Internet Explorer 7 y que las páginas actuales dejen de verse bien, así que consultaron con The Web Standards Project cómo podían hacerlo y Aaron Gustafson, miembro de WSP, explicó en A List Apart (una página de referencia muy importante para desarrolladores web) la solución a la que se había llegado: Beyond DOCTYPE: Web Standards, Forward Compatibility, and IE8.

Básicamente, la solución propuesta pasa por especificar con una etiqueta meta que se use este nuevo modo super estándar:

<meta http-equiv="X-UA-Compatible" content="IE=8" />

También se podría usar para otros navegadores:

<meta http-equiv="X-UA-Compatible" content="IE=8;FF=3;OtherUA=4" />

Y como es un http-equiv, también se puede pasar en la cabecera HTTP:

X-UA-Compatible: IE=8;FF=3;OtherUA=4

Si no se especifica este meta, el IE8 se comportará como IE6 e IE7: Con el !DOCTYPE se seleccionará el standards mode a secas o el quirks mode.

Así que aquí tenemos a Microsoft preocupadísima por los estándares web (¿tendrá algo que ver la demanda de Opera : Opera tries to force IE into W3C compliance with EU complaint; Firefox’s success may work against it?) y teniendo que estudiar detenidamente qué pasos da para no causar más daño que el ya causado en el pasado por pasarse los estándares… por donde se los haya querido pasar.

Y es que no olvidemos que la modificación y cumplimiento parcial de estándares es una utilísima arma que Microsoft siempre ha sabido usar muy bien (Embrace, extend and extinguish) para eliminar a la competencia y ampliar su monopolio. Afortunadamente, en esta época de crecimiento del software y los estándares abiertos, Microsoft tiene que, o cambiar su actitud o, al menos, que se le note menos.

Por cierto, Internet Explorer 8 es capaz de renderizar el test Acid2 correctamente, pero curiosamente cuando esté finalizado y disponible para descargar, nosotros no podremos verificarlo fácilmente porque ¡la página del test Acid2 no tiene la etiqueta meta para activar el super-duper standards mode!

Actualización 20/2/08: En A List Apart vuelven a darle vueltas a este tema en Version Targeting: Threat or Menace? y en They Shoot Browsers, Don’t They?.

Actualización 4/3/08: En línea con sus recién estrenados Interoperability Principles, Microsoft ha decidido cambiar de opinión y nos acaban de anunciar en su blog que el nuevo modo “super estándar” será el que se use por defecto en Internet Explorer 8. La etiqueta meta se usará ahora para seleccionar el modo de compatibilidad con Internet Explorer 7. La nota de prensa: Microsoft Expands Support for Web Standards.

Actualización 7/3/08: En The Default Layout Mode, el equipo de IE8 nos explica cómo va a funcionar la selección del modo en IE8:

  • Si el !DOCTYPE es uno de los que activa el modo estándar o es uno desconocido, se usará el modo “super estándar”.
  • Si el !DOCTYPE es uno de los que activa el modo Quirks, se usará dicho modo.
  • Para activar el modo IE7, se usará la etiqueta: <meta http-equiv="X-UA-Compatible" content="IE=7">

Actualización 11/6/08: Microsoft nos propone una vuelta de rosca más. Resulta que en los entornos que implementaban la cabecera HTTP “X-UA-Compatible: IE=IE7” globalmente, las páginas no estándar, aquellas cuyo DOCTYPE indica que son “quirks“, igualmente se renderizaban de forma estándar, y esto no es lo que hacía IE7, ya que IE7 sí que respetaba el DOCTYPE para usar el modo estándar o no. Así que desde la actualización de seguridad de Junio del IE8 beta 1 hay disponible un nuevo valor para esta cabecera HTTP, el “IE=EmulateIE7” para indicarle al navegador que se comporte como IE7 también en la intepretación de los DOCTYPEs. Lo podemos usar en la cabecera HTTP:

X-UA-Compatible: IE=EmulateIE7

o como un meta en la propia página:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

Actualización 4/12/08: Microsoft incluye en la beta de IE8 un botón de Compatibility View para emular el comportamiento de IE7: Introducing Compatibility View. Como han visto que los usuarios no tienen costumbre de activar la Compatibility View y aún hay muchas webs incompatibles con IE8, han decidido distribuir con las actualizaciones automáticas listas de sitios que necesitan funcionar en modo compatibilidad con IE7: Compatibility View Improvements to come in IE8. Cuando las cosas se hacen mal desde el principio, luego para arreglarlo, todo es chapuza sobre chapuza.

Actualización 17/2/09: Resumen de los esfuerzos de Microsoft para hacer el IE8 respetuoso con los estándares por defecto y compatible con las páginas existentes para IE6 e IE7: Just The Facts: Recap of Compatibility View.

Actualización 13/3/09: Aunque se use el modo de compatibilidad con Internet Explorer 8, hay cosas que en Internet Explorer 7 se veían bien y que con el modo de compatibilidad no lo harán: Site Compatibility and IE8.

:wq

PD: Sí, sí, lo sé… algunas páginas de este blog no se ven bien en Internet Explorer 6, que hace cosas raras como cortar las entradas por la mitad, pero ¡no tengo ninguna intención de poner hacks para arreglarlo!

Entradas relacionadas

6 Comentarios a “Internet Explorer 8 y el nuevo “super-duper standards mode””

  • nachopro dice:

    Así se habla Coco! me pasé años trabajando en una empresa como desarrollador PHP e IE6 Hacker, haha… era gracioso porque los diseñadores gráficos (que poco sabían de maquetación web) me llamaban a cada rato para que les “arregle los CSS” así se veían bien en FireFox :P

    Por suerte, si bien sigo siendo desarrollador PHP, no estoy más en el rubro de sitios webs y/o IE6 Hacking.

    Saludos cordiales

    pd: acorde a tu pedido, pasá por mi sitio y disfrutá del Feed ;)

  • Ringmaster dice:

    Interesante lectura sobre la evolución de los estándares de la W3C y cómo Microsoft tarda años en arreglar sus programas; y cuando los arregla nos pretende enchufar un nuevo sistema operativo… en fin, que gracias por iluminarnos.

  • eMulo dice:

    Hola Coco. A pesar de que leo tu blog religiosamente todos los días, pocas veces escribo; sin embargo hoy no lo resistí ;-)

    Toda mi vida me he desempeñado como desarrollador web y he visto los cambios que ha sufrido esta tecnología casi desde sus inicios. Siempre hemos padecido del mismo problema con Microsoft; ahora mismo tengo en el mercado un producto web y se ve diferente en IE6, IE7 y Firefox (aunque en estos dos últimos es muy similar), así que debo hacer una página web un CSS diferente para cada navegador; y como si fuera poco, IE6 no soporta PNGs con transparencias, así que utilizo un hack que no en todos los casos funciona.
    ¿El desarrollo? es una pesadilla! Generalmente desarrollo en Debian (mi pasión) y pruebo allí mismo en IE6 utilizando IEs4Linux y Firefox para Linux (Iceweasel en Debian); una vez esté bien, voy a Windows y pruebo en IE7.

    Espero que IE8 no sea un browser más a soportar como lo han sido el resto de versiones de Internet Explorer.

    PD. Felicitaciones por tu blog. Espero algún día mantener un blog tan interesante como el tuyo :-D

  • @eMulo Me alegro mucho de que te guste el blog :-)

    Sí, el tema de los PNGs también ha sido un grave problema durante mucho tiempo, así como el de los SVG, problema que ha afectado en mayor o menor medida a muchos navegadores.

    Y sí, esperamos que el camino iniciado con IE7 se complete con IE8 y sólo haya que hacer una web estándar que funcione donde sea. También habrá que esperar que los usuarios de IE instalen masivamente el IE7 y el IE8 y ¡abandonen de una vez el IE6!

    Gracias por compartir aquí tu experiencia.

  • Raist dice:

    Me ha parecido muy interesante el articulo , y muy bien relatado . A parte de que el blog en general es interesante . Esperemos que poco a poco microsoft vaya pasando por el aro , que creo que cada vez le esta tocando mas . Un saludo a todos . A ver si me pongo mas en serio con la programación web que estoy muy desfasado .

  • @Raist Muchas gracias. Me alegro de que te haya gustado.

Tema LHYLE09, creado por Vicente Navarro