soy Kseso y esto EsCSS

¿Guerra en las Regiones Css? Ellos se pelean, nosotros perdemos

El estado y soporte de las Regiones Css y de los intentos por que desaparezcan

¿Guerra en las Regiones Css? Ellos se pelean, nosotros perdemos

·Por Kseso ✎ 1

Regiones Css en el punto de miraHay propuestas Css que por su vistosidad y efectos visuales enseguida calan entre los desarrolladores. Este interés se traduce en múltiples demos con usos imaginativos, depuración, clamores por el pleno desarrollo de su especificación, soporte e implantación por los navegadores (y descrédito si no lo hacen).

Otras, especialmente aquellas que son subyacentes a la tramoya o composición de la página, pasan más desapercibidas por el público en general. No captan ese interés, por lo que no son protagonistas de innumerables artículos divulgativos, lo que hace a su vez que no se produzca esa demanda/presión del ecosistema web para que devengan en plenamente funcionales.

Un ejemplo de estas últimas, al que yo personalmente vi un gran potencial, es el caso de las regiones Css (Css regions). En este blog, allá por Agosto de 12, las incluía en un artículo hoy obsoleto en algún detalle.

Regiones Css. Qué son

¿Recuerdas el "flujo del html"? Así, dicho de forma coloquial, la forma en que va apareciendo y colocándose el contenido del documento a lo largo de la página en función de su aparición en el marcado html.

Flujo que se puede alterar mediente css, ya sea por usar flotados, posicionar de forma absoluta (fixed es un absolute eparticular), usando el flexbox y sus items...

Pero estas formas actúan sobre el elemento (contenga o no otros elementos en él) de forma conjunta. También son claros tanto los pros como contras de cada una de las distintas técnicas. Especialmente aquellas que "sacan" al elemento del flujo.

flujo en regiones css
El flujo html en las regiones Css

Las regiones Css permiten controlar el flujo del contenido de una página entre distintas áreas o zonas llamadas regiones. Y estas regiones pueden ser o no adyacentes.

Las regiones css lo que posibilitan es crear distintas corrientes en el flujo sin que el contenido se vea fuera de él. O dicho de otra forma, en el fluir de un contenido y dentro del espacio que le tocaría ocupar podemos establecer islas (para un segundo contenido y su flujo) a la vez que el primer contenido se reparte por distintas zonas de la página.

Prometedor, ¿verdad?, mucho más si piensas en las regiones Css trabajando conjuntamente con Multi-column Layout CSS3COL, Grid Layout CSS3GRID, Flexible Box Layout CSS3-FLEXBOX o Template Layout CSS3LAYOUT.

Regiones Css. Su estado

El módulo Css Regions vio la luz como documento de trabajo del W3c allá por Junio de 2011 y a propuesta (elaboración del borrador) por Adobe. Desde entonces, el grupo de desarrollo (editores) ha ido cambiando y sacando nuevas versiones del documento cada seis meses más o menos. La última y por lo tanto actual (cuando escribo esto) es de Mayo de 2012.

Pero su estatus es el inicial o básico, "Working draft".

Soporte actual por navegadores

Si decimos que escaso es pecar de optimistas. En estos momentos puedes jugar con las regiones Css, siempre con prefijos privativos, en Chrome, Opera y Safari en iOS7. Eso sí, en Chrome y Opera tienes que activarlas, pues por defecto están off:

  1. Abre una pestaña en blanco y escribe en la barra de direcciones.
    1. En Chrome: chrome://flags/#enable-experimental-web-platform-features
    2. En Opera: opera://flags/#enable-experimental-web-platform-features
  2. Seleccionar "Activar" o "Enable", guardar y reiniciar el navegador.

Internet explorer, supongo que última versión, hace una cosa un tanto extraña y muy sui géneris usando (¿obligado?) un iframe para su -ms-flow-into

En esta página de Adobe puedes ampliar la info relativa al soporte por parte de los navegadores.

¿Guerra por las Regiones Css?

