en CSS

Estructura html

Seguramente muchos ya habréis oí­do hablar de estos términos, pero si habéis llegado hasta aquí­ quizás estéis buscando respuestas a cómo construir una buena estructura HTML, o lo que es lo mismo, escribir código estructural. Para ello, si no os importa usaré el sí­mil del ingeniero y el escultor e intentar así­ definir la idea de estructura.

Pensemos en el escultor, concentrado en la forma, en la belleza, en los detalles de su magní­fica obra de 30MB de peso, orgulloso de su creación, una creación que nunca podrá sacar del taller porque no le cabe por la puerta. Bien, pues no pensemos más en ello, porque es una imagen bastante deprimente, pensemos cómo evitar eso.

Qué harí­a el ingeniero para evitarlo?

  1. Pues lo primero separar estructura de estilo en la producción.
  2. Contratar especialistas para cada una de las tareas, nada de chapuzillas multiusos (frontpage, fireworks…).
  3. Contratar a un buen capataz para que dirija la construcción de la pieza.
  4. Conseguir los mejores materiales y si los que hay en mercado no se adaptan, diseñarlos para ésta y próximas piezas.

Aclaremos esto un poco. Si nuestra obra fuese una gran escultura de dimensiones desproporcionadas, no es que no nos sirva el escultor, él nos hará el boceto, una reproducción en miniatura de lo que debe ser la obra una vez finalizada. En Web ese serí­a el trabajo del diseñador.

Ahora ya tenemos el diseño. Si fuésemos una empresa es posible que tuviésemos un diseñador, un maquetador y un programador. Pero como es muy posible que nosotros mismos tengamos que hacer todo, dividamos nuestras conciencias. Ya hemos terminado el diseño, bien dejemos nuestro lado artí­stico que descanse y se tome unas piñas coladas. Y saquemos nuestro capataz para que dirija la obra, extraigamos el maquetador que hay en nosotros, que es quien conseguirá que la obra sea tal como la concebimos al mismo tiempo que sigue los planos del ingeniero y dirige a los trabajadores. Cuales serán nuestros albañiles y alicatadores? bien aquí­ es donde entran XHTML y CSS. Obreros especializados cada uno en su disciplina.

Cómo crear código estructural?

Para crear código estructural deberemos olvidarnos del aspecto final de la obra. Sí­, habéis oí­do bien. Olvidar los colores, los tamaños de los marcos de las puertas e incluso del tamaño de nuestras estancias. Porque nuestra estructura tiene que ser flexible para poder ser no una sino muchas obras artí­sticas. Os acordáis del cubo de Rubik y la serpiente que convertí­amos en una esfera, en una cobra, en un perro… Bien pues más o menos esa es la idea, que podamos girar nuestras piezas y cambiarles el color y la disposición en el espacio para que el año que viene podamos modificarla y siga las tendencias del momento sin que eso implique hacer una obra nueva.

XHTML es un gran albañil, dispone de las mejores herramientas para crear los cimientos y el esqueleto de nuestra Estatua de la Libertad. A diferencia de HTML4, que permite mezclar ambas cosas, XHTML sólo crea estructura dejando a CSS que termine la obra una vez él ha finalizado su parte.

Os preguntaréis a qué corresponden los materiales en maquetación. La respuesta a esto está en la semántica y las clases css. La combinación de elementos y atributos CSS, así­ como las nuevas técnicas serán nuestros materiales y herramientas.

Después de tanto sí­mil, metáfora y comparación, imagino que todos estaréis pensando y quién o qué es el ingeniero en Web, qué hace? cuales son los planos? La respuesta a esto os la daré en un próximo artí­culo.

En próximos artí­culos también definiremos prácticas y metodologí­as del código estructural y entraremos en el concepto de semántica.

Que ustedes lo estructuren bien 😉

Deja tu comentario

Comentario