Cómo Divi puede ayudarlo a guiar a los visitantes a través de páginas web largas

Publicado: 2017-04-14

No es ningún secreto que la creación de un excelente contenido de formato largo contribuye a una mejor clasificación en los motores de búsqueda. Sin embargo, esta estrategia puede resultar fácilmente contraproducente si el material es difícil de consumir o navegar, creando así una mala experiencia de usuario. Ahí es donde entra en juego la navegación en la página. Afortunadamente, Divi viene con un conjunto de características y módulos nativos para ayudarlo a guiar a sus lectores a través de dicho contenido.

En este artículo, primero explicaremos por qué debería considerar el uso de la navegación dentro de la página y luego le mostraremos tres formas en que puede implementarla con Divi. ¡Empecemos!

Por qué debería considerar el uso de la navegación en la página

ejemplo de navegación en la página

Las pestañas superiores son un ejemplo de navegación en la página. Cada pestaña representa un enlace a una sección particular de la página.

La navegación en la página es esencial en dos escenarios principales: contenido de formato largo en general y sitios web de una página en particular. A medida que el panorama se ha desplazado hacia el contenido de formato largo en los últimos años, la estructuración y organización adecuadas de ese contenido se ha vuelto más importante que nunca. La capacidad de atención está disminuyendo, y si las personas tienen que revisar demasiada información para llegar a lo que están buscando, es probable que las pierda.

La navegación en la página le permite presentar su contenido de una manera mucho más digerible, lo que aumenta la probabilidad de que su visitante se quede para explorar más de su contenido. Esto puede ayudar a mejorar la experiencia general del usuario, reducir las tasas de rebote y, con suerte, generar un mayor número de conversiones.

3 formas de ofrecer navegación en la página mediante Divi

Un método popular de navegación en la página (que cubrimos ampliamente en una publicación anterior) es usar hipervínculos de texto de anclaje que se vinculan a elementos internos en la misma página. Sin embargo, Divi ofrece varias otras formas excelentes de ayudar a guiar a sus usuarios a través de su contenido de formato largo. Le presentaremos tres de estas opciones y le mostraremos cómo implementarlas.

1. Habilite la navegación por puntos

Un ejemplo de navegación por puntos

Como puede ver en el ejemplo de la imagen anterior, una vez habilitada, la función de navegación por puntos aparece en forma de un menú de puntos en el lateral de su página. Cada punto representa una sección en esa página específica, lo que significa que su visitante está constantemente al tanto de en qué punto se encuentra. También hace que sea muy fácil saltar a cualquier sección haciendo clic en el punto correspondiente, eliminando la necesidad de desplazarse por montones de contenido.

Puede habilitar fácilmente la navegación por puntos dentro de cualquier publicación o página. Primero, asegúrese de que está usando Divi Builder y, si no es así, habilítelo haciendo clic en el botón morado Use The Divi Builder .

Utilice el botón Divi Builder

En la esquina superior derecha, en Configuración de publicación Divi ( o Configuración de página Divi si estás en una página ) , abre el menú desplegable Navegación por puntos y elige Activado .

Menú de configuración de Divi Post

¡Estás listo! La navegación por puntos debería aparecer ahora en su publicación cuando obtenga una vista previa. A medida que agregue más secciones, los puntos correspondientes se agregarán automáticamente al menú.

Una vez que haya habilitado la navegación por puntos, es posible que desee ver este video con consejos para diseñar su menú.

2. Separe el contenido mediante el módulo de pestañas

Un ejemplo de pestañas

El uso de pestañas puede ser una excelente manera de separar fragmentos de contenido, y puede crearlos usando el módulo Divi Tabs. Solo el contenido de una pestaña activa (la pestaña en la que acaban de hacer clic) será visible para sus visitantes. Esto minimiza la posibilidad de que los visitantes se sientan abrumados con la cantidad de material y les permite explorarlo a su propio ritmo haciendo clic en cada pestaña y consumiendo su contenido por separado.

Un ejemplo de un buen uso de las pestañas es cuando desea mostrar diferentes servicios en la misma página. Por ejemplo, si es una agencia digital que ofrece servicios de diseño web, marketing digital y marca, puede crear una pestaña para cada uno. Esto niega la necesidad de que el usuario se desplace hacia abajo hasta el servicio relevante, ofreciendo una experiencia general mejorada.

Para insertar un módulo de pestañas, en Divi Builder, seleccione Insertar columna (s) y elija cuántas columnas desea agregar. (Tenga en cuenta que solo necesita un módulo de pestañas para crear un conjunto de pestañas una al lado de la otra).

El botón Insertar columna (s)

Ahora haga clic en Insertar módulo (s) y elija Pestañas .

La pantalla Insertar módulo con el botón Pestañas resaltado

Llegará a la pantalla de configuración del módulo, donde puede hacer clic en Agregar nueva pestaña .

La pantalla de configuración del módulo de pestañas

Esto lo llevará a la pantalla de configuración de pestañas individuales. Aquí debe ingresar su título y contenido, luego hacer clic en Guardar .

La pantalla de configuración de pestañas

Ahora ha terminado de crear su primera pestaña. Puede repetir este proceso hasta que haya agregado todas las pestañas requeridas y su contenido.

3. Insertar acordeones o alternar

Un ejemplo de acordeones

Los acordeones son muy similares a las pestañas, con la principal diferencia de que el contenido aparece en una lista vertical. Siempre que hace clic en un elemento de acordeón, cualquier otro elemento expandido se colapsa y se muestra el contenido del elemento en el que se hizo clic.

Los conmutadores también son de naturaleza similar, excepto que hacer clic en un elemento conmutador no colapsará otros. En cambio, el contenido de todos los conmutadores seleccionados se mostrará simultáneamente.

Un lugar popular para usar estos elementos es en las páginas de preguntas frecuentes. Son convenientes porque las personas pueden ver todas las preguntas a la vez y solo ampliar las respuestas relevantes para ellas. Tanto los acordeones como los conmutadores se pueden agregar fácilmente en Divi usando el módulo Acordeón y el módulo Alternar respectivamente.

Insertar un acordeón en Divi es similar a agregar pestañas, ya que puede agregar varios elementos en cada módulo. Siga los pasos para insertar un módulo anteriores, excepto que esta vez, seleccione Acordeón en lugar de Pestañas .

La pantalla Insertar módulo con el botón Accordian resaltado

En la pantalla de configuración resultante, haga clic en Agregar nuevo elemento .

La pantalla de configuración del módulo Accordian

En la siguiente pantalla, ingrese su título y contenido, y presione Guardar . Luego puede repetir esto para cada elemento en su acordeón.

La pantalla de configuración de elementos de Accordian

Crear un conjunto de conmutadores en Divi también es similar a agregar pestañas, pero la principal diferencia aquí es que creará un nuevo módulo de alternancia para cada fila de contenido. Para insertar la primera alternancia, después de hacer clic en Insertar módulo (s) , seleccione Alternar .

La pantalla Insertar módulo con el botón Alternar resaltado

Ahora se le presentará la pantalla de configuración del módulo donde puede agregar el título, elegir un estado predeterminado (si la palanca debe estar abierta o cerrada de manera predeterminada cuando el visitante llega por primera vez a su página) e insertar su contenido. Cuando haya terminado, haga clic en Guardar y salir .

La pantalla de configuración del módulo de alternancia

Para agregar el siguiente módulo, haga clic en Insertar módulo (s) debajo del primero, y nuevamente seleccione Alternar e ingrese los detalles apropiados. Continúe agregando módulos hasta que su conjunto de conmutadores esté completo.

Conclusión

Investigar y escribir contenido de formato largo que proporcione valor a su lector es a menudo una tarea que requiere muchos recursos. En consecuencia, es muy frustrante poner todo ese esfuerzo solo para que su contenido sea abandonado a la mitad debido a una estructura y usabilidad deficientes.

En este artículo, hemos explicado por qué es posible que desee considerar la navegación en la página para su contenido y ofrecemos tres formas diferentes de abordarlo utilizando Divi. Recapitulemos esos métodos rápidamente:

  1. Habilite la navegación por puntos en sus publicaciones y páginas.
  2. Separe el contenido usando el módulo de pestañas.
  3. Inserta acordeones o alterna usando el módulo Acordeón o el módulo Alternar.

¿Tiene algún consejo para guiar a los visitantes a través de páginas web largas? ¡Compártelos con nosotros en la sección de comentarios a continuación!

Imagen en miniatura del artículo de Graphic farm / shutterstock.com