Cómo configurar Google AMP para sitios de WordPress: una guía fácil

Estás leyendo la publicación: Cómo configurar Google AMP para sitios de WordPress: una guía fácil

¿Tienes un sitio de WordPress? Definitivamente deberías considerar implementando AMP.

Todos sabemos que la cantidad de personas que intentan acceder a su sitio desde dispositivos móviles está aumentando rápidamente.

Pero la mayoría de los sitios NO son compatibles con dispositivos móviles todavía. Esa es la razón por la que Google inició un proyecto llamado AMP para asegurarse de que los sitios web cumplan con las expectativas de los usuarios.

Google AMP proporciona paginas cargando mas rapido a los visitantes móviles.

¿Sabías que un 1 segundo de retraso en la velocidad de la página web puede disminuir las conversiones tanto como 7 por ciento? (Fuente de Neil Patel)

Cuando alguien accede a su sitio desde un dispositivo móvil, ¿qué es lo primero que espera? ¡Velocidad!

Sí, la velocidad es el factor decisivo.

Entonces, si está buscando proporcionar páginas de carga más rápidas, asegúrese de implementar Google AMP.

En esta guía, hablaremos sobre

  • Cómo configurar Google AMP para blogs de WordPress
  • Beneficios y desventajas de usar AMP
  • Validación de problemas de AMP
  • Los mejores complementos de AMP para usar en WordPress

¿Estás listo? ¡Empecemos!

Cómo implementar Google AMP en los blogs de WordPress

¿Qué es Google AMP?

Google AMP, también conocido como páginas móviles aceleradas, es una iniciativa móvil de código abierto de Google que se lanzó para acelerar la web móvil.

Utiliza un tipo dedicado de HTML llamado AMP HTML que sirve la “versión simplificada” de cualquier página de su sitio web si tiene AMP habilitado.

Si alguien está visitando su sitio desde la Búsqueda de Google, Google almacenará en caché su contenido de AMP para cargarlo aún más rápido, ya que AMP usa AMP HTML, JavaScript, CDN, etc. para entregar la versión básica de su sitio a sus buscadores desde dispositivos móviles.

Es posible que ya esté familiarizado con las páginas de AMP. ¿Vio un ícono de rayo en el lado izquierdo de algunos resultados de búsqueda de Google en la vista móvil?

Así es como se ve;

Como puede ver arriba, las páginas habilitadas para AMP se indican claramente con un icono de rayo y AMP. Cuando una página se publica a través de AMP en Google, tendrá el símbolo de AMP junto a ella (icono de un rayo). Contienen el barebone de las páginas y por eso se cargan más rápido en los dispositivos móviles.

Beneficios de Google AMP

Hay un montón de beneficios de implementar Google AMP en los sitios de WordPress.

  • Tiempos de carga más rápidos (las páginas AMP se cargan en promedio un 88 % más rápido que su sitio móvil que no es AMP)
  • Un tiempo de carga más rápido siempre conduce a una mejor participación del usuario (¿a quién no le gustan las páginas que se cargan más rápido?)
  • Reduce significativamente las tasas de rebote (debido a que las páginas se cargan más rápido)
  • En última instancia, mejora su clasificación móvil
  • Mejores conversiones para sitios de comercio electrónico
  • AMP es un proyecto gratuito y de código abierto
  • Optimización automática de imágenes

Además, AMP es más útil para contenido no interactivo.

Si su sitio requiere demasiadas interacciones, lo más probable es que los estándares de código reducidos de AMP lo afecten. Pero si su sitio es básicamente “leído” por sus usuarios, entonces, no hay nada de qué preocuparse porque; AMP es una buena manera de aumentar la velocidad de sus páginas web sin perder funcionalidad.

Entonces, sí, hay muchos beneficios de implementar Google AMP en los blogs de WordPress.

Cómo configurar Google AMP en WordPress

Ahora hablemos sobre cómo puede implementar Google AMP en los blogs de WordPress.

Usar complementos de AMP para WordPress

WordPress es el sistema de gestión de contenido (CMS) n.º 1 del mundo por una razón: te ofrece un montón de complementos increíbles.

Hay un puñado de complementos de AMP disponibles para WordPress que lo ayudan a configurar fácilmente Google AMP en los blogs de WordPress. Aquí hay una lista de algunos de ellos.

Hablemos de cada uno de estos complementos de AMP para que pueda elegir el que se adapte a sus necesidades.

1. AMP para WP

