Las clases estructurales combinan espacialmente los elementos definidos a través de las basic classes y component classes para crear las secciones que conformarán nuestras páginas.

Las clases estructurales se organizan en patrones dónde hay un elemento principal y varios elementos secundarios.

Los patrones estructurales, a su vez se agrupan en esquemas para crear estructuras complejas dentro de nuestro proyecto.

Nomenclatura

| Structural class principal:

nombre del patrón entre corchetes [Section]
Structural class secundaria:
nombre del patrón entre corchetes más identificador del elemento secundario [Section] V Wrapper

Patrones estructurales incluidos en The System

[Custom]

[Page]

[Section]

[Container]

[Grid]

Esquema estructural fundamental

Los patrones a su vez se agrupan en esquemas. Este es el esquema fundamental en el que se agrupan los patrones definidos en el punto anterior. Aquí podemos ver su relación en el DOM.

<aside> 💡 Es importante documentar los esquemas definidos en cada proyecto para poder reutilizarlos con facilidad.

</aside>