¿Esto es un bug de navegadores o qué? (condicionales)

metacortex · #1 (**permalink**) 01/06/2009, 02:23

Estaba experimentando si con HTML podía resolver un lío de condicionales de navegador. Entonces me puse a seguir un tuto de la página de microsoft y -como lo esperaba- no funcionó. Me paseé un poco por google a ver qué encontraba y prácticamente repetían como loros lo que decía el manual de MS.

A esa hora me puse a trastear un poco por mi cuenta (más por aburrimiento que otra cosa) y cometí un error en la sintaxis de la condicional... Pues ese error dio resultado

.

Fíjense en lo siguiente, la forma correcta de colocar las condicionales -por ejemplo- sólo para IE es:

Código html:

Ver original<!--[if IE]>Tal cosa<![endif]-->

Luego quise colocar un trozo que lo leyeran todos menos IE, y según el tuto es así:

Código html:

Ver original<!--[if !(IE)]>Tal cosa<![endif]-->

Pero eso no funciona. Ahora bien, lo que inexplicablemente funcionó fue esto:

Código html:

Ver original<![if !(IE)]>Tal cosa<![endif]>

Fíjense que le volé los dos guiones (--) en la etiqueta de apertura y cierre. Actualmente tengo los dos pedazos de código funcionando bien, uno para IE (con los guiones) y otro para los demás (sin guiones). Extraño pero cierto. Véanlo funcionando en mi blog, darioferrer.com (tuve que colocarlo así para solucionar un problema con el <embed> de los videos).

Lo más probable es que solucione el problema con php (usar el HTML para esas funciones lo veo un poco pasado), pero definitivamente no deja de ser una curiosidad.

iwexcoder · #2 (**permalink**) 01/06/2009, 05:22

Que buen dato a tener en cuenta a la hora de los condicionales. Una opcion mas para ayudarnos al momento de diseñar nuestros sitios para los diferentes navegadores

Mikmoro · #3 (**permalink**) 01/06/2009, 07:02

Me parece muy curioso, la verdad, y probaré alguna cosa a ver si entiendo por qué ocurre esto, pero no obstante: ¿qué utilidad tiene un "si no es IE"? no lo acabo de ver.

Quiero decir: en realidad esto

Cita:

<head>