Este es el mismo complemento de AMP que estamos usando actualmente en nuestro sitio relacionado con el alojamiento web Hosting Monks.

Este es uno de los complementos AMP ampliamente utilizados y fáciles de usar que agrega automáticamente la funcionalidad de páginas móviles aceleradas a su sitio de WordPress.

🔥 Recomendado:  ¿Qué es Quora y por qué lo necesita para su estrategia de marketing digital?

Así es como se ve (desde la página de Configuración).

La mejor parte de usar este complemento es que puede crear su propio tema personalizado usando el marco de trabajo de AMP.

También puede actualizar a su cuenta Pro si desea más diseños de AMP y más personalizaciones.

2. AMPERIO

Este es el complemento oficial de AMP para WordPress que admite la versión AMP totalmente integrada para todo tipo de sitios de WordPress.

Cuando instala y activa este complemento, todas las URL de publicación en su sitio de WordPress tendrán una versión “/amp/”. Eso significa que puede seleccionar cualquier publicación, agregar /amp/ al final de la URL para ver la versión AMP.

También le ofrece soporte de temas centrales para todos los temas principales de WordPress que van desde Twenty Ten hasta Twenty-Twenty.

Así es como se ve la página de configuración;

También le ofrece un modo estándar para que no necesite mantener versiones AMP y no AMP separadas.

Lo bueno de usar este complemento es que viene con una herramienta de validación (incorporada) que puede ayudarlo con los errores de validación.

Se muestran con sus respectivos bloques en el editor para que puedas corregirlos y mostrar páginas AMP para usuarios móviles. Echa un vistazo a la página de errores de validación.

Valida tu código AMP de Google

Una vez que configure AMP en sus sitios de WordPress (usando cualquiera de los complementos anteriores), debe validar su código AMP.

¿Por qué? Porque si su código AMP no se valida, Google no mostrará la versión AMP en los resultados de búsqueda.

Hay varias formas disponibles para validar su código AMP de Google. Hablemos de las dos formas simples de validar su código.

1. Utilice la extensión del validador de AMP: Hay una extensión de navegador útil para Chrome, que puede usar para validar su código AMP. Como comprueba automáticamente cada página para la validación de AMP. Si hay advertencias o errores, mostrará el número debajo del icono de la extensión y, una vez que haga clic en él, podrá encontrar advertencias o errores.

2. Uso Validador de AMP de Google herramienta: Esta es otra interfaz web útil que le mostrará en la parte inferior si su código AMP se aprobó o falló.

Así es como se ve;

Puede encontrar más detalles en el sitio oficial de AMP, donde puede descubrir todo, desde la validación de su código AMP hasta el manejo de errores de validación.

¿Las páginas AMP de Google son diferentes de las páginas optimizadas para dispositivos móviles?

Sí.

AMP ofrece una versión simplificada de su sitio móvil. Está construido principalmente para la velocidad.

Dado que las páginas de AMP están involucradas en la codificación básica, el diseño de las páginas de AMP puede parecer menos atractivo.

Las páginas optimizadas para dispositivos móviles brindan una experiencia de visualización óptima en todos los dispositivos, incluidos teléfonos inteligentes, computadoras de escritorio, tabletas, etc. Las páginas optimizadas para dispositivos móviles están optimizadas para los visitantes móviles sin comprometer los elementos de su sitio web.

En pocas palabras, las páginas AMP son útiles para tiempos de carga más rápidos, mientras que las páginas optimizadas para dispositivos móviles son mejores para la experiencia del usuario.

¿Sabías que las páginas de Google AMP se cargan más rápido? Sí, eso es verdad.

¿Sabes por qué? Las páginas de AMP son versiones ligeras y contienen los tres componentes más importantes de Google AMP que les ayudan a cargar más rápido.

  1. HTML de AMP: un subconjunto de HTML, con etiquetas y propiedades personalizadas como amp-ad, amp-IMG y amp-video
  2. AMP JS: un marco de JavaScript para páginas móviles que administra el manejo de recursos y da como resultado la carga asíncrona de todos los recursos externos
  3. Caché de AMP de Google: una CDN basada en proxy para entregar todas las páginas AMP válidas

¿Por qué es importante usar Google AMP en tu WordPress?

A Google le encantan los contenidos que son ricos y de alta calidad y ese tipo de contenido generalmente se detallará con muchos textos, tendrá representaciones gráficas en imágenes de alta calidad y tal vez videos.

