Los plugins para adaptar tu web de WordPress a móvil

Una presentación web responsiva (adaptable) es cada vez más importante en cuanto al diseño de páginas web con un enfoque Mobile First. La presentación en dispositivos móviles y similares se puede implementar en unos pocos pasos si utilizamos los plugins de WordPress especializados en la visualización para dispositivos móviles. Hemos analizado algunos de los plugins de WordPress para móviles más populares.

Más del 43 % de todas las páginas web se han creado con WordPress, pero muchas de ellas se están quedando anticuadas, al menos desde el punto de vista técnico. Probablemente conozcas este tipo de sitios que, por lo general, tienen un tipo de letra pequeño y apenas legible, imágenes que sobresalen de la pantalla y que exigen deslizar la pantalla o hacer zoom con dos dedos para ver el menú entero. El problema: crear un sitio web desde cero con una plantilla responsiva suele suponer mucho tiempo y esfuerzo.

Existen plugins que permiten hacer el diseño web responsivo sin tener que cambiar la plantilla de diseño y que ayudan a estar al día de los requisitos del enfoque Mobile First. Mejor aún, con esta optimización de tu sitio web puedes optimizar WordPress y mejorar tu SEO para móviles. Si vas a crear páginas web con WordPress completamente nuevas, se recomienda tener en cuenta el diseño responsivo a la hora de elegir una plantilla de WordPress.

Para poder ilustrar la vista de escritorio y la vista en dispositivo móvil, hemos creado una página de prueba con los siguientes parámetros:

• WordPress versión 5.9
• Plantilla de diseño: Twenty Eleven de WordPress.org

Este tema difícilmente puede ser descrito como responsivo: las imágenes se adaptan (un poco), pero el texto –y especialmente el menú– no. El problema puede resolverse con los plugins para adaptar tu web de WordPress a móvil. Hemos probado algunos de estos plugins para ver qué resultados producen en un sitio web de WordPress visto desde un smartphone. Las opciones de configuración se describen detalladamente en la presentación del respectivo plugin para versión móvil de WordPress.

* Comparación de precios basada en la versión Premium para 1 sitio web. ** Actúa como un paquete con muchos extras.

El plugin WP Mobile Menu es un plugin fácil de usar que se actualizó cuando salió WordPress 5.9.

El plugin alarga el tamaño de la página de WordPress añadiendo en la cabecera una barra de menú que muestra el título del sitio web y el botón de hamburguesa que despliega el menú en versiones móviles. El menú existente de la plantilla “Twenty Eleven” se mantiene. El plugin permite una profundidad de menú de dos submenús adicionales. Esta nueva barra es “sticky”, por lo que siempre permanece visible en la parte superior de la pantalla al desplazarse por la página. Una vez activado, el menú se despliega sobre el contenido.

Hay varias opciones adicionales que se esconden detrás de los siete elementos del menú que ofrece la interfaz de administración de WP Mobile Menu. Entre ellas se encuentran:

• Insertar un texto y/o un logotipo en la cabecera en lugar del título del sitio web que se ha insertado automáticamente.
• Al activar el menú se puede definir el aspecto del contenido superpuesto. Se puede escoger el color del menú superpuesto y sus elementos internos, así como sus delimitaciones.
• Insertar una imagen de fondo para el menú.
• Suprimir la visualización de elementos concretos cuando el menú está desplegado en una interfaz móvil.
• Uso de Google Fonts.
• Diseño personalizado del menú como, por ejemplo, con la creación de cinco botones de hamburguesa con diferentes estilos.
• Modos de presentación del menú: superpuesto al contenido o desplazándolo.

En la versión premium (de pago) de este plugin de WordPress se puede, entre otros, suprimir el menú de la versión móvil en unas páginas determinadas o se puede ajustar su apariencia por separado en cada una de ellas. También son posibles los menús de pie de página y otros modos de visualización del menú interactivo. Asimismo, se tiene acceso a más de 2000 iconos de diversas bibliotecas.

Este plugin de WordPress para móviles ofrece una interfaz de administración responsiva en el idioma que se haya establecido en el panel de control de WordPress. El plugin se mantiene en todo momento claro y es (prácticamente) intuitivo.

El panel de administración de Max Mega Menu ofrece, entre otros, lo siguiente en la versión gratuita:

• Crear elementos de mega menú horizontal hasta el tercer nivel.
• Realizar ajustes individuales para cada nivel del menú, incluidas las flechas de navegación.
• Organizar los elementos, en parte, mediante la herramienta drag & drop.
• Guardar tus propios diseños de menú como una plantilla individual.
• Diseño individual y personalizado con CSS/SCSS.
• Exportación e importación de plantillas de menú propias como archivos JSON o PHP.
• Fácil acceso a la documentación.

Para hacer uso de algunas funciones, es necesario tener conocimientos de HTML y CSS como, por ejemplo, para aplicar correctamente el “z-index” cuando sea necesario.