Todo lo anterior no es inusual ni nuevo en el desarrollo e implementación de las novedades Css. No es la primera propuesta que ve pasar el tiempo sin avances significativos. Las ha habido peores, como el cambio en la nomenclatura de las propiedades y valores del flexbox, por ejemplo.

Lo significativo y que me ha hecho evocar la palabra "guerra" asociada a las regiones Css es la aparición y proliferación de opiniones y artículos cuestionándolas o directamente renegando de ellas tras el anuncio por parte de Google de dejarlas fuera en el desarrollo de Blink (+info).

Hace unas fechas Håkon Wium Lie, CTO de Opera, publicaba un artículo en List Apart titulado "CSS Regions Considered Harmful". Literalmente "dañinas, perjudiciales o nocivas".

Construye todo su ataque a esta propuesta en base a un ejemplo o demo divulgativo, de los cientos existentes, de webplatform.org y en una de las imágenes ilustrativas del documento del W3c.

Sus razones o puntos para el ataque a las regiones Css son:

  1. Utilizan div's falsos (divitis)
  2. No son "responsive"
  3. Flujo de texto confuso
  4. Verborrea
  5. Reutilización de código

No seré yo quien desmonte estos puntos. Más que nada porque ni tengo el conocimiento de fondo ni la experiencia del autor y porque mi dominio del inglés es insuficiente para comprender a fondo todos los matices y razones del autor.

El desmonte ya se lo van haciendo otros autores, por ejemplo Brian Rinaldi en su artículo "Using CSS Regions in Responsive Designs", Sara Soueidan en "CSS Regions Matter" o manifestando su desacuerdo como @Chriscoyier vía twitter:

O se ve que desconoce o ha preferido ignorar publicaciones previas, como ésta de smashingmagazine, donde entre otros aspectos muestra el uso de las Regiones Css en layouts RWD, con @medias queries, unidades del Viewport o el control de su flujo con break-before o break-after

Lo que sí que me resulta curioso y llamativo, y por lo tanto me hace dudar de las verdaderas razones y finalidad del artículo son algunos detalles más que significativos.

  • De entrada, basar todo en una demo, más o menos acertada, es como pretender arrasar un bosque por el estado de un solo árbol ajeno al propio bosque.
  • El autor ni participa ni lo ha hecho en el pasado en ninguno de los distintos documentos que desarrollan las regiones Css. Tampoco su empresa, Opera.
  • En algún momento confronta las Regiones con las multicolumnas Css. Salen perdedoras las primera, claro. Y curiosamente en el desarrollo de las multicolumnas Css sí que figuran tanto el autor como su empresa. Y ¿adivinas quién es el autor de la demo de las multicol vencedora?

Ellos se pelean, nosotros perdemos

Todo tendría otro cariz de manifestar aspectos problemáticos objetivos en el desarrollo, implementación y uso de las regiones. Y de aportar soluciones... redondo.

Pero al confrontar un módulo Css en desarrollo con otro que ha tenido mucho más recorrido, parece que su autor, pese a toda su experiencia y valía en la mejora de Css, haya perdido un poco el norte. No ve, o no quiere ver, que son complementarios, no excluyentes.

Porque el ser o no dañino no es algo inherente a un módulo Css. Es la aplicación práctica y el uso que de él haga cada uno en sus realizaciones.

Descubrir toda la potencialidad y practicidad que encierran las Regiones Css se logra y se descubre con su divulgación y uso masivo por parte de los desarrolladores.

Y es el público y usuarios en última instancia quien dictaminará, a la larga, si una herramienta es apropiada y útil a sus propósitos... hasta tener otra que la mejore.

Como pasó con las tablas, frames, flash, flotados, píxeles...

Pero pretender desacreditar y hurtar al público una novedad en desarrollo por parte de quién se supone que debería contribuir a su difusión y posibilidad de uso no creo que sea una buena forma de actuar.

avatar del Editor del blog

Ramajero Argonauta, Enredique Amanuense de CSS.
#impoCSSible inside
Dicen que, en español, EsCss es el mejor blog de CSS. Posíblemente exageren.
@Kseso EsCss Don Kseso Kseso