Ahora, estas combinaciones de contenido a menudo harán que sus páginas se abran lentamente, especialmente para los usuarios de dispositivos móviles. De ahí la razón para crear un HTML orientado a AMP que seguramente lo abordará de manera eficiente.

Dicho esto, es importante crear esta opción de acelerar las páginas del sitio web en dispositivos móviles, ya que ayuda a retener a los clientes y aumentar las posibilidades de aumentar los ingresos por la causa de administrar sus negocios en línea a través de sus sitios web.

🔥 Recomendado:  La secuencia de correo electrónico de carrito abandonado que recupera el 19% de mis ventas (sin cupón)

Cómo optimizar su sitio web con AMP

Para los principiantes, es recomendable mantener al menos dos versiones de sus artículos. Las versiones originales de sus artículos, que es la que verán los visitantes de su sitio, y la versión AMP de esa misma página.

Es importante informarle que AMP no es compatible con cosas como JavaScripts de terceros y elementos de formulario, por lo tanto; es probable que no pueda tener comentarios en la página, formularios de clientes potenciales y todas las demás funciones útiles a las que ya está acostumbrado en una implementación estándar. Afortunadamente, actualmente hay un truco que parece resolver este problema.

También es posible que reescriba la plantilla de su sitio web para adaptarse a las restricciones. Por ejemplo, todo el CSS en AMP debe tener menos de 50 KB y también estar en línea. Deben poder cargarse usando una extensión de fuente amp única para controlar esa carga debido a la intensidad de carga de las fuentes personalizadas.

Además, los archivos multimedia deben manejarse de manera especial. Por ejemplo, todas las imágenes de su sitio deben utilizar el elemento de imagen de amplificador personalizado y deben tener una altura y un ancho explícitos. Además, si sus imágenes están en formato GIF, debe usar el componente extendido animado de amplificador independiente.

De manera similar, si desea incrustar videos alojados localmente a través de HTML5, hay una etiqueta personalizada que debe usarse llamada amp-video. También hay un elemento extendido separado llamado amp-youtube para incrustar videos de Youtube, que es lo que son la mayoría de los videos web.

Las presentaciones de diapositivas también tienen sus propios soportes a través de amp-carousel y cajas de luz de imágenes a través de amp-image-lightbox. También hay componentes extendidos para incrustaciones de redes sociales, incluidos Facebook, Twitter, Instagram, Pinterest y Vine.

Lo bueno aquí es que todas estas etiquetas y componentes no son nada difíciles de usar, solo tienes que jugar con ellos en el diseño de tu sitio web.

Para que Google y otras tecnologías compatibles con AMP detecten la versión AMP de su sitio, deberá editar la versión original de la página del artículo. La página del artículo original debe tener la siguiente etiqueta:

En la página de descubrimiento de AMP, también se menciona que algunas de las plataformas compatibles con AMP necesitarán metadatos de Schema.org para especificar con precisión el tipo de contenido de la página.

Finalmente, si planea obtener un beneficio de Google en el futuro mediante la implementación de AMP, debe obtener su esquema correcto porque, según ellos, se requieren metadatos de schema.org para que su contenido sea elegible para aparecer en la demostración de el carrusel de noticias de búsqueda de Google.

Cómo monetizar tus anuncios en páginas AMP

Con el aumento constante de los bloqueadores de anuncios, ahora es difícil para los editores monetizar fácilmente sus sitios. Para algunas personas, aumentar el tiempo de carga del sitio web ha sido un incentivo real para usar bloqueadores de anuncios que ayudan a mejorar el tiempo de navegación. Según Search Engine Land, AMP parece ser una buena solución a este problema con su declaración actual, como se ve a continuación:

Debido a esto, algunas de las redes publicitarias más populares en Internet ahora usan el componente extendido amp-ad, algunos de los sitios incluyen:

  • Publicidad de Google
  • Taboola
  • Rendimiento
  • plista
  • Servidor de anuncios inteligente
  • PuntoYAnuncios
  • Formulario de publicidad
  • volar
  • Tecnología publicitaria de AOL
  • AdReactor
  • Amazon A9
  • Doble clic de Google

Aquí se proporcionan ejemplos de cada red publicitaria.

Sin embargo, algunos editores no están contentos con AMP para WordPress, y el mayor problema que tienen todavía está en el área de la monetización. Esto se debe simplemente a que AMP está simplificado y tiene oportunidades de publicidad limitadas.

AMP permite anuncios, pero son más difíciles de implementar. Lo bueno es que Google está ampliando la cantidad de tipos de anuncios compatibles con AMP, aunque algunos editores informan que aún generan menos ingresos de AMP en comparación con las páginas móviles tradicionales.

Por ahora, es difícil decir con certeza cómo AMP afectará los ingresos de su sitio; Suponemos que tendrás que verlo por ti mismo en el futuro.

¿Google AMP tiene algún efecto en el SEO?

Según todas las indicaciones y los resultados que las personas continúan obteniendo de sus pruebas, Google AMP encaja perfectamente con el SEO y mejoran nuestros resultados en las SERP de Google.

🔥 Recomendado:  Google Tag Manager vs Google Analytics: ¿Cuál es la diferencia?

Cómo sabemos esto? Bueno, realice una búsqueda de algunos de los nombres famosos que conoce y verá por sí mismo cómo las páginas habilitadas para AMP ahora aparecen en la primera página de Google. Magia, ¿eh?

Bueno, eso es en gran parte gracias a la sorprendente introducción de Google de las páginas móviles aceleradas de Google.

Sin embargo, antes de terminar, nos gustaría compartir con usted las principales razones por las que su empresa se beneficiaría del uso de Google AMP.

  • Se carga 4 veces más rápido que las páginas móviles estándar.
  • Ayuda a clasificar su negocio en la primera página de Google
  • Le ayuda a tener altas tasas de clics.
  • Le ayuda a ganar más dinero con anuncios, ya que está dirigido a editores de noticias y creadores de contenido.

Explorar más tutoriales de SEO:

Preguntas frecuentes sobre Google AMP en blogs de WordPress

Aquí hay algunas preguntas importantes sobre la implementación de Google AMP en los blogs de WordPress en 2023.

¿Necesito redirigir a los usuarios al contenido de AMP?

Esta es una de las preguntas más comunes. No, no necesita redirigir a los usuarios al contenido de AMP. La razón es simple: Google enviará automáticamente a los visitantes que vienen de la Búsqueda de Google a las versiones AMP de sus páginas según sea necesario.

Pero tenga en cuenta que, si alguien en un teléfono inteligente visita su sitio web directamente, no será redirigido a la versión AMP de su contenido. Significa que NO verán páginas AMP de carga más rápida.

¿Debo instalar AMP en mi sitio o no?

Buena pregunta. En primer lugar, asegúrese de cómo se ven sus publicaciones usando páginas móviles aceleradas (AMP). Simplemente puede instalar AMP o AMP para el complemento WP. Después de activar el complemento, vaya a cualquier publicación y agregue /amp/ al final de la URL.

Eso es todo. Vea si le gusta el diseño barebone de su contenido (páginas). Instale AMP si lo encuentra útil (o si realmente desea brindar una experiencia de usuario más rápida a los usuarios móviles).

Nota rápida: Borre su caché o abra una ventana de incógnito para verificar su nuevo formato AMP.

¿Hay algún inconveniente con Google AMP?

Hay un par de razones por las que pocas personas no usan AMP e incluyen;

  • No puede mostrar widgets y ventanas emergentes ya que las páginas de AMP usan CSS y JS limitados
  • Además de Google Analytics, no se admiten otros análisis en las páginas habilitadas para AMP.

¿Cómo me deshago de Google AMP?

Si por alguna razón desea eliminar Google AMP, simplemente puede desinstalar el complemento AMP correspondiente instalado en su sitio de WordPress. Simplemente desactivar el complemento desactivará el soporte de AMP en su sitio web de WordPress.

Puede consultar este tutorial detallado de WP Beginner para deshabilitar correctamente AMP de WordPress (que también habla sobre cómo corregir cualquier error de redirección).


Reflexiones finales sobre el uso de Google AMP para WordPress

Agregar AMP a su sitio de WordPress es definitivamente una excelente manera de mejorar la experiencia general del usuario para los visitantes móviles. Pero tiene sus propias limitaciones, como tasas de rebote más altas, menos tasas de participación de los usuarios, como muchos notaron.

Así que asegúrese de instalar y probar la versión AMP para su sitio durante algún tiempo. Esté atento a su Google Analytics para ver si le está funcionando bien o no. Luego, puedes decidir si conservarlo o no.

¿Tiene alguna pregunta sobre cómo configurar Google AMP para sitios de WordPress? Háganos saber en los comentarios.

Tabla de Contenido