Revisión del libro: "Everything you know about css is wrong!"

Félix Zapata — 12 noviembre 2008, 20:05

Hace algunas semanas comenté sobre el anuncio de la publicación del nuevo libro de SitePoint titulado: Everything You Know About CSS Is Wrong! Hoy me ha llegado el libro y la primera impresión que me he llevado es que es muy pequeño; tan sólo tiene unas 120 páginas. 

Al ser tan corto me ha dado tiempo a leérmelo bastante rápido y la verdad es que me ha gustado. Cambiaría el título del libro por: "Cómo hacer estructuras de páginas con display:table y similares". El libro se basa en el hecho de la dificultad que existe a la hora de estructurar, maquetar, componer páginas mediante las técnicas actuales de hojas de estilo (CSS) y que mientras esta dificultad exista no se tome muy en serio el trabajo. 

En la primera parte del libro, aparte de hablar sobre la guerra de navegadores y sobre la que vuelve a haber actualmente expone los diferentes métodos para hacer estructuras: posicionamientos y elementos flotados (float) así como de sus ventajas e inconvenientes.

Basándose en la pronta salida de Internet Explorer 8 y de su, por fin, soporte de los valores display:table, display:table-cell el libro muestra ejemplos de lo sencillo que resulta realizar bloques y estructuras que son sólidas y no tienen problemas a los que nos solemos enfrentar normalmente (alturas, ajustes de color entre columnas, etc, etc). 

Incluso el libro trae una especie de preguntas frecuentes. Algunas de ellas:

  • ¿se puede usar este método para estructuras flexibles? (líquidas)
  • ¿pueden anidarse?
  • ¿cómo posiciono elementos dentro de estos bloques?
  • ¿están soportados los atributos rowspan y colspan? ¿se pueden simular?
  • ¿puedo cambiar el orden del contenido?

A partir de aquí, el libro ya deja en manos del lector el qué hacer. Obviamente la pega es que todo esto no funciona en Internet Explorer 6 y 7. Propone varias soluciones más o menos radicales:

  1. Ignorar navegadores "antiguos", es decir, en cuanto salga el 8 olvidarse del 7 y del 6.
  2. Proporcionar una estructura más simplificada haciendo uso de hojas de estilo condicionales.
  3. Usar ambos sistemas; trabajar para navegadores de última generación con display:table y demás y hacer uso de hojas de estilo condicionales para trabajar versiones para Internet Explorer 6 y 7 de una manera "tradicional".
Considero que la primera versión es muy radical y la segunda en términos reales no es factible ya que los clientes no quieren versiones con diseños simplificados. La tercera opción no es mala salvo que supone doble esfuerzo, pero como dice en el libro si no se empiezan a probarse los nuevos sistemas no se hará nunca.

Como nota curiosa, un elemento con un valor display:table no puede tener un valor position:relative ya que será ignorado. Vamos, que no podemos posicionar nada en relativo a un bloque a no ser que demos un rodeo mediante un "hijo"o un bloque aparte.

Finalmente, el libro hace un repaso a la futura versión 3 de hojas de estilo y a su sistema de estructuras y bloques.

 En resumen, muy muy recomendable y de lectura rápida ya que va directo al grano.

Comentarios

  1. Muy interesante Félix, y una muy buena ¡recensión!
    Yo también estoy de acuerdo con tu consideración en cuanto a método a adoptar.

    Marco Giacomuzzi — 12 noviembre 2008, 22:43

Como aplicar estilos al texto y crear enlaces.