Los usuarios de la versión Pro tienen acceso a los menús Sticky, Tabbed, Accordion, así como a los menús verticales, más de 600 iconos de menú, 200 Google Fonts e insignias de menú para atraer la atención, así como la integración de WooCommerce y Easy Digital Downloads.

El plugin WPtouch de WordPress añade una plantilla de móvil ligera a la página web existente. El funcionamiento es claro y comprensible con el lenguaje escogido para el panel de control de WordPress. Los elementos y las funciones que solo están disponibles en la versión Pro aparecen resaltados en color.

De los plugins para adaptar tu web de WordPress a móvil que hemos probado hasta ahora, este produce el cambio más notable. Su diferencia más significativa con los anteriores es el uso del conocido personalizador para adaptar la vista al móvil. Con el botón “Cambiar a la plantilla móvil” se mostrará la versión móvil, la cual se puede gestionar muy cómodamente. Los desarrolladores han seguido las recomendaciones de Google a favor de una experiencia de usuario móvil eficiente y, por ello, han construido un plugin muy ligero. El sitio web para móviles parece tener un reparto más claro y el texto continuo es más fácil de leer.

En la versión gratuita, el administrador del sitio web dispone de las siguientes opciones:

• Hasta seis grupos de dispositivos/navegadores a elegir donde aplicar la página para móviles
• Personalización de la versión móvil en el Personalizador
• Activación del menú como desplegable o desplazando el contenido (off canvas)
• Ajuste de la posición del botón hamburguesa
• Libre elección de colores para el fondo, la cabecera, el menú, los enlaces y los encabezados
• Panel de administración disponible en 23 idiomas diferentes
• La plantilla original no afecta a la visualización en el escritorio ni a los demás ajustes de WordPress

La versión Pro, la cual no es muy económica, tiene una suscripción de 1 año que, además del soporte Premium, incluye más plantillas para móviles, la posibilidad de integrar publicidad, la función “Related Posts” y el uso de jQuery.

El plugin AMP for WP de WordPress para móviles es un proyecto de Google. Aplica las directrices desarrolladas por Google para mejorar la visibilidad y aumentar la velocidad de las páginas de WordPress, y lo hace de forma muy exhaustiva y coherente. El plugin también está pensado para ayudar a mejorar la clasificación de una página web en los resultados de búsqueda de Google.

El sitio web previo se modificó con un botón de menú de hamburguesa en la cabecera y un cuerpo de texto mucho más legible. En la configuración básica del plugin, la página resulta notablemente más rápida, el menú desplegado abarca toda la página y los submenús se abren y cierran perfectamente. Además, la barra de búsqueda está integrada en el propio menú que se superpone.

La configuración acompaña al cliente de manera casi auto explicativa –diferenciando entre principiantes y expertos– a través de los elementos del menú desde el panel de administración. El resultado es atractivo. Además, existe una extensa documentación online respecto a este plugin (en inglés).

Este plugin de WordPress ofrece una gran selección de opciones para su visualización en dispositivos móviles. La versión gratuita incluye cuatro plantillas y, según el desarrollador, más de 300 posibles variantes. Las funciones adicionales pueden adquirirse en la opción “Extensiones” del menú del panel de administración. Las funciones gratuitas incluyen:

• Soporte para Page Builders
• Cumplimiento del Reglamento General de Protección de Datos (RGPD)
• Eliminación automática del CSS no utilizado
• Compatibilidad con Google Fonts, incluso cuando se utilizan localmente
• Compatibilidad con varias herramientas de SEO
• Paginación útil (numeración de páginas) para contenidos extensos
• Soporte para Google Tag Manager, Adsense (AMP-AD) y Analytics Support, así como para otros proveedores de herramientas de análisis
• Posibilidad de adaptar los contenidos a los móviles y al escritorio de un ordenador
• Posibles publicaciones relacionadas
• Adaptación de imágenes mejorada
• Posibilidad de insertar vídeos de YouTube, Vime, Twitter, Instagram y Facebook
• Integración de 12 nuevas redes sociales
• Configurar la versión AMP como página de inicio específica y/o página web prioritaria

Las funciones de pago son, entre otras, las siguientes:

• Algunos métodos de gestión de publicidad
• Soporte para formularios de contacto especiales
• Opción de enviar boletines informativos por correo electrónico
• Multilingüismo con WPML, Polylang y WeGlot
• Vinculación con eCommerce
• Plantillas de elementos para CTA
• Más de 45 extensiones del mundo AMP

Además, AMP for WP no es lo mismo que el proyecto de código abierto Accelerated Mobile Pages (AMP). Este último se ha propuesto construir sitios web con mucho menos código de programación para que estos sean más rápidos. Si te interesa, puedes consultar nuestro artículo titulado plugins AMP para WordPress. El plugin AMP for WP puede considerarse apto prácticamente para ambas tareas. Adicionalmente, viene bien tener en cuenta los consejos sobre SEO en WordPress.