Probando el soporte de estándares web en 20 navegadores

Publicado el en Reflexiones, Tecnología, Curiosidades por Jaime Gómez Obregón.

Nos hemos preocupado especialmente de que nuestro sitio web cumpla a rajatabla todas las especificaciones y validaciones posibles, tanto de marcado (XHTML 1.1) como de diseño (CSS 2.1) y de accesibilidad de los contenidos (WAI-AAA). En teoría un documento web marcado conforme a los estándares internacionales debería de verse igual en cualquier navegador que soporte estos estándares, cualquiera que sea la plataforma del usuario.

Y en teoría la teoría y la práctica deberían de coincidir, pero naturalmente en el caso del desarrollo web esto tampoco ocurre. Por una parte no todos los navegadores respetan las especificaciones que garantizan la compatibilidad, y por otra no todos se ciñen a las mismas con el mismo nivel de compromiso.

Quizás el ejemplo más significativo de esto último sea el navegador Microsoft Internet Explorer 6.0, el browser mayoritario, con una cuota de uso superior al 85% del mercado, que sin embargo lleva desde su lanzamiento en 2001 mostrando un desinterés muy grande por ajustarse a las recomendaciones del W3C. Pese a todo, parece que la presión sobre Microsoft para que se implique en una World Wide Web más compatible y multiplataforma ha surtido un efecto parcial y que la nueva versión de Internet Explorer, la 7.0, se ajustará a las especificaciones un poco mejor que su obsoleta hermana.

Para conocer la adhesión a los estándares de un navegador web se podría hacer un largo y complicado estudio sobre el soporte para todas y cada una de las funciones de todos los estándares implicados, que son muchos y complicados. O utilizar un atajo y probar el navegador con el test Acid2, que es un testcase o "prueba de fuego" para comprobar la calidad del software que se estudia. Se carga el test en el navegador, y cuanto más se parezca el resultado obtenido con el renderizado de referencia (en la imagen), más compatible es el navegador -a grandes rasgos- con los estándares web.

Renderizado de referencia del test Acid 2 Renderizado de referencia
del test Acid 2.
Con Safari 2.0.3 Con Safari 2.0.3
Con Mozilla Firefox 3.0 build 2006102405 Con Mozilla Firefox 3.0 build 2006102405
(versión en desarrollo)
Con Mozilla Firefox 1.5 Con Mozilla Firefox 1.5
Con Netscape 7.2 Con Netscape 7.2
Con Microsoft Internet Explorer 7.0 Con Microsoft Internet Explorer 7.0
Con Microsoft Internet Explorer 6.0 Con Microsoft Internet Explorer 6.0

De entre los navegadores más conocidos, sólo Safari, Konqueror y Opera superan el test a la fecha de edición de este artículo, según se cita en la Wikipedia, de donde también se han tomado las capturas de pantalla que se adjuntan. Es destacable que los dos primeros utilizan el mismo motor de renderizado, KHTML, una librería open-source desarrollada para el escritorio KDE.

El test Acid 2 es un conjunto de situaciones difíciles pensado especialmente para poner en apuros los motores de layout de los navegadores web. Con la intención de enfrentar a varios navegadores a un test mucho más real, hemos probado también a cargar la portada de nuestro sitio web, escrito conforme a los estándares, en diferentes versiones de los navegadores más conocidos.

El benchmark ha consistido en arrancar cada navegador con la configuración predeterminada proporcionada por el fabricante o desarrollador, cargar la portada, y utilizar después el menú de navegación para saltar desde allí a la sección de Gestión de Contenidos. No se ha instalado ningún plugin o control adicional.

En el banco de pruebas se han incluído productos experimentales (Amaya), de modo texto (Lynx y Links), inacabados (Dillo) u obsoletos (Internet Explorer 5.01 y 5.5). También comprobamos la respuesta del novísimo Internet Explorer 7.0, que será liberado oficialmente por Microsoft mañana día 1 de noviembre de 2006. En total, la comparativa abarca 20 navegadores sobre seis plataformas distintas: Windows (Escritorio y Mobile), GNU/Linux, Macintosh, UNIX, Solaris y Symbian.

Junto con cada captura de pantalla, a continuación indicamos el nombre y versión del navegador bajo análisis, y en los casos más significativos la fecha de aparición.

