La pregunta la plantea Jeffrey Zeldman en su muro en Facebook: «Do websites need to look the same in every browser? » y para ilustrarla usa la siguiente imagen:
Aparte de las diferencias que no estoy segura de si se deben a un recorte en la imagen o realmente a cómo presenta el sitio el segundo navegador, es decir, como más cuadrado y con mayor espacio por abajo; lo que realmente me llamó la atención es cómo luce el cuadro, cómo luce la persona retratada en la segunda imagen, que parece desequilibrada mentalmente, con unos ojos muy abiertos y como con rosácea.
Por eso investigué y descubrí que ¡se trata de una obra creada sólo mediante CSS! Lo aclara la autora en los metatags del código fuente:
Me resulta asombroso el nivel que han alcanzado las hojas de estilo y los navegadores en su entendimiento y representación de las mismas, desde aquellos años en los que apenas servían para poner algo de color a los textos y posicionar elementos en la pantalla. Hoy en día las hojas de estilo sirven incluso como pinceles para crear una obra de arte.
Precisamente por ello, aunque la mayoría si no todos los que respondían a Zeldman en su muro lo hacían con un rotundo NO, no puedo estar más en desacuerdo… en parte. Es decir, claramente los sitios no tienen que lucir exactamente igual en todos los navegadores, lo fundamental es que cubran al menos la accesibilidad y usabilidad; pero dado el nivel de riqueza pictórica, sí pictórica, que han alcanzado las hojas de estilo, resulta esencial una correcta representación de las mismas. Queda claramente demostrado con la siguiente captura en la que presento el mismo sitio en cuatro navegadores distintos:
El resultado es asombroso, casi tanto como la obra original. De izquierda a derecha y de arriba abajo: La primera, una representación bastante aceptable, la segunda, nuevamente una desequilibrada con rosácea y con reborde y píxeles en el óvalo del rostro, la tercera una caricatura y encima mal y la cuarta, la mejor de todas, muy delicada y excelente representación.
Desvelo el misterio:
- Google Chrome, 78.0.3904.87 (Build oficial) (32 bits)
- Firefox Browser 70.0.1 (64-bit)
- Microsoft Edge 44.17763.771.0
- Opera, 64.0.3417.92
<ironía>Microsoft Edge a la vanguardia siempre</ironía>. Realmente criminal.
Las capturas no permiten ver el detalle. Comprobad por vosotros mismos con diversos navegadores entrando en: Pure CSS Lace
Creo que Zeldman iba precisamente por ahí, que realmente no preguntaba si todos los sitios han de verse igual en todos los navegadores, sino que destacaba la importancia de que los navegadores representen de manera correcta las reglas de las CSS u hojas de estilo.
Definitivamente y siempre ha sido así, Opera es el navegador que mejor implementa los estándares. Aunque aún echo en falta el elemento <link> y cómo lo implementaba Opera.
Y bueno, por otra parte, es realmente asombroso lo que se puede hacer hoy en día con las hojas de estilo, cuando tienes talento y conocimiento. Mi enhorabuena para la artista y experta, realmente experta, en CSS Diana A. Smith. Diana ha sido entrevistada por su trabajo y en el vídeo muestra otras vistas de representación de sus obras en diversas versiones de navegadores, lo que resulta incluso hilarante: