Pregunta

Acabo de empezar a trabajar para una empresa bastante grande y mi grupo administra todos sus sitios web públicos. Hoy abrí la hoja de estilo por primera vez y he visto más de 20 instancias de diseñadores que utilizan el truco de la familia de voz para corregir un error de IE. (No sé por qué permiten que los diseñadores gráficos escriban cualquier tipo de marca)

¿Cuál es la opinión pública general del hackeo de la voz y la familia? ¿Vale la pena recomendar el uso de comentarios condicionales de IE para incluir hojas de estilos personalizadas?

¿Fue útil?

Solución

Los hacks de cualquier tipo son peligrosos, ya que son propensos a tener efectos no deseados en futuros navegadores (muchos se rompieron con IE7). Las formas seguras de filtrar CSS son:

  • (Solo para IE) Uso de comentarios condicionales. Estos siempre funcionarán en los navegadores de Microsoft y siempre serán ignorados por todos los demás navegadores, ya que están dentro de los comentarios
  • Caracterización de funciones: usar selectores de CSS que solo son compatibles con los navegadores modernos para evitar que los navegadores más antiguos intenten interpretar las reglas. Sin embargo, el hecho de que un navegador reconozca la sintaxis no significa que la maneje correctamente. Todo lo que garantiza aquí es que los navegadores más antiguos no intentarán representar estas reglas, no que los modernos las hagan correctamente

Siempre que sea posible, use el subconjunto de CSS admitido correctamente por todos los navegadores principales. Esto está mejorando con el tiempo a medida que los navegadores con errores más antiguos caen a porcentajes ignorables de sus usuarios.

Otros consejos

La " voz-familia " hack, más conocido como Tantek Celik Box Model Hack, se usa para ocultar reglas específicas de CSS de IE4 / 5 en Windows debido a implementaciones incorrectas del estándar CSS en esos navegadores. Es un intento de entregar la hoja de estilo individual más correcta a todos los navegadores, sin recurrir a la detección del navegador ni a las múltiples hojas de estilo.

Irónicamente, este truco es el resultado de muchas horas-hombre (¿meses?) de experimentación y prueba para desarrollar una hoja de estilo compatible con los estándares que funciona en navegadores más antiguos, nuevos y futuros. Es una de las varias soluciones que se crearon para compensar el horrible estado de cumplimiento del navegador con el estándar CSS.

Consulte Diseñar con estándares web de Jeffrey Zeldman para obtener una visión más detallada de por qué el cumplimiento de los estándares (tanto como sea posible) es un objetivo digno, y por qué usar el navegador y las múltiples hojas de estilo solo causa dolores de cabeza. para el desarrollador:

http://www.amazon.com/Designing-Web-Standards-Jeffrey -Zeldman / dp / 0321385551 /

Un ejemplo es la carrera armamentista para mantenerse al día con las combinaciones de navegador / sistema operativo, sin mencionar los teléfonos móviles y otros dispositivos futuros con capacidad de navegación. El código de detección se debe cambiar con cada nueva combinación, y debido a la forma en que muchos navegadores se hacen pasar por Netscape Navigator, la detección puede convertirse en un trabajo de tiempo completo.

Otra buena referencia es el Proyecto de estándares web, que contiene mucha información y tutoriales sobre el tema:

http://www.webstandards.org/

Si mueve su estilo de codificación hacia el cumplimiento de las normas, generalmente no tendrá que preocuparse por el lanzamiento de futuros navegadores. Sí, aún tienes que probar contra ellos, pero no tienes que escribir y luego probar las hojas de estilo personalizadas para cada uno.

Mi sensación en este tipo de hacks es que debes evitarlos si puedes. Si es posible obtener la representación correcta en todos los navegadores sin tener que recurrir a tales travesuras, entonces debe hacerlo de la manera correcta. Sin embargo, a veces los navegadores tienen implementaciones de CSS con errores, y es necesario usar hacks como este.

No uses los condicionales. Utilice un selector de CSS , es mucho más elegante. Puede orientar las clases a navegadores individuales (y / o versiones):

.myClass {...}

.ie6 .myClass {...}

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top