Secciones y Contenedores
Las secciones y los contenedores son la base estructural de las páginas creadas en Atomicat.
Una sección es un bloque importante de la página. Un contenedor se encuentra dentro de una sección u otro contenedor y contiene elementos de la página como texto, imágenes, botones, formularios, videos y otros componentes.
Cómo funcionan las secciones y los contenedores
Las páginas Atomicat se almacenan como una estructura anidada. El constructor utiliza esta estructura para representar el lienzo de la página, mostrar elementos en el Navegador y conservar el diseño al guardar o publicar.
| Elemento de estructura | Propósito |
|---|---|
| Sección | Área de la página principal, como héroe, beneficios, testimonios, precios, FAQ o pie de página. |
| Contenedor | Envoltorio de diseño utilizado para agrupar y alinear elementos dentro de una sección. |
| Elemento | El contenido visible o la interacción colocada dentro de un contenedor. |
Cuándo usar una sección
Utilice una sección cuando esté creando una nueva parte principal de la página.
Ejemplos:
- Área de héroe
- Beneficios del producto
- Prueba social
- Carta de ventas en vídeo.
- Formulario de captura Lead
- Bloqueo de precios o ofertas.
- FAQ
- Pie de página
Cuándo usar un contenedor
Utilice contenedores para organizar el diseño dentro de una sección.
Ejemplos comunes:
- Un diseño de héroe de dos columnas con texto en un lado y medios en el otro.
- Una fila de tarjetas de beneficios.
- Un bloque de formulario centrado dentro de una sección.
- Un área anidada que agrupa elementos de imagen, título, descripción y botón.
Los contenedores son especialmente importantes para el diseño responsivo porque controlan cómo se alinean, apilan y dimensionan los elementos secundarios en las vistas de escritorio, tableta y dispositivo móvil.
Seleccionar secciones y contenedores
Puede seleccionar secciones y contenedores directamente en el lienzo o mediante el Navegador.
Utilice el Navegador cuando:
- El elemento está profundamente anidado.
- Varios contenedores se superponen visualmente.
- Es necesario comprender la jerarquía de páginas.
- Quiere reordenar los artículos con mayor precisión.
Consideraciones de diseño responsivo
Al crear páginas responsivas:
- Siga anidando lo menos profundo posible.
- Utilice contenedores para agrupar elementos que deben permanecer juntos.
- Verifique la vista móvil después de cambiar los anchos, la alineación, el espaciado o el orden.
- Evite el uso de recipientes vacíos innecesarios.
- Utilice un espaciado constante entre las secciones repetidas.
Mejores prácticas
- Construya desde una estructura amplia hasta un estilo detallado.
- Mantener los elementos relacionados en el mismo contenedor.
- Utilice el Navegador para confirmar que los elementos estén colocados donde espera.
- Ahorrar después de grandes cambios estructurales.
Documentación relacionada
Preguntas frecuentes
¿Cuándo debo usar esta página sobre Secciones y Contenedores — Constructor de páginas?
Use esta página cuando necesite entender el flujo, la configuración o las decisiones relacionadas con Secciones y Contenedores — Constructor de páginas. Es especialmente útil antes de editar un recurso en producción, publicar cambios o revisar el comportamiento en un espacio de trabajo de Atomicat.
¿Qué debo revisar antes de cambiar Secciones y Contenedores — Constructor de páginas?
Confirme que está en el espacio de trabajo, proyecto, página, embudo, sitio o área de cuenta correcta. Revise permisos, cambios guardados, estado de publicación e integraciones conectadas antes de actualizar.
¿Cómo verifico que Secciones y Contenedores — Constructor de páginas funciona correctamente?
Previsualice la página o función afectada, pruebe el recorrido principal en una nueva sesión del navegador y confirme que formularios, redirecciones, seguimiento, productos, quizzes o publicación se comporten como espera.
¿Qué hago si Secciones y Contenedores — Constructor de páginas no funciona como esperaba?
Revise nuevamente la configuración descrita en esta página, guarde los cambios otra vez, limpie la caché del navegador si es necesario y pruebe una versión simple de la configuración. Si continúa, reúna la URL, detalles del espacio de trabajo y capturas antes de contactar soporte.