Si usted y amp; apos; han estado diseñando páginas web durante más de unos pocos meses, lo más probable es que conozca la dificultad de escribir una página que se vea igual en todos los navegadores. De hecho, eso es imposible. Muchos navegadores fueron escritos con características especiales que solo ellos podían manejar. O tienen formas especiales de manejar cosas que son diferentes de cómo los manejan otros navegadores. Por ejemplo:
& lt; pre & gt; DOCTYPE
& lt; / pre & gt ;
llamadas.
- Las capas se crearon para su uso en navegadores Netscape. No funcionan en ningún otro navegador y, de hecho, han quedado en desuso en Netscape 6.x +.
- Los cuadros en línea se crearon originalmente solo para Internet Explorer, y desde entonces se han convertido en parte de la especificación HTML.
-
Internet Explorer 6.0 agrega un espacio adicional (como a
& lt; br & gt ;
) etiquetas circundantes a menos que escriba el contenido del div todo en una línea (larga). (IE 6 tiene muchas más peculiaridades además de esta.) & lt; / br & gt ; - Netscape 4.7 no mostrará tablas que no estén escritas en HTML correcto; en su lugar, muestra una página en blanco. Esto se solucionó en Netscape 6.
Video destacado
El problema para los desarrolladores de navegadores es que tienen que crear navegadores web que sean compatibles con versiones anteriores de páginas web creadas para navegadores más antiguos. Para abordar este problema, los fabricantes de navegadores crearon modos para que los navegadores operen. Estos modos se definen por la presencia o ausencia de un elemento DOCTYPE y qué es eso
& lt; pre & gt; DOCTYPE
& lt; / pre & gt ;
llamadas.
DOCTYPE Switching y & amp; # x201C; Quirks Mode & amp; # x201D;
Si pones lo siguiente
& lt; pre & gt; DOCTYPE
& lt; p / & gt ;
Los navegadores modernos (Android 1+, Chrome 1+, IE 6+, iOS 1+, Firefox 1+, Netscape 6+, Opera 6+, Safari 1+) interpretarían esto de la siguiente manera:
- Debido a que hay un & lt; pre & gt; DOCTYPE & lt; / pre & gt; escrito correctamente, esto activa el modo de estándares.
- It & amp; apos; s un documento de transición HTML 4.01
- Debido a que está en modo estándar, la mayoría de los navegadores harán que el contenido sea compatible (o mayormente compatible) con HTML 4.01 Transitional
Y si pones esto
& lt; pre & gt; DOCTYPE
& lt; p / & gt ;
Esto le dice a los navegadores modernos que desea mostrar su página HTML 4.01 en estricto cumplimiento con el DTD. Estos navegadores entrarán en & amp; quot; strict & amp; quot; o & amp; quot; standards & amp; quot; mode y renderizar la página de conformidad con los estándares. (Entonces, para este documento, etiquetas como podrían ser completamente ignoradas por el navegador, ya que el elemento FONT ha quedado en desuso en HTML 4.01 Strict.)
Si dejas el
& lt; pre & gt; DOCTYPE
& lt; p / & gt ;
La siguiente tabla muestra lo que hacen los navegadores comunes cuando se presentan con diferentes comunes
& lt; pre & gt; DOCTYPE
& lt; p / & gt ;
Microsoft lo hace más difícil
Internet Explorer 6 también tiene la característica de que si coloca algo por encima de
& lt; pre & gt; DOCTYPE & lt; / pre & gt; declaración, irán al modo peculiar. Entonces, ambos ejemplos pondrán IE 6 en modo peculiar, a pesar de que & lt; pre & gt; DOCTYPE
& lt; p / & gt ;
y el XHTML 1.1
& lt; pre & gt; DOCTYPE
& lt; p / & gt ;
Además, si superas IE6, entonces tienes el & amp; # x201C; feature & amp; # x201D; que Microsoft agregó en IE8 e IE9:
& lt; pre & gt; META & lt; / pre & gt; cambio de elemento
& lt; p / & gt ;
- Modo de peculiaridades IE 5.5 (IE 8 y 9)
- Modo estándar IE 7 (IE 8 y 9)
- IE 8 modo casi estándar (IE 8 y 9)
- Modo estándar IE 8 (IE 8 y 9)
- IE 9 modo casi estándar (IE 9)
- Modo estándar IE 9 (IE 9)
- Modo XML (IE 9)
IE 8 también introdujo & amp; # x201C; Modo de compatibilidad & amp; # x201D; donde el usuario puede elegir cambiar el modelo de renderizado nuevamente al modo IE 7. De modo que incluso si configura el modo que desea configurar usando ambos
& lt; pre & gt; DOCTYPE & lt; / pre & gt; y & lt; pre & gt; META & lt; / pre & gt; elementos, su página podría aún
& lt; p / & gt ;
¿Qué es el modo Quirks??
El modo Quirks se creó para ayudar a lidiar con todas las representaciones extrañas y el soporte y hacks de navegador no conformes que los diseñadores web estaban utilizando para lidiar con esas cosas. La preocupación que tenían los fabricantes de navegadores era que si cambiaban sus navegadores a un cumplimiento completo de las especificaciones, los diseñadores web se quedarían atrás. Al configurar
& lt; pre & gt; DOCTYPE
& lt; p / & gt ;
Efectos del modo Quirks
Hay varios efectos que la mayoría de los navegadores usan en el modo Quirks:
- En algunos navegadores, el modelo de caja cambia a la versión IE 5.5 del modelo de caja en modo peculiar.
- Algunos navegadores no heredan estilos en tablas
- El modo Quirks afecta dramáticamente el análisis del diseño CSS y CSS, si está convirtiendo páginas al modo estándar desde el modo de peculiaridades, asegúrese de probar su diseño CSS y analizar ampliamente.
- Esté atento a los cambios en las secuencias de comandos cuando esté en modo peculiar. Firefox cambia la forma en que & lt; pre & gt; id & lt; / pre & gt; El atributo funciona, por ejemplo. IE8 e IE9 tienen cambios muy dramáticos en las secuencias de comandos en modo peculiar.
También hay una diferencia en & amp; # x201C; Modo de estándares más cercanos: & amp; # x201D;
- La altura de las celdas de la tabla con solo imágenes en el interior se calcula de manera diferente al modo estándar.
Cómo elegir un DOCTYPE
Entro en más detalles en mi artículo
& lt; pre & gt; DOCTYPE & amp; amp; nbsp ;
& lt; p / & gt ;
- Elija siempre el modo estándar primero. Y el estándar actual que debe usar es HTML5: a menos que tenga una razón específica para evitar usar HTML5 & lt; pre & gt; DOCTYPE & lt; / pre & gt ;, esto es lo que debe usar.
- Vaya a HTML 4.01 estricto si necesita validar elementos heredados o desea evitar nuevas características por algún motivo:
- Si ha cortado imágenes en una tabla y no desea repararlas, vaya a HTML de transición 4.01:
- Don & amp; apos; t escribe páginas deliberadamente en modo peculiar. Utilice siempre un & lt; pre & gt; DOCTYPE & lt; / pre & gt ;. Esto le ahorrará tiempo de desarrollo en el futuro y realmente no tiene ningún beneficio. IE6 está perdiendo popularidad rápidamente y al diseñar para este navegador (que es esencialmente lo que es diseñar en modo peculiar) se está limitando a sí mismo, a sus lectores y a sus páginas. Si debe escribir para IE 6 o 7, use comentarios condicionales para admitirlos, en lugar de forzar a los navegadores modernos al modo peculiar.
Por qué usar DOCTYPE
Una vez que usted y amp; apos; estén al tanto de este tipo de
& lt; pre & gt; DOCTYPE & lt; / pre & gt; al encender, puede afectar sus páginas web más directamente mediante el uso de & lt; pre & gt; DOCTYPE & lt; / pre & gt; eso indica lo que el navegador puede esperar de su página. Además, una vez que comience a usar & lt; pre & gt; DOCTYPE
& lt; p / & gt ;
Versiones del navegador y modo Quirks
DOCTYPE
Android & lt; br & gt ;
Chrome & lt; br & gt ;
Firefox & lt; br & gt ;
IE 8+ & lt; br & gt ;
iOS & lt; br & gt ;
Opera 7.5+ & lt; br & gt ;
Safari & lt; / br & gt; & lt; / br & gt; & lt; / br & gt; & lt; / br & gt; & lt; / br & gt; & lt; / br & gt ;
IE 6 & lt; br & gt ;
IE 7 & lt; br & gt ;
Opera 7 & lt; / br & gt; & lt; / br & gt ;
Netscape 6
Ninguno
Modo Quirks
Modo Quirks
Modo Quirks
HTML 3.2
Modo Quirks
Modo Quirks
Modo Quirks
HTML 4.01
Transitorio
Modo de normas *
Modo de normas *
Modo de normas
Transitorio
Modo Quirks
Modo Quirks
Modo Quirks
Estricto
Modo de normas
Modo de normas *
Modo de normas
Estricto
Modo de normas
Modo de normas *
Modo de normas
HTML5
Modo de normas
Modo de normas *
Modo Quirks
* Con este DOCTYPE, los navegadores cumplen con los estándares, pero tienen algunos problemas & amp; # x2014; asegúrese de probar. Esto también se conoce como & amp; # x201C; Modo de estándares casi.& amp; # x201D ;
& lt; / pre & gt; & lt; / pre & gt; & lt; / pre & gt;
& lt; / pre & gt ;
& lt; / pre & gt ;
& lt; / pre & gt ;
& lt; / pre & gt ;
& lt; / pre & gt ;
& lt; / pre & gt ;
& amp; # x203A; Informática