<![if !(IE)]><style type="text/css">
.caja {color: #0f0;}
</style>
<![endif]>
</head>

debe ser exactamente lo mismo que esto

Cita:

<head>
<style type="text/css">
.caja {color: #0f0;}
</style>

</head>

¿no?

buzu · #4 (**permalink**) 01/06/2009, 08:32

Eso mismo me preguntaba yo. Además, creo que es más 'correcto' hacer un if para IE y no para los que no sean IE ya que considerando que los condicionales fueron implementados por IE. Es más se me ocurre que esa sea la razón por la que no te funcione con los guiones (--). Debido a que los navegadores 'normales' no entienden esos condicionales, los toman como comentarios normales y no ejecutan las instrucciones. Al quitarle los guiones (--) los comentarios se convierten en otro elemento y es leído, aun que probablemente tu navegador te tire algún error, o si no lo hace el navegador, probablemente el validador si lo haga.

kseso? · #5 (**permalink**) 01/06/2009, 09:38

Como curiosidad está ahí para encontrar el porqué, pero como ya intuía Buzu, al querer validar el html como XHTML 1.0 Strict te marca 9 errores por ese "no comentario"

webosiris · #6 (**permalink**) 01/06/2009, 10:51

en realidad no es ningún error

es algo lógico. Los comentarios condicionales solo los soporta IE. Así que si tu pones algo dentro de un comentario, sea lo que sea que tenga dentro los demás navegadores los van a interpretar como lo que es, un comentario

Mikmoro · #7 (**permalink**) 01/06/2009, 10:54

Si fuera así, este código:

Cita:

<![if !(IE)]><style type="text/css">
.caja {color: #0f0;}
</style>
<![endif]>

no sería interpretado por el resto de navegadores, pero sí lo es.

metacortex · #8 (**permalink**) 01/06/2009, 12:49

Cita:

Iniciado por Mikmoro

¿no?

Lo que pusiste funciona en la parte de CSS, pero la cuestión surge cuando metes código HTML dentro del body (Échale un ojo al código fuente de mi blog) ya que por supuesto IE procesaría ambos trozos mientras los demás navegadores sólo lo harían con 1. El lío de ayer era precisamente eso: lograr que IE sólo leyera 1 trozo también.

metacortex · #9 (**permalink**) 01/06/2009, 13:26

Pues sí, creo que es un bug pero no se de quién

. IE no renderiza esa etiqueta errónea (la que no tiene los guiones) pero Firefox y Opera sí. Por supuesto el validador salta con alarmas y sirenas, pero la herramienta Tidy lo pasa

-debe ser que mi burrada fue tan grande que aún no se encuentra en ninguna base de datos-.

En fin, ya lo arreglo con php, pero hubiese sido magnífico que el error pasara como "bueno" por todos lados. Aún así funciona, al menos con IE, opera y FF. Safari (Windows) se porta extraño y pregunta si deseo guardar el archivo o verlo en un editor externo (bajo la etiqueta de "Aviso de seguridad") pero luego me enteré de que es un problema propio del navegador.

buzu · #10 (**permalink**) 01/06/2009, 13:27

Mikmoro, es interpretado por el resto de los navegadores por que eso no es un comentario. (si es que entendí bien tu respuesta).

Metacortex, por que no intentas abrir unos somentarios si el navegador e IE y los cierras al terminar la parte que no quieres que sea interpretada por IE, de ese modo creo que tendrías un documento valido ya que IE va a interpretar los condicionales, abrir comentarios, por lo que el código siguiente (el que no quieres que se muestre) va a ser interpretado como un comentario por IE y los otros navegadores solo interpretarán la apertura y el cierre de los comentarios como comentarios, y el código como código.

kseso? · #11 (**permalink**) 01/06/2009, 14:05

<![if !(IE)]>
¿Y no podría ser que los navegadores eso lo interpretan como una etiqueta más (mal escrita, sin definir, etc) no le hacen caso a la hora de tratarla (darle estilos, identificarla como un elemento...) pero el código contenido en ello sí lo reconocen como válido y lo ejecutan?
Y con este "razonamiento"

lo que hace ie es esperar un cc por el inicio y saltarle los plomos e ignorarlo porque no termina de ser lo que esperaba?

buzu · #12 (**permalink**) 01/06/2009, 14:12

Eso es exactamente lo que vengo diciendo Kseso?

kseso? · #13 (**permalink**) 01/06/2009, 14:20

Vaya, pues creí entenderte que tu decías que eso no es un comentario (en lo que todo el mundo está de acuerdo) y que le proponías que encerrase en un cc el "no cc".

Yo no entraba en lo que pueda ser para los navegadores sino en cómo podrían verlo/interpretarlo y actuar en consecuencia.

Leería mal

buzu · #14 (**permalink**) 01/06/2009, 15:47

hummm... ya me confundí *-* jaja.

Mikmoro · #15 (**permalink**) 01/06/2009, 15:50

Buzu: creo que no has seguido bien el hilo de esto:

Cita:

Iniciado por webosiris

Así que si tu pones algo dentro de un comentario, sea lo que sea que tenga dentro los demás navegadores los van a interpretar como lo que es, un comentario

Cita:

Iniciado por Mikmoro

Si fuera así, este código:
no sería interpretado por el resto de navegadores, pero sí lo es.

Es decir, le respondo: "si fuera un comentario como dices...", etcétera.

buzu · #16 (**permalink**) 01/06/2009, 16:02

Esa fue de la manera en que yo lo entendí, es decir, si:

<![if !(IE)]><style type="text/css">
.caja {color: #0f0;}
</style>
<![endif]>

fuera un comentario, no sería interpretado por los navegadores, pero si lo es.
Lo único que yo te digo es que la razón por la que si es interpretado es por que no es un comentario. No trato de corregirte, más bien de reafirmar tu punto.

metacortex · #17 (**permalink**) 01/06/2009, 16:38

Cita:

Iniciado por Mikmoro

Si fuera así, este código:

Cita:

<![if !(IE)]><style type="text/css">
.caja {color: #0f0;}
</style>
<![endif]>

no sería interpretado por el resto de navegadores, pero sí lo es.

Me había perdido este post de Mikel. Exactamente la interrogante va por esa vía ¿por qué IE ignora esa parte y los demás no?. Misterio.

Aún así -y a manera de "moraleja" de esta experiencia- no me atrevo a aprovechar los bugs de navegadores para definir la maquetación de una web. Antes que eso creo que es mejor tratar de entender por qué sucede y hasta dónde llegan.

Lamentablemente estas cosas no son exclusivas del IE. Firefox, Opera y Safari están colmados de bugs que cambian de uno a otro. No pocas veces me he tropezado con casos en los que -a pesar de que la estructura y estilos están correctos- la diferencia de visualización es enorme entre éstos.

Desde hace tiempo he seguido un método para corregir estos errores de renderizado: hacer las cosas lo más simples que se pueda (he notado que la "divitis" -uso indiscriminado de capas anidadas- es una de las principales causas de problemas, sobre todo si cada capa tiene estilos diversos asignados).

Volviendo al tema, recomiendo no aplicar este código erróneo en sus webs. Puede que ahora "funcione" pero no es más que un error, el cual seguramente será corregido tarde o temprano por los desarrolladores de los navegadores.

inmortal009 · #18 (**permalink**) 01/06/2009, 17:10

Debe ser que IE interpreta todo lo que tnega ! como comentario pero los demas no y quizas a los ingenieros de MS se les olvido eso y como casi nadie consulta eso no se han dado cuenta, mandales un email corrigiendo el supuesto bug a ver que opinan ellos

buzu · #19 (**permalink**) 01/06/2009, 22:04

Me gusta la moraleja de Metacortex, de hecho esa es una de las razones por las que me he unido al minimalizmo.

PatomaS · #20 (**permalink**) 01/06/2009, 23:51

Hola

Bueno, el tema parecía ciertamente interesante, sin embargo, no tenía mucho que aportar, así que me mantuve leyendo; hoy, con un poco más de tiempo, empecé a buscar sobre el tema y encontré algunas cosas. Pero antes de pasar a lo que encontré comento.

En linux, firefox 3.0.10 no mostró el video, arora 0.7 tampoco, konqueror 3.5.9 tampoco y explorer 5.5 y 6 de ies4linux tampoco, sin embargo, opera 9.64 si.

Ahora paso a lo que encontré.
En esta página del msdn, explican bien la sintaxis que terminaste usando, es lo que llaman Downlevel-revealed Conditional Comments y según la documentación, lo usan justamente para generar reacciones determinadas en otos navegadores, en teoría, todos los navegadores deberían reconocer la etiqueta mal formada, pasar de ella, mostrar un error y seguir con el código que esté dentro, si ese es válido, usarlo.

Luego llegué a este hilo en un foro, del cual, el tercer mensaje, o primera respuesta del autor del hilo, es muy interesante, ya que mediante el "guardar como", nos muestra lo que firefox hace con el código.

Tras revisar la DTD que estás usando y las especificaciones que dbe seguir un navegador según el w3c, parece que cualquier navegador que muestre lo que habías puesto dentro de las etiquetas, hace las cosas bien y cualquiera que no, la shace mal o simplmente no cumple las normativas.

Tomando en cuenta la estructura de los comentarios, la cual en html obliga a que empiecen por <!--, y si no, es cualquier otra cosa, los navegadores entienden que eso no es un comentario. Transformaciones como la que vemos en el ejemplo del foro, indican la "interpretación del espíritu de la acción" por parte de los navegadores; aquí podemos argumentar si deberían apegarse más a la regla o al espíritu de lo que queríamos hacer y considerar cualquiera de las opciones un bug; personalmente creo que alejarse de la regla y usar interpretaciones es un bug.

Así que por extensión, hubiera dado igual que pusieras lo que pusiste o que pusieras <cualquier_cosa>código</cualquier_otra_cosa>. Pero claro, eso es la teoría.

En resumen, quien sabe, es u nbug, no es un bug, hay explicaciones para lo que pasó, pero también hay mucha inconsistencia.

Felicidad

Mikmoro · #21 (**permalink**) 02/06/2009, 00:04

Pues mi conclusión es que vuelve a ser un bug de IE, y me explico:

- tenemos un CC , que hace que sólo IE interprete lo que hay dentro pintando el texto, y el resto no lo hace.
- si añadimos ahí una negación , funciona perfectamente, es decir, IE no lo pinta por ser "si no IE", los demás tampoco porque sigue siendo un comentario normal, pero no tiene sentido porque sólo IE lo entiende, así que no sirve de nada.
- por último, si eliminamos los guiones y mantenemos la negación <![if ! IE]>Texto de prueba<![endif]-->, funciona como se esperaba, ya que por un lado, para la mayoría de navegadores ya no hay comentario sino simplemente una etiqueta errónea, así que la obvian y pintan lo que hay dentro, mientras que IE sigue considerándolo un comentario gracias al <!, y sigue respetando la negación de IF NOT IE, por lo que no pinta nada.

Conclusión: un error más de IE que considera un comentario algo que no lo es, y el descubrimiento por otro lado de que el condicional acepta la negación IF NOT.

buzu · #22 (**permalink**) 02/06/2009, 00:21

HECHO, es un bug y de eso no hay duda. A pesar de no haber hecho una investigación tan exhaustiva como la de PatomaS, muy buena por cierto, creo que no me equivoco al afirmar que es un Bug de IE al tomar como CC algo que claramente no lo es, mientras que "los otros" hace bien su trabajo, tirando un error (como predije desde un principio) y mostrando el texto o el contenido que al no ser comentario, es tomado como contenido.

Nuevamente me gustaría decir que la moraleja a la que se ha llegado es lo mejor que podemos tomar de este post, aun que claro, toda la información extra no deja de ser buena.

Mikmoro · #23 (**permalink**) 02/06/2009, 01:31

Cita:

Moraleja
Niños: no usen etiquetas obsoletas, inválidas y absurdas, porque todos los navegadores contienen errores y podrían interpretarlas mal

Sin ánimo de ofender, quizá una gran moraleja, pero yo me reafirmo en lo que dije en mi primer mensaje: me parece incongruente usar un método "si no es IE", habiendo un método "si es IE" más claro y sencillo para conseguir el mismo resultado (que por cierto es evidente que funciona exactamente igual de bien para CSS en el header como para HTML en el body).
Seguramente esto fue útil en la época en la que todo el mundo diseñaba exclusivamente para Explorer, de tal manera que se necesitó una forma de decir: "en el hipotético caso de que usted no esté usando Internet Explorer, algo muy poco probable, [...]", pero hoy en día, creo que es absurdo.

En fin, una conversación algo extraña pero entretenida

PatomaS · #24 (**permalink**) 02/06/2009, 01:32

Hola

Aunque tiendo a acordar con que sea un bug de Explorer, no puedo decirlo tan rotúndamente ya que no se cuales son los caracteres que elos toman en cuenta para hacer funcionar su código; no se si incluyen el inicio del comentario válido o solo los que está entre corchetes, o tal vez lo que está entre corchetes con el < delante ¿alguien lo ha probado?. Sería interesante saber cuál es la cadena detonadora de las acciones del explorer.

Por otro lado, y basándome solo en mi caso, Firefox lo hizo mal dfesde dos puntos de vista, uno al no mostrarme el video y dos al hacer lo que mencionan en el ejemplo del foro que cité antes. Eso no lo probé yo, así que no puedo decir que me haya pasado.

El mismo fallo estaría en todos los que no me lo mostraron, lo que deja fuera de combate a todos menos opera, al menos en este caso.

Por cierto que estas últimas frases me llevan a otra curiosidad ¿dicen en realidad los navegadores que cumplen con las normas del w3c o solo lo dicen de forma relativa, así disimulada entre palabrerío?. Lo digo porque los criterios de compliant son muy claros. A ver si consigo en alguna parte alguna declaración oficial del tipo "nosotros si somos w3c compliant"

;)

Felicidad

Mikmoro · #25 (**permalink**) 02/06/2009, 01:36

Cita:

Iniciado por PatomaS

no se si incluyen el inicio del comentario válido o solo los que está entre corchetes, o tal vez lo que está entre corchetes con el < delante ¿alguien lo ha probado?.

Sí, como muestro en mi penúltimo mensaje lo he probado, y como comentaba lo que lo hace funcionar es el <! delante y el cochete, que no es realmente necesario como ponía meta al principio (con el paréntesis para el IE <![if !(IE)]>), sino basta con añadir la negación <![if ! IE]>, según mis pruebas.

PatomaS · #26 (**permalink**) 02/06/2009, 01:53

Hola

Cierto, cierto, lo mencionabas, es que mi dspiste es así ...

Entonces podemos decir que "<![if" son los caracteres mágicos ... y mediante algún código, o simple eliminación, detectan/usan/borran los guiones.

Sobre lo del compliant, revisando las features de Firefox, no mencionan nada explícitamente, solo que usan estándares, que lo hacen muy bien y muy rápido.

Por otro lado, Opera si tiene una página muy detallada de lo que soporta y no soporta. Dado que no dice hacer las cosas 100% bien, no tendría pecado.

Por otro lado, conseguí una página, o mejor dicho, me volví a tropezar con una página que es muy interesante y creo que alguna vez les puede ser útil, así que si no la tienen, aquí se las paso.

Felicidad

Mikmoro · #27 (**permalink**) 02/06/2009, 04:22

Cita:

Iniciado por PatomaS

Por otro lado, conseguí una página, o mejor dicho, me volví a tropezar con una página que es muy interesante y creo que alguna vez les puede ser útil, así que si no la tienen, aquí se las paso.

¡Mádito inglés! No, si al final voy a tener que estudiarlo. Me pelearé con ello porque eso tiene buena pinta. Gracias.

buzu · #28 (**permalink**) 02/06/2009, 09:02

PatomaS nuevamente con sus enlaces interesantes. Gracias por tanta info y por tus aportes tan acertados.
Ahora, si llegamos a la conclusión de que lo que hace funcionar los CC es <![, entonces, me parece una mala implementación ya que deja el espacio abierto para que otros navegadores traten de interpretar eso como una etiqueta más, a diferencia del <!-- que se interpreta como un comentario evitando así cualquier intento de interpretación por parte del navegador. Esa es solo mi opinión claro está.

Saludos