Editor X: reorganizar elementos por orden DOM

3 min de lectura
El Editor X está en proceso de transición hacia Wix Studio, nuestra nueva plataforma para agencias y freelancers.Más información sobre Wix Studio
Editor X te permite organizar el orden DOM de tus elementos con un solo clic. Al usar herramientas de diseño complejas como las pilas, los creadores de estilo o los repetidores, esta opción garantiza que los visitantes con discapacidades puedan leer tu contenido en el mismo orden en el que aparece en la pantalla. 
En este artículo, obtén más información sobre lo siguiente:

Comprender la importancia del orden DOM

Las tecnologías de asistencia utilizan el orden DOM para ayudar a algunos visitantes a encontrar la información que necesitan. Podrían estar usando una herramienta de lectura de pantalla o la tecla Tab en su teclado para navegar por tu página. De cualquier manera, el orden de tu DOM controla el orden de lectura. 
Al presentar contenido con muchos tipos diferentes de elementos (por ejemplo, texto, multimedia, botones), es importante verificar que el orden del DOM sea correcto. De esta forma, los visitantes pueden seguir una secuencia lógica y comprender completamente de qué trata tu sitio. 

Reorganizar automáticamente el orden DOM

Puedes reorganizar automáticamente el orden DOM de tus elementos en un creador de estilo, un repetidor o una pila. Optimizaremos el orden DOM para reflejar el orden visual, de izquierda a derecha y de arriba hacia abajo.

Para reorganizar el orden DOM:

Antes de comenzar:
Asegúrate de estar en el breakpoint más grande. Esta opción no está disponible para breakpoints más pequeños.
  1. Haz clic en Capas en la parte superior del Editor X.
  2. Selecciona el creador de estilo, el repetidor o la pila correspondiente.
  3. Haz clic en el icono Más acciones .
  4. Haz clic en Reorganizar orden DOM.
Pruébalo:
Utiliza una extensión de lector de pantalla en tu sitio publicado para verificar el orden DOM automático.

Organizar manualmente el orden DOM

¿Has detectado algún problema con el orden DOM de tu página? Puedes usar el panel Capas para organizar manualmente tus secciones y los elementos dentro de ellas.
Para que el orden del DOM coincida con el orden visual, las secciones deben organizarse de arriba hacia abajo. Los elementos dentro de esas secciones deben organizarse al revés, de abajo hacia arriba.

Para organizar manualmente el orden DOM:

  1. Haz clic en Capas en la parte superior del Editor X.
  2. Elige lo que quieres organizar:
    • Elementos dentro de una sección: organiza los elementos de abajo hacia arriba arrastrando y soltando los elementos.  
    • Secciones:
      a. Pasa el cursor sobre la sección superior y haz clic en el icono Más acciones .
      b. Haz clic en Ordenar.
      c. Haz clic en Poner al frente.
      d. Repite los pasos a-c con todas las demás secciones, de arriba hacia abajo en el panel.

¿Te ha sido útil?

|