Marcado estructural: codifica lo que quieres significar, significa lo que codificas

Si bien escribir el CSS real es simple, el hecho de utilizar CSS para crear sus diseños requiere de una manera de pensar un poco diferente a la que la mayoría de nosotros probablemente estamos acostumbrados.

En lugar de pensar en algo como “esto va aquí y eso allí” mientras trabajamos en una página o en un diseño, necesitamos pensar acerca de las clases de información de nuestra página y de la estructura de esa información.

Le brindamos al encabezado más importante una etiqueta <h1>, los subtítulos son marcados con etiquetas <h2>, etc. y los párrafos son párrafos.

Esto se conoce como un marcado “estructural” o “semántico”.

En lugar de colocar tu contenido dentro de tablas y de celdas de tablas, envuélvelo en elementos div. Brinda a tus elementos div una identificación (id) o una clase (class) que describa su contenido y/ o función, en lugar de su apariencia.