Amaya 9.51 Amaya 9.51.
Dillo 0.8.5 Dillo 0.8.5
Epiphany 1.6.4 Epiphany 1.6.4
Mozilla Firefox 1.0.8 Mozilla Firefox 1.0.8
Galeon 2.0.2 Galeon 2.0.2
Microsoft Internet Explorer 5.01 Microsoft Internet Explorer 5.01 (Noviembre de 1999)
Microsoft Internet Explorer 5.5 Microsoft Internet Explorer 5.5 (Junio de 2000)
Microsoft Internet Explorer 6.0 Microsoft Internet Explorer 6.0
Microsoft Internet Explorer 7.0 Microsoft Internet Explorer 7.0
Konqueror 3.5.5 Konqueror 3.5.5
Links 1.00pre12 Links 1.00pre12
Lynx 2.8.5rel.1 Lynx 2.8.5rel.1
Mosaic Mosaic
Mozilla 1.7.13 Mozilla 1.7.13
Nokia 6680 (Symbian) Nokia 6680 (Symbian)
Opera 9.0.2 Opera 9.0.2
Safari 2.0.4 Safari 2.0.4
IE sobre Windows Mobile en una PDA IE sobre Windows Mobile en una PDA
Seamonkey 1.0.5 Seamonkey 1.0.5
Mozilla Firefox 1.5.0.7 Mozilla Firefox 1.5.0.7

En realidad esto no tiene ningún interés práctico, pues solamente dos familias de producto —Microsoft Internet Explorer y Mozilla Firefox— abarcan por sí solos el 91,7% de la cuota de mercado. Sin embargo, es un experimento divertido y de una cierta importancia técnica para todos los interesados en el desarrollo web en general y los estándares web en particular.

La visualización es perfecta en cualquiera de los navegadores actuales: Internet Explorer 6.0 y 7.0, Firefox 1.0.8 y 1.5.0.7, Mozilla 1.7.13 y Opera 9.0.2, tanto en la portada como en las hojas interiores.

Internet Explorer 5.0.1 y 5.5 muestran correctamente el cuerpo de la hoja, pero acusan problemas con la imagen de fondo del diseño, que aparece en ambos casos cortada incorrectamente. Esto es razonable puesto que estos productos son de noviembre de 1999 y julio de 2000 respectivamente, y la especificación XHTML 1.1 que nosotros usamos en el sitio web es de mayo de 2001. Es decir, estos navegadores antiguos no soportan el lenguaje que hemos usado para describir nuestro sitio web. Aún así, la legibilidad y la navegabilidad son correctas en estos casos.

Dillo 0.8.5 es un navegador experimental muy ligero escrito en C que todavía no implementa soporte CSS, por lo que directamente ignora toda la estética del diseño. Pese a todo, nuevamente la navegabilidad y la legibilidad de los contenidos es posible sin mayor inconveniente que la ausencia de imágenes.

Amaya 9.51 supera el renderizado del layout, pero tiene problemas con las imágenes. Esto no nos preocupa: Amaya, que es el navegador experimental del W3C, tiene serios problemas para mostrar correctamente el propio sitio web de la oficina española del W3C. Es, no obstante, un gran producto con una de las pocas implementaciones SVG que conocemos, aunque inferior a Gecko, KHTML u Opera.

Lynx 2.8.5rel.1 y Links 1.00pre12, ambos con su render en modo texto, son la prueba de fuego en todo desarrollo web: si con estos navegadores carentes de Javascript, Flash, Java y ActiveX no se puede navegar el sitio, entonces también tendrán problemas los motores de búsqueda tipo Google, Yahoo! o MSN. Afortunadamente la legibilidad y la navegabilidad del sitio en este árido terreno de la línea de comandos es igualmente correcta.

Tampoco hay problemas para acceder y utilizar el portal desde un teléfono móvil, el Nokia 6680 en nuestro caso. A pesar del reducido tamaño de su pantalla (2,1"), el contenido escala con facilidad y los textos se mantienen legibles.

Una de las capturas de pantalla corresponde a NCSA Mosaic: el primer navegador web de la historia y el patriarca de la World Wide Web y el HTML. Basado en los trabajos del mismísimo Tim Berners-Lee —luego premio Príncipe de Asturias a la Investigación Científica y Técnica—, Mosaic es hoy un cadáver de la prehistoria de Internet que hemos rescatado y compilado para esta proof of concept. Aunque con todas las limitaciones de 1996, como la falta de soporte UTF-8 para caracteres no anglosajones tales como los acentos, un sitio web actual escrito conforme a los estándares web conserva mucha de su legibilidad y toda su navegabilidad sobre este software.